Skip to main content

Add a Google Map to Your Landing Page

Embed a Google Map into your landing page using a Custom HTML block.

Updated today

Overview

You can display a Google Map on your landing page using an embed code. This helps you show a location clearly to your audience.

Before You Start

Make sure you have:

  • Access to your landing page in Knak

  • A location selected in Google Maps

Add a Google Map to Your Landing Page

Step 1: Add a Custom HTML Block

  1. Open your landing page in the editor

  2. Drag a Custom HTML content block into your layout

Dragging and dropping the Custom HTML block in the editor UI

Step 2: Get the Google Maps Embed Code

  1. Open Google Maps

  2. Search for your desired location

  3. Click Share

Share button in Google Maps

Step 3: Copy the Embed Code

  1. Click the Embed a map tab

  2. Click Copy HTML

Embed tab and Copy HTML button

Step 4: Paste the Code into Knak

  1. Return to your landing page in Knak

  2. Paste the embed code into the Custom HTML block

Empty Custom HTML block input field

Optimize Map Display (Recommended)

Update the Map Width

Google Maps sets a default width of 600px. This may not fit your layout.

  1. Locate the width attribute in the embed code

  2. Change the value to 100%

Example:

width="100%"

This helps the map scale to your landing page width.

Pasted embed code inside the HTML block with width value edited in HTML

Need more help? Contact support via live chat within Knak using the chat bubble in the bottom right corner or email support@knak.com

Related Articles
Import or Sync a landing page into Salesforce Marketing Cloud (SFMC)
Adding Video Content to a Landing Page
Add Google Tag Manager Tracking to Knak Landing Pages
Add Javascript to Knak Landing Pages
Adding a Countdown Timer to Your Landing Page
Did this answer your question?