Skip to main content

Responsive Options in Knak

Learn how to utilize responsive options when building your emails and landing pages

Updated over a week ago

What are responsive options?

Responsive options are a powerful tool that allow you to customize the appearance of your assets based on the device they are being viewed on. They allow you to set different values for viewing your assets based on if they are being viewed on a mobile or desktop view. This means that you can have different layouts, font sizes, and other design elements for your assets depending on the device they are being viewed on.

How do I add responsive options in Knak?

Keep an eye out for the symbol that displays a monitor and a mobile device:

Image of monitor and phone screen icon for responsive options

This means that you are able to set different values for mobile and desktop view! You can add responsive values for padding, font size, alignment, and you can even hide sections based on what size screen you preview on! Make sure to preview to view any mobile changes you apply.

What is the Mobile Breakpoint that determines if you view the Desktop or Mobile Version?

If the user has a screen resolution less than 480px, this will trigger the CSS file to apply new styles to images to make them more suitable for a mobile device. Common CSS breakpoints based on device are:

• Mobile Devices: 320px to 480px.

• Tablets: 481px to 768px.

• Laptops: 769px to 1024px.

• Desktop Screens: 1025px to 1200px.

• TV and Extra Large Screens: 1201px and more (You can find more information in this blog post: https://knak.com/blog/responsive-html-email-templates/)

Frequently Asked Questions:

When I sync over my asset to my MAP, I noticed that the plain text for my responsive options is still displaying. Is this a bug?

The text gets generated for every component present in the email including the sections that are hidden on for mobile/desktop. If you would like to avoid this we recommend using responsive text/padding/alignment all in one section when possible to avoid duplicate text in the plain text version.


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?