Latest Blogs

10 Best Interior WordPress Themes In 2020
10 Best Interior WordPress Themes In 2020
Articles
Everyone desires to live in a cozy, professionally decorated and elegantly furnished apartment. There is no doubt that interior design plays an important role in our everyday life as well as website design. This carefully picked collection of 10 best...
112 Hits
Read More
Introducing Everline - beautiful and responsive wedding Joomla template
Introducing Everline - beautiful and responsive wedding Joomla template
News
Wedding is concerned as an important event happening only once in a blue moon for couples, and it's supposed to have a way to manifest memorable moments together. Let's start to celebrate your forthcoming commitment ceremony with Everline - A clean, ...
117 Hits
Read More
Autoshowroom Updated With New Home Rental Layout
Autoshowroom Updated With New Home Rental Layout
News
Hi folks,Today, we are extremely excited to announce that a brand-new home page named Home Rental is already available when you download the AutoShowroom WordPress Theme. ​AutoShowroom, an amazing WordPress design for Car dealership and automoti...
145 Hits
Read More
Top 7 Powerful Joomla Template Frameworks 2020
Top 7 Powerful Joomla Template Frameworks 2020
Articles
Choosing a Joomla template framework is concerned as an important thing for any web developer because it not only provides you with fundamental functionalities but also brings you the flexibility to create custom designs and then speed up the develop...
193 Hits
Read More
UPDATE: AVENTURA V1.9 GEARED UP WITH NEW LAYOUT
UPDATE: AVENTURA V1.9 GEARED UP WITH NEW LAYOUT
News
Aventura is a complete WordPress theme that creates an online booking system for tours and travelling business. The site has been designed for travel agency, tour operator, and other business in this niche market. Thanks to its excellent structure an...
224 Hits
Read More
Font size: + –
Subscribe to this blog post Unsubscribe
Print
how-to-create-one-page-menu-smooth-scroll-jollyany

How to configure Onepage Menu with Smooth Scroll on Jollyany

Articles
1454 Hits
Comments

Nowadays, mobile devices and social networks are on the rise. People tend to go to the internet in order to search everything by using their handy devices like mobile phones, tablets. As a result, single-page design is regarded as the most popular web trend at the moment.

With One page, your website will contain no additional pages like About Us, Services, Team Members, Contact. It's a long-scrolling layout. Visitors can easily digest the full content loaded within the same web-page, which helps make reading flow more continuous and fluid.

Today, I would like to share with you a simple way to achieve One page home with Jollyany - Multipurpose Joomla Template.

1. Create One Page menu

To have a straightforward navigation system, we first need to create a One Page menu, and menu items assigned to this menu.
Go to Menus > Manage > Add new menu > create a new menu name One Page Menu
Create One Page menu
Create One Page menu

Go to Menus > One Page Menu > Add new menu item

  • When creating menu items, you need to use menu item type: System Links >> URL
  • In the Link field, input a section ID for each menu item like #sectionname (this section ID shouldn't contain spaces or special characters and must start with #)
  • Assign the menu item to One Page menu
Create One Page menu
Add new menu item for One-page menu

2. Configure Astroid layout builder

In this step, we will use Astroid layout manager to assign each section ID to an appropriate section in the template layout, so that the users can scroll down or jump to that particular content's section when clicking on each menu item.

Let's head to Astroid layout manager!
  • Go to Extensions > Templates > Styles > your style > Template Options > Layout (Tab from the left)
  • Click to edit each section in the layout, and insert the Custom ID (without the #) you created earlier when creating the menu item.
Edit sections in Astroid layout
Edit sections in Astroid layout
Insert Custom ID to each section in the layout
Insert Custom ID to each section in the layout
  • Save the template settings and back to the Basic tab on the left, you can enable the option "Smooth Scroll" and set the scroll speed also.
Enable smooth scroll
Enable smooth scroll
  • ​Let's move to the tab Header, navigate the option "Site Menu", here you're supposed to opt for the "One Page Menu" previously created above.
Select One Page menu in the Site menu field
Select One Page menu in the Site menu field

Finally, I hope this article will be helpful for any users using Jollyany and looking for an instruction of how to create an One Page with Smooth Scroll with Jollyany Multipurpose Joomla template. If you encounter any trouble relating this topic, feel free to contact us, our technical team are eager to help you out. 

Tweet
Share on Pinterest
2
Tags:
Astroid Framework Onepage Multipurpose Jollyany
Introduce New Age - Creative Agency Joomla Templat...
[Monthly Update] Jollyany and Charity Joomla Templ...

About the author

Sonny

Sonny

I am Sonny. C.M.O at TemPlaza.com. I love travel, swimming and reading. Happy to meet everyone around the world.

Related Posts