Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more
On my SHOP page, I have COLLECTIONS right under the main header section: https://tgdbling.com/collections/all
When I click on a collection, it loads the correct products, but it doesn't move the screen down to the actual products... the page stays anchored at the top of the page... which I find to awkward. At first glance, it can appear that the link doesn't take the user anywhere.
Is there a way to change this? Can I set an anchor tag or something so that it functions intuitively? Thanks so much.
Hello @tgdbling ,
Try to add this script in theme.liquid just before the </body> tag
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
{% comment %} Don't use above library if its already availabe. {% endcomment %}
<script>
$(document).ready(function(){
$('html, body').animate({
scrollTop: $(".collection-list-wrapper").offset().top
}, 2000);
});
</script>
Thanks
Thank you I will try it and let you know! Thank you for your response!!!
So I've done it.... I refreshed my browser and checked it and no change. I also checked it in a different browser in case it was a cache issue, no change.
So I'm open to other suggestions and options. Thank you so much.