This tutorial is specific to current versions of WP Bakery Page Builder ( Visual Composer ) but offers general techniques for building anchor menus.
An anchor menu will scroll the page when each menu link is clicked. All you need for an anchor menu to work is a unique ID assigned to each row or section of your page layout.
*Anchor menus work best on one-page websites.
Add Anchor IDs to Your Page
- View your page and click Edit Page. You will be brought into the page editor
- Click the pencil icon at the top-right of the row containing your first section to open the Row Options
- On the main tab of the current WP Bakery Page Builder you should find the Anchor ID field.
- Note: Older versions of the builder or themes that customize the Row Options panel may have this field listed under a different tab, such as "Extras".
- Enter a unique word into this field to serve as the Anchor ID. This must be lower-case with no spaces and not use common words such as menu, top, gallery, form, etc that are already used by elements of the page. Click Save Changes.
- Repeat for each section of your page, then Update your page.
Adding Anchors to Your Menu
See How to Setup Navigation Menus in WordPress for general steps on creating and managing menus.
- From the WordPress admin, click Appearance > Menus
- Click Create Menu and give it a name
- Expand the Custom Link section on the left
- Enter your desired Link Text for the link and then enter the first anchor ID to the URL field beginning with a hash
- Click Add to Menu
- Repeat to add each additional link