Skip to main content

Email Rendering FAQs

Learn how to troubleshoot common email rendering issues and ensure your emails display correctly across devices and clients.

Updated yesterday

Overview

This article answers common questions about email rendering in Knak.
You will learn why issues happen and how to fix them using best practices.


Why Does My Font Look Different in My Email Client?

Custom web fonts are used in Knak to match your brand.
Some email clients do not support these fonts.

When this happens, a fallback font displays instead.

Supported Email Clients for Web Fonts

  • Apple Mail

  • iOS Mail

  • Google Android

  • Samsung Mail (Android 8.0)

  • Outlook for Mac

  • Outlook App

What You Can Do

  • Choose fallback fonts that closely match your brand

  • Test emails across multiple clients before sending


Why Does My Email Break When Forwarded?

Forwarded emails often look different because email clients change how your email code is handled. This behavior is expected and helps keep emails readable across devices.

Why This Happens

  • Email clients like Gmail and Outlook remove parts of your email code when forwarding

  • Removed code includes responsive settings that control mobile and desktop layouts

  • The email falls back to a single layout

Best Practices

  • Use a simple, single-column layout

  • Avoid complex or heavily styled sections

  • Use mobile-friendly design whenever possible

  • Avoid relying on hidden content

Better Alternatives to Forwarding

Forwarding is not recommended for sharing emails. Use these options instead:

  • Share a live preview link

  • Send a test email

  • Use collaboration and approval tools

  • Export as PDF, PNG, or HTML


Can You Use Videos or GIFs in Emails?

GIF Support

You can upload GIFs in Knak. Some email clients only show the first frame.

Best Practice

  • Make the first frame meaningful

  • Ensure the message is clear without animation

Video Support

Videos are not directly embedded in most email clients.

Recommended Approach

  • Use a thumbnail image

  • Link to a hosted video

Learn more:


Why Is My Image Not Rendering Properly in My Emails?

Images may not display correctly due to formatting or hosting issues. Most problems come from incorrect image URLs or unsupported file types.

Common Causes

  • Image URL is broken or incomplete

  • File type is not supported

  • Extra characters appear after the file extension

  • Image is not publicly accessible

  • HTTP is used instead of HTTPS

Supported Image Formats

Make sure your image URL ends with a valid file type:

  • .jpg or .jpeg

  • .png

  • .gif

Do not include any extra text after the file extension.

Debugging Steps

Follow these steps to troubleshoot:

  1. Check the image URL

    • Paste the URL into your browser

    • Confirm the image loads

  2. Verify the file extension

    • Ensure the URL ends in .jpg, .jpeg, .png, or .gif

    • Remove any extra characters after the extension

  3. Confirm HTTPS is used

    • Update http:// to https://

  4. Check image hosting

    • Ensure the image is publicly accessible

    • Avoid private or expired links

  5. Re-upload the image in Knak

    • Replace the image block

    • Upload the file again

  6. Test your email

    • Send a test email

    • Check multiple email clients


How to Control Padding and Spacing on Mobile

You can adjust spacing for mobile devices.

Steps

  1. Select a content block

  2. Click the device toggle (desktop or mobile)

  3. Adjust padding and spacing values

Show the desktop/mobile toggle in the editor.

Why Are My CTA Buttons Not Aligned?

CTA stands for Call-To-Action. Misalignment happens when column content differs.

Best Practices

  • Keep content structure consistent across columns

  • Use the same order: image → text → button

  • Match text length across columns

  • Adjust spacing and padding as needed


Why Does Button Text Break on Mobile?

Text wraps when space is limited. This is expected behavior.

How to Fix It

  • Reduce text size

  • Increase mobile breakpoint

  • Adjust button width

  • Modify padding

  • Align text left for small buttons


Why Do Long Links Cause Rendering Issues?

Some email clients, like Outlook, do not handle long text well.

Issues

  • Text does not wrap properly

  • Layout breaks

Solutions

  • Use buttons instead of long URLs

  • Shorten display text

  • Add spacing where needed


Why Are URLs Auto-Linking?

Some email clients automatically convert plain text URLs into links.

What You Can Control

You can only control links added inside Knak or your Marketing Automation Platform (MAP).

Best Practices

  • Always insert links manually in Knak

  • Style links as needed

  • Avoid relying on auto-linking

How to Make a Link Look Like Plain Text

  1. Add a hyperlink

  2. Disable underline

  3. Match link color to text

Show link styling options in the editor.

Why Are My Links Going to a Broken Page?

Broken links often come from incorrect URL formatting.

Common Issue:

Using multiple ? in a URL.

Fix:

Replace extra ? with &

Example:

  • Incorrect: html?node

  • Correct: html&node

*Important note* Make sure your links always have the "https://" in the beginning of your link, otherwise the page will not display for viewers, and you will see this error when previewing the link in Knak.


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?