VoltCMS Blog Posts Jump in Safari

Hello friends. I’ve been developing a new site for a client recently, and updating a site for another client. Both sites use VoltCMS and the Blog Module.

With the new site I noticed that blog posts were jumping to the middle of the page when I opened them. This meant that the heading, at the top of the page, couldn’t be seen as it was automatically scrolling off the screen. Originally I thought it was something to do with my images. But this morning I updated a site for another client, and suddenly their blogposts started to do the same.

Here is the interesting thing. After more testing I discovered that the blog posts open fine in Chrome and Firefox. It just seems to be Safari that makes them jump. Has anyone else come across this? And more importantly any suggestions on how I stop this from happening? Thanks!

Blocs v5.0.6 / Safari 16.3

1 Like

I’ll have a look.

2 Likes

Jannis, I’ve had the simular thing happen. For me, when you click on a blog post, it goes to the post, and when I click on the first image to enlarge it to full screen when I click the X to close it goes to the top of the page. This only happens once. As you scroll down the page and enlarge the images and then close you are at the same place on the page.

Here’s an example: The Egret, Eel, and the Heron

Casey

Well, I didn’t change anything. Does this only happen in Safari?

No it happens in Chrome also. It’s done this for as long as I remember. Just wondering why on the first image you close it and it jumps to the top of the page? When you close any other image it’s right where you are on the page.

Casey

Thanks @Jannis. I’ve also noted that iOS Safari displays the same jump characteristic when I view these two VoltCMS blogs on my iPhone. Which points at it being more of an Apple problem, not yours.

1 Like

Hi,

Yeah its strange - just went on your website @casey1823 and as you said it makes it on the first time clicking on the first image shoot to the top of the page.

Had this in happen on Chrome, Safari and Edge.

Thanks, I’ll check.

1 Like

Doesn’t happen on my demo page, looks like something special for your website. Will need further investigation :male_detective: :mag_right:

Edit:

It’s something different. I am not able to reproduce this on any of my websites, and I have no idea why it’ is happening. I suppose it is something unrelated to Volt CMS.

Something maybe unrelated: Why is in your head area this line? <link rel="manifest" href="/manifest.json"> ?

Do you have an example blog URL? I see some same, some different results here.

Sorry, I forgot to add a link @Jannis. Look at the News pages on the PrideSaltire site. Other site that I am working on isn’t public yet. But the jump is the same.

Yes, I see this jump, which only appears on Safari, but when executing the JavaScript Volt CMS code, which is responsible for scrolling to the start of the blog post, separately after rendering of the page all looks fine in Safari, the start of the blog post is exactly hit.

I am not able to reproduce this issue on other pages of mine currently.

Are you aware of anything scroll related to your page, unrelated to Volt CMS ?

Hi all,

@Jannis , I am about to start a website and will be using Volt for various pages and a blog. I have used Volt for some of my live streaming websites which unfortunately get taken offline after the stream!!! but Volt has been brilliant and my clients loving using it.

This will be the first time using it for a long term website and just seeing if the issues @DerekDigital & @casey1823 which seem to be 2 different things are brought on my doing something I need to avoid as my client is quite particular in how it works. Could it be a conflict with something in Blocs 5 as they are only creeping in now?

1 Like

Not aware of any other scroll issues @Jannis.

This Pride Saltire site was working fine until I added the most recent blogpost, then the jumping started. However, I added a blog post to the news page of my gawrjuhs.art site on 09 March, and this didn’t produce the same jumping effect.

It’s not a real issue for me, as Chrome and Firefox display okay. But would be nice to know what is going on eventually. Thanks.

@DerekDigital - could this have happened since updating to the latest Blocs? or did you not touch the website and only use Volt? cheers

1 Like

The Pride Saltire, gawrjuhs art and new Dee Two site (still in development) all use the latest version of Blocs. Pride Saltire and gawrjuhs art were originally created in older versions of Blocs, but have been updated to the latest version. The Dee Two site I’m working on has been created using the latest version of Blocs from the start. But only the blogposts on the Pride Saltire and Dee Two jump. I did make a few small changes to the Pride Saltire site before adding a new post with VoltCMS. Perhaps I should trying making some design changes to the gawrjuhs.art site, and add a new VoltCMS post to see if that creates the same effect.

2 Likes

For anyone following this thread, I added a new News Item to my gawrjuhs.art site earlier this week. Everything is performing as expect. No jumping to the middle of the page etc. when you go to any news items from the main page. Or when you click the on previous/next buttons. If I discover what the cause of the problem is, with my other sites, then I’ll happily share with all.

2 Likes