Skip to main content
Solved

How can I show the mobile version in the desktop version? 

  • 27 May 2024
  • 2 replies
  • 110 views

How can I show the template of the mobile version in the desktop version? 

Like I want to display the mobile version on both desktop and mobile. How can I do that?

2 replies

Userlevel 3
Badge +7

Hey @sajeda 

Welcome to the community!

Just making sure I understand you correctly. You want to display the Mobile version on both desktop and mobile, correct?

Unfortunately, there's no direct toggle to force the mobile view in the desktop preview within Klaviyo's email editor, but you can use a workaround to achieve this:

  1. Media Queries: Use CSS media queries in your email's HTML to force the mobile styles to apply. You can set the same styles for all screen sizes to ensure the mobile design is displayed regardless of the device.

  2. Browser Developer Tools: In your browser, you can simulate a mobile device to see how your email looks. Here’s how you can do it in Chrome:

    • Right-click on your email preview and select "Inspect" to open Developer Tools.
    • Click the device toolbar icon (looks like a phone/tablet) to toggle the device mode.
    • Select a mobile device from the dropdown menu to view your email in mobile mode.
  3. Responsive Design Tools: Utilize tools like Litmus or Email on Acid, which allow you to preview emails in various devices and clients. These tools often provide more accurate renderings of how your email will look in different environments.

Here are some helpful Klaviyo resources and forum discussions that might help you further:

Hope this helps :)

Badge

@eCom2Win_Marketing Thank you so much bro! That helped! 

Reply