Custom CSS does not show in edit mode

  • 26 August 2020
  • 3 replies
  • 20 views

Hi,

I am quite frequently using custom CSS for fonts (font-face, weight, spacing etc.) for landing pages. Unfortunately, the final style is only visible once the page is published and not in the edit mode. This makes it quite difficult to align text boxes and other content since the custom font paragraph might be broader or longer. Also, if you use alignment functions like “distribute”, boxes might not be distributed equally after custom CSS is applied.

Is there a solution for this problem? I am facing it with all my projects.

Thanks and best
Julia


3 replies

Badge +3

It’s guess and check, in my experience, for better or worse. If you repeat similar layouts often, you can:

  • Duplicate pages
  • Download and upload .unbounce files
  • Copy-paste entire sections

Hi Adam,

thanks for your reply. This is what we have done but unfortunately with changing fonts and designs for different clients this does not really solve the problem…

Userlevel 7
Badge +3

Hi @julia.altitude,

Another “not so great” but doable hack around is to inline the CSS for the fonts. After that make sure you adjust your htaccess for the font files and allow app.unbounce.com to access said font files.

Once you load up the editor (use Chrome), the fonts would render just fine in the editor.

Best,
Hristian

Reply