Skip to main content

Editing Image Properties

Discover how to can modify images in Knak emails and landing pages

Updated this week

Adding an Image to an Asset

Step 1: Insert an Image Block

Drag an image content block into your email or landing page column.

Dragging an image block into an email layout in Knak.

Step 2: Add Your Image

There are two ways you can add an image to your asset:

  1. Click Browse to upload or select an image from the Knak image library

    Browse image upload option from the Knak image library.


    Use the popup to upload or select an existing image

    Knak modal window for selecting or uploading an image

  2. Paste a direct image URL in the image attributes panel

    Image attributes panel with URL input field in Knak

Customize Image Settings

Edit Image Attributes

Once your image is inserted, adjust settings using the right-hand panel.

Edit

Click Edit to open the built-in image editor.

Image editor button in Knak.

From the Crop tab, you can:

  • Adjust image width and height

  • Rotate the image left or right

Image editor modal showing image crop dimension options.

From the Text tab, you can:

  • Add text boxes directly onto the image

  • Click Add text after entering content in the input field

  • Customize font style, color, and size

  • Remove text boxes by clicking the trash icon

Image editor text customization options for an added image.

Don't forget to click Save after making changes before closing the editor.

Use an Image URL Token

Enable the Use image URL token toggle to dynamically populate image URLs using merge tags from your marketing automation platform (MAP).

This feature is platform-agnostic, Knak simply stores whatever token syntax you enter. You can enter your MAP token directly, or (recommended) create a merge tag in Knak to simplify reuse and enable multi-platform support. Using merge tags is a best practice because they allow consistent image personalization across different MAPs.

How to set it up:

  1. Create a merge tag in the Integrations section under the Admin page of your Knak account. Learn more about merge tags here.

    • Example: Product Image URL

      Create merge tag popup modal.
  2. In the Image URL Token field, enter the tag using this format:
    {{!tag name!}}

    • Example: {{!Product Image URL!}}

  3. In the Image URL field, paste the same merge tag again:
    {{!Product Image URL!}}

  4. Use the Placeholder Image URL field (just below the Image URL Token section) to insert a fallback image that will display in the Knak builder.

When your email or landing page is synced with your MAP, the token (e.g., {{!Product Image URL!}}) will be automatically replaced with the actual image URL from your MAP.

Knak image token configuration with merge tag and placeholder image URL input

Note: These examples use placeholder values. Be sure to replace them with your company’s specific tokens based on your MAP setup.

Alternate Text

Add alt text to improve accessibility and describe images when they can’t load. If you're unsure what to write, use Knak AI Suggestions. Learn more about AI Assistants.

Alt text input field with Knak AI suggestion option.

Align

Set image alignment for desktop and mobile (left, center, right).

Image alignment settings.

Hover

Add a hover effect to invert image colors.

Highlight on hover image effect setting.

Image Width

Set the width to Auto for responsive scaling. You can also define widths separately for desktop and mobile views.

You have two options to adjust the width:

  • By percentage

  • By specific pixel value

Image width options.

Background Images

Use a background image behind content like text or buttons. This allows for more flexible design compared to static images with embedded text.

To apply a background image:

  1. Go to Section Attributes > Background

  2. Browse the Knak image library or paste an image URL

You can choose from the following background image sizing options:

  • Auto

  • Cover

  • Contain

  • Stretch

You can also adjust background image width separately for desktop and mobile views.

Section background image settings.

Add a Clickable Link

Expand the Link Type dropdown to make images clickable.


Options include:

  • Open to Webpage

  • Open in App

  • Send Email

  • Send SMS

  • Make Call

Image link attributes for image click actions.

FAQ

Why are my images linking to attachments in Gmail?


This is expected in Gmail for images wider than 300px without a link. Gmail opens them automatically.


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

Did this answer your question?