Issue transitioning homepage built in test page to live front page

[Tdrummer89]

Hi there,

So I have a homepage design created in the page builder that I’m trying to transfer over to the home page. When I try and transfer what I’ve built over to the Layout Editor, it has some issues that arise with the header. I have an animated logo that is not correctly aligned and the color of the header changes and I’m unsure how to resolve. I’ve included images of what the page should look like as well as what the page looks like on live.

HOW IT IS BUILT:

LIVE VERSION:

The mobile header does not have this issue, but it appears on desktop, laptop and tablet for the various breakpoints.

Any tips or advice would be appreciated. Thanks!

The header works correctly prior to adding the new content, as I had a “pardon our dust” landing page there prior to adding the new template. I tried adding via a saved template for the whole page, as well as via template for each section but alters the header as soon as i add even one of the new sections.

[ruenel]

Hello Tyler,

Thanks for writing in! It appears that you are using CDN. After saving your changes, you need to clear your CDN caches before testing the site again. Additionally, after doing the updates, always remember to clear all caches (if you are using WP Rocket, WP SuperCache or W3 Total Cache) when updating so that the code from the latest release is always in use. This will help you to avoid any potential errors.

And please clear your browser cache too. You may use private browsing mode in testing your site to make sure that you are viewing the latest codes from the updates and not the cached version in your browser.

Best Regards.

[Tdrummer89]

Thanks for the reply. What is CDN? A content delivery network?

[ruenel]

Hi Tyler,

Yes, your content delivery network is caching the site resources. To better assist you with your issue, kindly provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
- Confirmation that we can access and make changes to your site
​
To know how to create a secure note, please check this out: How The Forum Works

In the meantime, kindly check out this guide in troubleshooting common issues:

• Testing For Theme Related Issue
• Testing For Plugin Conflict
• Theme Update
• Child Theme
• Increasing Php Memory Limit
• Disabling Cache
• Disabling Cdn
• Permalinks
• Version Compatibility

Best Regards.

[Tdrummer89]

Thanks for your help. I’ve included a secure note on my previous post.

[ruenel]

Hello Tyler,

You are having this issue because in your homepage custom layout, you added a broken custom inline element CSS in the first section:

The correct and valid code should be:

@media(max-width: 767px) {
    $el .x-bg-layer-upper-image {
        background-size: 50px !important;
    }
}

@media(max-width: 480px) {
    $el .x-bg-layer-upper-image {
        background-size: 40px !important;
    }
}

Please see the secure note below for additional notes.

Tip:
Always indent your custom coding so that you will easily find out if you have closed the block or not. Proper use of { and } is a must to prevent any conflicts.

We highly recommend that you check all of your custom CSS code in your custom layout.

Best Regards.

[Tdrummer89]

@ruenel Thank you so much for your help. I was able to fix the issue with your assistance after swapping out that CSS code issue. I appreciate the assistance and hope you have a great rest of your weekend.

[ruenel]

You are most welcome, Tyler!