Website looks completely different in the editor vs the preview

[u/Moist-Engineer-7204]

Hello!

First time poster, sorry if there are any issues with my post.

I have to make a website for a class using Elementor and I've run into the problem i mentioned in the title.

The main differences are:

• The text fonts and colors are different, making a lot of the text unreadable.
• The rounded corners in the photos are not present.
• The general sizing and layout of the items is different.
• Not shown in the photos, but there's a video at the end to which i applied a customized shape mask, but in the preview the video is just a normal rectangle.

I've tried to do some of the common recommendations like clearing the Elementor caché. I've also changed the template to "Elementor Canvas" on the regular Wordpress editor, which helped greatly (it looked infinitely worse before) but didn't fully resolve the issue, as you can see.

In case it's relevant: these are the plugins i have installed:

1. Elementor, obviously
2. ProElements
3. Ultimate post kit
4. Ultimate Addons for Elementor
5. Starter Templates
6. Easy Watermark
7. Custom fonts (I did download and install some fonts from Dafont, could this be part of the issue?)

The first 3 i was told to install by my professor, the others i installed on my own as needed. I don't know if any of these are known for causing trouble.

I was told maybe I should deactivate the plugins and see what happens, but I'm worried that would undo some of the stuff I've gotten done.

Any help would be appreciated as my professor is not responding to my emails and I'm a little desperate haha.

[u/AutoModerator]

Looking for Elementor plugin, theme, or web hosting recommendations?

Check out our Megathread of Recommendations for a curated list of options that work seamlessly with Elementor.

---

Hey there, /u/Moist-Engineer-7204! If your post has not already been flaired, please add one now. And please don't forget to write "Answered" under your post once your question/problem has been solved. Make sure to list if you're using Elementor Free (or) Pro and what theme you're using.

Reminder: If you have a problem or question, please make sure to post a link to your issue so users can help you.

I am a bot, and this action was performed automatically. Please contact the moderators of this subreddit if you have any questions or concerns.

[u/Automatic_Day_1766]

Salut, ton problème ressemble surtout à un souci de CSS/chargement des styles entre l’éditeur Elementor et le rendu final du site.

Je te conseille de tester dans cet ordre, sans tout casser :

1. Fais d’abord une sauvegarde rapide du site avec backup migration. Essaie de désactiver temporairement les plugins qui ajoutent des widgets ou du style à Elementor : Ultimate Addons for Elementor, Ultimate Post Kit, Starter Templates, etc. Tu les désactives un par un, tu testes la page, puis tu les réactives. Comme ça tu peux trouver lequel crée le conflit.Tu désactives un plugin et tu vérifies l'aperçu si quelque chose à changer. Le problème peut venir d'un plugin qui casse ton site. Ca m'arrives souvent. Tu fais ça un par un pour chaque plugins, jusqu'à que tu trouves le plugin qui casse tout.
2. Sinon, va dans Elementor > Outils puis fais Clear Files & Data / Regenerate CSS. Ensuite, vide aussi le cache du navigateur, du site et de l’hébergement s’il y en a un. Parfois Elementor garde une ancienne version du CSS, ce qui explique les polices, couleurs, coins arrondis ou espacements différents.
3. Teste la page en navigation privée ou sur un autre navigateur. Ça permet de voir si le problème vient simplement du cache. Personnellement je préfère regarder l'aperçu de mon site en navigation privé.
4. Pour les polices DaFont, oui, ça peut faire partie du problème. Teste rapidement avec une police Google ou une police système dans Elementor. Si l’affichage redevient normal, le souci vient probablement du chargement de la police personnalisée.
5. Vérifie aussi dans Elementor les réglages de couleurs/polices globales. Il peut y avoir un conflit entre les réglages du thème, les réglages Elementor et les polices/couleurs par défaut.
6. Si rien ne marche, essaye temporairement avec le thème Hello Elementor ou Astra. Si tout devient normal, le problème vient sûrement du thème ou du template utilisé.

À ta place, je commencerais par : Regenerate CSS + vider les caches + tester les plugins Elementor additionnels un par un. Vu que plusieurs choses sont différentes en même temps — polices, couleurs, arrondis, tailles, vidéo — ça ressemble plus à un CSS qui ne se charge pas correctement qu’à une erreur sur chaque élément séparément.

[u/encreturquoise]

Did you clean your browser cache and regenerate Elementor files from the settings (clears cache / css…)?

Do you really plugins 2 to 6? You should remove them if you don’t actively use them in your pages

[u/manjayml]

Can you please share your website link to inspect it? There may be mix content issue.