No problem ??
Would you mind adding some javascript in your theme template?
It would work properly because the way your theme works, we can’t use its generated ids.
The theme seem to apply an id on each section title, but the issue is that it applies the exact same id on all titles. This is not correct and cannot be used by CSS or other scripts, as ids must be unique.
In my opinion, the best way to do what you need is the following:
1.Add the following script in your theme/child-theme template (e.g. in footer.php just before the closing body tag):
(function($){
$(window).on("load",function(){
$("#panel2 .entry-title").attr("id","servicios");
$("#panel3 .entry-title").attr("id","que-se-cuece");
});
})(jQuery);
This will give proper ids to the 2 section (“Servicios” and “Qué se cuece”) titles (you can add more if you need).
2.Change your links URLs from:
#panel2 and #panel3
to:
#servicios and #que-se-cuece
accordingly.
3.Add the following to your additional CSS:
@media only screen and (min-width: 768px) {
#servicios, #que-se-cuece{
padding-top: 50vh;
}
}
This will make the page scroll to half the size of the viewport (50vh) before the section title (only on desktop).
Let me know
