Website looks very different when seen in Local version and when seen via Live link

Hi,

I’m developing a website in Local Wp, using WordPress and Elementor. Today, when testing the live link, to eventually send it to show the site to my client, I noticed that the menu looks totally different (I’m using an Elementor Mega Menu). It looks vertical and smaller when open. Also, there’s a video as a background in the first container, but it can’t be seen via Live link. What am I missing here? Please, advice.

Here are both images from both versions:

Website as I usually see it on Local:

Website as I see it when using Live link:

Update: I was able to solve the menu issue by switching the CSS printing method to internal on Elementor settings. The background video though, still doesn’t upload. Any ideas on how to solve this?

Live Links don’t match your Local Site URL (ie: mysite.local), so Local attempts to rewrite these on the fly. Live Links is broadly compatible with many themes, plugins, and custom code snippets. However, some images, front-end assets, or other HTML elements may be missing from your site when viewing it over Live Links.

As a first step you can try running a search and replace command to help clean up any mixed content type errors. To do this you can simply click on Open Site Shell in your Local app under your site name. The command would look something like this:

wp search-replace 'SITEURL' 'LOCALURL' --skip-columns=guid

As a tip you would:

You’ll also want to make sure you Trust Local’s SSL certificate, to help avoid insecure content as well.

If you’re still noticing issues, check to see if you have plugins or themes that retain caching or have a “Regenerate CSS” option. These may need to be refreshed in order for changes to be displayed.

There may be other plugins getting in the way as well if they are trying to force SSL/HTTPS.

If you’re still having issues you might open up the console of the page and see what errors are present. Is it still showing some mixed content or some other type of issue?

You might try viewing it in an incognito window, a different browser, or over LTE Data instead of WiFi to see if caching is getting in the way as well.

As another workaround, if you’re still having trouble, you could try pushing the site up to a Demo to see how it looks there. Flywheel offers free 14 day Demos that you could test out: Demo Site

So, does this mean that once it is indeed live, that it should display properly on the live site though without doing anything else? (same issue for me- thanks!)

It should! That’s not a guarantee however sometimes there are still needs for things like running a manual search and replace, flushing caches, etc. There are many variables that can impact this like your site’s configuration, your hosting environment, and how you move/migrate your site.