Start Here
- Welcome
- Quick Start
- Learning Resources
Creating your first app
- Templates
  - Creating App From Template
  - Create Your Own Template
  - Softr Universe
- AI App Generator
  - AI App Generator Overview
  - Customize an AI-generated App
- Creating App From Scratch
  - Creating Blank Application
- Use Cases
  - Client Portals
  - Membership Sites
  - What Internal Tools Can You Build with Softr?
  - Peer-to-Peer Chat
Core Concepts
- Workspaces and Applications
- Pages and Blocks
- Data Sources
- Memberships
- Creating, Reading, Updating, and Deleting (CRUD) Data by Users
- Mobile Apps
- Templates
Displaying and Creating Data
- List
  - List Block Overview
  - List Filtering with URL
  - List Conditional Filters
  - Layout: List with horizontal cards and upvoting button
  - Layout: List with deletable elements, vertical cards
  - Layout: List with small cards
  - Layout: List with timeline
  - Layout: List with horizontal cards
  - Layout: List with columnar sliding cards
  - Layout: Inbox
  - Layout: List with horizontal sliding cards
  - Layout: List with vertical cards and tag
  - Layout: List with vertical cards and description
  - Layout: List with vertical cards and video
  - Layout: List with vertical cards and visible button
  - Layout: List with horizontal cards and visible button
- List Details
  - List Details Block Overview
  - Linked List
  - Comments
  - Use Case: Creating a User Profile with List Details
  - Use Case: Embedding Calendly in List Details
  - Layout: List details page with side image
  - Layout: List details page with image slider
  - Layout: List details page with video
  - Layout: List Details Page with 3 Column View
- Table
  - Table Block Overview
- Forms
  - Form Block Overview
  - Layout: Contact Form with Map
  - Layout: Customizable Form
  - Layout: Customizable Form with Labels
  - Use Case: Job Submission with Hidden Fields
  - Tutorial: Sending Form Data to a Data Source
- Charts
  - Chart Block Overview
  - Type: Bar Chart
  - Type: Stacked Bar Chart
  - Type: Line Chart
  - Type: Area Chart
  - Type: Scatter Chart
  - Type: Pie Chart
  - Type: Donut Chart
  - Type: Rose Chart
- Organizational Chart
  - Organizational Chart Block Overview
- Other
  - Calendar
  - Map
  - Kanban
  - Summary Cards
Data Sources
- Airtable
- Google Sheets
- SmartSuite (beta)
- HubSpot (beta)
- BigQuery (beta)
Debugging
- Troubleshooting Airtable errors
- Troubleshooting Airtable API call limit exceeded
- Troubleshooting Google Sheets errors
User Management
- App Users Basics
  - Add users to a Softr app
  - Users tab
  - Syncing users with a data source
  - Add or import users manually
  - Internal vs. External Users
  - User Email and SMS Notifications
- User Groups & Permissions
  - User Groups
  - Block Visibility
  - Page Visibility
  - Page Rules
  - Add users to a user group based on their Stripe attributes
  - Global data restrictions
- User-related Blocks
  - Signup Form
  - Signin Form
  - Signin with Email Code
  - Signin with SMS Code
  - User Profile
  - Forgot Password Form
  - Reset Password Form
- Advanced Sign-in Options
  - SAML Single Sign-on
  - Microsoft Azure SAML Single Sign-on
  - OpenId Single Sign-on
- Tutorials
  - How to make pages/blocks accessible only to company users
  - Personalize your app by adding the user's name to text fields
Basic Building Blocks
- Header
  - Header Block Overview
  - Layout: Header with sublinks and button
  - Layout: Header with links and buttons
  - Layout: Header with hamburger menu
  - Layout: Header with sublinks, icons, and description
- Hero
  - Hero Block Overview
  - Layout: Hero with call to action
  - Layout: Hero with email capture
  - Layout: Hero with video
  - Layout: Hero with appstore buttons
  - Layout: Hero with email capture and typewriter
- CTA
  - CTA Block Overview
  - Layout: Call to action with a button
  - Layout: Call to action with email capture
  - Layout: Call to action with a button on the right
  - Layout: Call to action with a text and action button
- Feature
  - Feature Block Overview
  - Layout: Feature with right side picture
  - Layout: Feature with left side picture
  - Layout: Feature with link
  - Layout: Feature with product demo
- Feature Grid
  - Feature Grid Block Overview
  - Layout: Feature grid with big icons
  - Layout: Feature grid with four column view
  - Layout: Feature grid with images
  - Layout: Feature grid with small icons
  - Layout: Feature grid with sections
  - Layout: Feature grid with three column view
  - Layout: Feature grid with box and three column view
  - Layout: Feature grid with steps
- Partner
  - Partner Block Overview
  - Layout: Partner with fixed logos
  - Layout: Partner with sliding logos
- Custom Code
  - Custom Code Block Overview
- Other
  - X (Twitter) Block Overview
  - X (Twitter) Grid
Settings
- App Settings
  - General Settings
  - App History
- Page and Block Settings
  - General Page Settings
  - General Block Settings
  - Page and Block Embed
  - Block Actions
  - Block Version Update
  - Linking Pages and Blocks
  - How to Set Up a 401 Page
  - How to Set Up a 404 Page
Design
- Application Theme
- Block Styles and Formatting
Custom Domain and Publishing
- Publishing
  - Publishing Your Softr App
- Custom Domain
  - Add a Custom Domain to Your App
  - Add a Custom Subdomain to Your App
  - Tutorial: How to set up a custom domain for Namecheap
  - Tutorial: How to set up a custom subdomain for Namecheap
  - Add an Extra Custom Domain to Your Workspace
Creating, Reading, Updating, and Deleting (CRUD) Data by Users
- Action Buttons Overview
- Add Record
- Update Record
- One-click update
- Delete Record
- Call API
- Download File
- Button Visibility
- Mapping Fields for Actions
- Item on Click Actions
Payments
- Stripe Billing and Payments
  - Simple Checkout Form
  - Simple Billing Block
  - Stripe Customer Portal
- Pricing Block
  - Layout: Pricing in card view with details
Blogs
- How to Create a Blog
- How to Create a Blog from a Data Source
Mobile App
- How to create a mobile app from a Softr app
SEO
- Softr SEO Checklist
- Site SEO
- Page SEO
- List Details SEO
Integrations
- AI
  - Open AI
- Authentication
  - Google Sign In
- Automation
  - Make
  - Zapier
- Cookies
  - Iubenda Cookie Solution
- Document Management
  - Documint
- Email
  - Mailchimp
  - Mailerlite
- Forms
  - Typeform
- Live Chat
  - Crisp
  - Drift Chat
  - HubSpot Chat
  - Intercom
- Maps
  - Google Maps
- Peer-to-Peer Chat
  - AtomChat
- Payments
  - Stripe Checkout
  - Buy me a Coffee
  - Gumroad
  - PayPal
- User Analytics
  - Facebook Pixel
  - Google Analytics
  - Google Tag Manager
  - Microsoft Clarity
Softr API
- API Setup and Endpoints
- Use Case: Adding Users through Zapier
- Use Case: Adding Users through Make (formerly Integromat
FAQ
- Domain Setup
- Airtable
- Pages, Theme, General Settings
- Memberships
- Softr Subscription Plans and Account Settings
- Translations
- Blocks
- Integrations
- App Settings
- Other
Support
- Giving access to your application
Translating Softr
- Weglot
Security
- Softr App Security
- Phishing
Account and Billing
- Accessing My Account
- My Profile
- Billing
- Pricing and Plans
Affiliate and Referral Programs
- Softr’s Affiliate Program
- Softr’s Referral Program
More

Layout: Contact Form with Map

A basic contact form with a Google Map.

This layout contains a basic contact form with a Google Map, which can be configured to show your address. Here you can find detailed instructions on configuring the map.

Did this answer your question?

😞

😐

🤩

Last updated on December 6, 2022

Form Block Overview Layout: Customizable Form