In this Tutorial we’ll create a one page template scrolling within the areas of your Astroid framework template.
2 things we need to create a one page:
- Create Menu items that point to sections within the page using #sectionname.
- Using the Astroid layout manager, assign appropriate section ID’s to the sections where you’d like the user be scrolled for the particular menu item.
Let’s go ahead and create a new menu item (the menu item can be in your existing Joomla menu or you can setup a new menu for the one page view).
To create a new menu item, navigate to Menus >> Your Menu >> Add New.
Once there, Select System Links >> URL for the menu item type.
Add the appropriate menu item name and in the link field, input something like #sectionname, while replacing the section name with the section of your choice (section name shouldn’t have spaces or special characters and should always start with a alphabet).
Go ahead and save the menu item and let’s go back to the Astroid Layout Manager (Navigate to Extensions >> Templates >> Your Astroid Template >> Template Options >> Layout (Tab from the left)).
In here, click the edit section button under the appropriate section (this is the section the user will be scrolled to when clicking the particular menu item).
Add the same ID that was used earlier while creating the menu item in the Custom ID input, this time without the # in the beginning.
Save your template settings and your one page template will start working. You can enable smooth scroll by enabling the Smooth Scroll under Basic Settings.