I purchased the Awaal blog template from the hubspot marketplace. When the page loads, the browser thinks the hero section is the whole page and doesn't scroll down. Then if I scroll again, I can see the rest of the page. Also, this behavior happens anywhere on the page if I change scroll directions. If I stop scrolling and then scroll the other way, the page thinks what's on the screen is the entire page unless I stop and scroll again.
I've tested in chrome, safari, and firefox. All have this same problem.
Hubspot support suggested there could be conflicting JS on the page but couldn't resolve the issue. They suggested I post the problem here. Thanks in advance for your help!
nov 29, 20191:02 AM - editado nov 29, 20191:23 AM
Experto reconocido | Partner nivel Elite
Blog template scroll/load problem
resolver
The scrollbar is working just fine for me now with the overflow: hidden; gone.
However you still have the issue of the carousel not working. Is it possible the 1.7.x is built into the template because I'm still seeing it in the page. The 'error' they're pointing out is actually just a 'warning' they're seeing because they have content blocking enabled (as noted in the warning above that) because that script is for Hubspot analytics. It wouldn't have any effect on a carousel. This is the error I'm seeing on my end (in red):
which is a known issue with jQuery 1.7
Alyssa Wilie Web Developer LyntonWeb
If this answer solved your question, please mark it as the solution.
It looks like in the Awwal_Blog_Template stylesheet it has overflow-x: hidden set on html and body. I removed it using the browser inspector and the scrolling stopped behaving oddly.
Also, I'm seeing some jQuery errors in the console. Your site looks to be running 1.7.x. If you go to Settings > Website > Pages and scroll down to jQuery; change the jQuery version to 1.11.x. It may be 1.7.x is incompatible with the theme.
Alyssa Wilie
Web Developer LyntonWeb
If this answer solved your question, please mark it as the solution.
nov 28, 20199:25 AM - editado nov 28, 20199:51 AM
Miembro
Blog template scroll/load problem
resolver
Hi Alyssa, thanks for your response! I updated jQuery version to 1.11.x and removed
overflow-x: hidden;
but this didn’t fix the scroll issue I’m seeing. Also, the featured blog slider at the top of the page works when I preview the blog but it doesn’t when I make the blog live. It just stays on the first image. It doesn’t auto scroll and it doesn’t manually scroll if I click the arrows.
FYI I've made the blog live so it's easier to check out. This is where you can find the live version after I updated jQuery and removed overflow-x: hidden;
I'm actually still seeing the overflow: hidden in the styles and jquery 1.7 being used. Can you update again just so I can see if it had any effect on the errors in the console I'm seeing?
Alyssa Wilie Web Developer LyntonWeb
If this answer solved your question, please mark it as the solution.
nov 29, 201912:17 AM - editado nov 29, 201912:21 AM
Miembro
Blog template scroll/load problem
resolver
@alyssamwilie I changed it back to 1.7.x, saved, then back to 1.11.x, saved.
I reached out to the dev for this template and they said, "...it's not a CSS related issue. Your jQuery is conflicting with the template. If you look at the browser console you can see the jQuery error. I'm pretty sure this is the main reason you're getting two scroll bars in your template. Take a look at the screenshot below."
nov 29, 20191:02 AM - editado nov 29, 20191:23 AM
Experto reconocido | Partner nivel Elite
Blog template scroll/load problem
resolver
The scrollbar is working just fine for me now with the overflow: hidden; gone.
However you still have the issue of the carousel not working. Is it possible the 1.7.x is built into the template because I'm still seeing it in the page. The 'error' they're pointing out is actually just a 'warning' they're seeing because they have content blocking enabled (as noted in the warning above that) because that script is for Hubspot analytics. It wouldn't have any effect on a carousel. This is the error I'm seeing on my end (in red):
which is a known issue with jQuery 1.7
Alyssa Wilie Web Developer LyntonWeb
If this answer solved your question, please mark it as the solution.