I use it now to write a lot of code that I *could* write but don't want to spend the time on. It also said this with more ideas:
'Yes, there are a few other ways to offset the anchor point for one page scroll sections on a WordPress site. Here are a few alternatives:
- Use a plugin: There are several WordPress plugins available that can help you offset the anchor point for one page scroll sections. One popular option is the "Page scroll to id" plugin, which allows you to set a custom offset for each anchor link on your site. Simply install the plugin, activate it, and configure the offset value in the plugin settings.
- Add a scroll offset to your anchor links: Another option is to add a scroll offset to your anchor links directly, using JavaScript. This method involves adding some custom JavaScript code to your site, which will detect when an anchor link is clicked and adjust the scroll position accordingly. Here's an example of the code you can use:
javascript
jQuery(document).ready(function($) {
$('a[href*="#"]').not('[href="#"]').not('[href="#0"]').click(function(event) {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
event.preventDefault();
$('html, body').animate({
scrollTop: target.offset().top - 100 // adjust this value to the height of your sticky menu bar
}, 1000);
}
}
});
});
This code should be added to your site's JavaScript file, or to a separate custom JavaScript file if you're using a child theme. It uses the jQuery library to detect when an anchor link is clicked and adjust the scroll position accordingly, with an offset value of 100 pixels (adjust this value to match the height of your sticky menu bar).
- Add a top margin to your one page scroll section: Another option is to add a top margin to your one page scroll section, which will push the content down below the sticky menu bar. To do this, simply add a custom CSS rule to your site's CSS file, like this:
css
#your-one-page-scroll-section {
margin-top: 100px; // adjust this value to the height of your sticky menu bar
}
Make sure to replace "your-one-page-scroll-section" with the actual ID of your one page scroll section. This will add a top margin of 100 pixels to your one page scroll section, pushing the content down below the sticky menu bar.'
In my experience it is not totally right 100% of the time but you can usually tell it and it fixes itself until eventually you get what you need.