• Resolved acolburn15

    (@acolburn15)


    Hi, I’ve tried just about every fix in the book, but for some reason the live version of my site will not update correctly compared to the preview.

    -I cleared my browser cache completely.
    -Attempted to view the site in incognito mode.
    -Used different browsers entirely.
    -Purged my WP cache.
    -Also used different devices.

    After all of this, the live site still does not show what the preview shows.

    When I first created the site about a year and a half ago it displayed fine and has since until recent updates to the Neve theme. That is the only change.

    Any help would be appreciated.

    Thanks

Viewing 11 replies - 1 through 11 (of 11 total)
  • acurran

    (@acurran)

    I have the same problem. The preview displays as I expect it but not the live page. Seems like some of the styles are not hooked up. e.g. if I add a background image to a section, it shows up in preview but not on live page. I’m on latest version of everything as I just installed it today to try it out.

    • This reply was modified 4 years ago by acurran.
    rodicaelena

    (@rodicaelena)

    Hi there,

    Could you please provide some screenshots of the preview and the frontend, so I can better understand what’s not updating?

    Thank you,
    Rodica

    acurran

    (@acurran)

    Here’s an example that I just started playing around with:
    https://imgur.com/a/fJwqd1v
    I just installed the Neve theme on a fresh WordPress install and imported one of the demos and started playing around with it. The upper screenshot in that image is the preview and the lower one is the actual live page. The block element is the Otter section block. In the editor looks like this:
    https://imgur.com/a/fDt5gjh

    Even the original content from the demo is messed up too:
    https://imgur.com/NEg2rSM
    (again upper screenshot is the preview and lower is the actual).

    I’ve not set up a child theme, just using Neve directly.

    From checking with the inspector it appears that the missing styles are inline styles in the preview mode.

    rodicaelena

    (@rodicaelena)

    Hi,

    Could you please share the URL of your site so I can inspect the code?
    Also, are you using the latest version of Otter blocks?
    If you add an image in the Image block from the WordPress editor are you able to see that image on the site?

    Regards,
    Rodica

    acurran

    (@acurran)

    The website is not live and domain is pointing to a different website, but if you point triumphriders.co.nz to 149.28.176.14 in your local hosts file you can access it.

    Yes latest version – I only just installed everything fresh last week.

    Yes, image added with standard image block is visible.

    acurran

    (@acurran)

    The issue seems to be with the styles for the themeisle blocks that are inserted internally on the page. In live page source I see the styles are minimisied but in preview page source they are not. But expanding out and examining the styles I can see differences, e.g.

    in preview the styles start off:

    #wp-block-themeisle-blocks-advanced-columns-c69e212f {
    	padding-top: 80px;
    	padding-right: 20px;
    	padding-bottom: 80px;
    	padding-left: 20px;
    	margin-top: 0px;
    	margin-bottom: 0px;
    	min-height: 100vh;
    	background-image: url( https://triumphriders.co.nz/wp-content/uploads/T100_RBW-1410x793-1.jpg );
    	background-attachment: local;
    	background-position: center center;
    	background-repeat: no-repeat;
    	background-size: cover;
    	border-width: 0px;
    	border-style: solid;
    	border-color: #000000;
    	border-radius: 0px;
    }
     
    #wp-block-themeisle-blocks-advanced-columns-c69e212f > .wp-block-themeisle-blocks-advanced-columns-overlay {
    	background: #111111;
    	opacity: 0.56;
    }

    but in live page they start off:

    #wp-block-themeisle-blocks-advanced-columns-c69e212f {
       padding-top:80px;
       padding-right:20px;
       padding-bottom:80px;
       padding-left:20px;
       margin-top:0;
       margin-bottom:0;
       min-height:auto
    }
    #wp-block-themeisle-blocks-advanced-columns-c69e212f .wp-themeisle-block-overlay {
       filter:blur(0px) brightness(1) contrast(1) grayscale(0) hue-rotate(0deg) saturate(1)
    }
    rodicaelena

    (@rodicaelena)

    Hi,

    That’s weird. I’ve tried the same setup on my side and everything worked well.
    The only idea I have is to go to Settings > Otter and click on the Regenerate button that should regenerate the styles. http://snpy.in/0AuesW

    Let me know if that helps.

    Regards,
    Rodica

    acurran

    (@acurran)

    I just noticed that there was a new update available for Otter plugin, so I updated from 1.5.2 to 1.5.3 and this seems to have fixed the problem. After I made an edit and updated the page it now displays ok. I guess there was a bug in 1.5.2? (Sorry, in a previous response I just assumed I was on latest version because I only just set up the website afresh less than a week ago).

    rodicaelena

    (@rodicaelena)

    Hi,

    No problem. It’s good that everything’s well now. It’s possible there was an issue in Otter. Try to always make sure you have everything up to date 🙂

    Regards,
    Rodica

    wpdev241

    (@wpdev241)

    Hi,

    I have this problem, I have updated Otter, tried to view the site incognito etc.

    The only thing I am not getting is the Otter Regenerate option, this button is not active for me to be able to press it.

    I have no updates available and unsure where to go now.

    I can provide temporary access to the site if needed, its a fresh wordpress install and I have customised the Gym starter site.

    Thanks

    Liam

    wpdev241

    (@wpdev241)

    OK so I was given the ability to press the regenerate styles button in Otter and it now all works.

    Thanks for the advice guys!

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘Preview Displaying Different than Live Site’ is closed to new replies.