July 15, 2014 at 10:32 am #291482
Good morning all,
In case of a one-page (parallax) website which has a menu header, I would like it to be possible when I click on one of the items in the menu header that the page immediately scrolls down to that part of the page the menu item refers to.
I have a menu item called ‘Blog’. If I click on this menu item on top of the page in the menu bar, the page drops down to the part that refers to the Blog.
I hope I’ve explained myself correctly and would like to know which settings I have to adjust to create the example given above.
Sander KleijnJuly 15, 2014 at 10:41 am #291487
YigitJuly 15, 2014 at 1:02 pm #291558
Thnx for the quick feedback. I immediately used the layout item ‘color section’. That works well, except for the advanced layer sliders I’m using and the fullwidth Masonry I use for my blog.
The ALS and FW Masonry don’t seem to fit into the color section. Is there a way to solve this issue.
SanderJuly 16, 2014 at 2:57 pm #292089
You can set ID to LayerSlider as shown in screenshot here – http://i.imgur.com/0jhKfU1.png
You forgot to post the link to your website so i could not check but i guess you are using an older version of the theme. Please update Enfold to the latest version 2.9.1 via FTP – http://vimeo.com/67209750
Masonry element is not only fullwidth anymore
YigitJuly 16, 2014 at 7:19 pm #292191July 16, 2014 at 7:26 pm #292194
I just checked your website and you are using the version 2.7.1 and not 2.9.1. Please see the video tutorial about updating the theme via FTP in the link i have posted above.
Yes, you give an ID there. Then you can use it as an anchor point, please also see – http://www.kriesi.at/documentation/enfold/add-anchors-to-your-page-for-single-page-navigation/
YigitJuly 19, 2014 at 2:17 pm #293349
I updated the version to 2.9.1 and added the names of my pages to the ID under ‘attributes’ of all my layer sliders.
I then made sure to use ‘color section’ to both my parallax pages and added the name of the page to the ID section.
If I view the one page website, it still refers to the ‘page’ when I click e.g. ‘prijzen’ in the header. It doesn’t stay on the one-page website and scrolls down to the part that refers to ‘prijzen’.
What am I missing here? Would you be so kind to take another look.
SanderJuly 20, 2014 at 7:32 am #293544
Thank you for the update.
You don’t have to create a new page for the section. You need to use the Color Section element on the same page then add an id to it. Please review the article here: http://www.kriesi.at/documentation/enfold/add-anchors-to-your-page-for-single-page-navigation/
For example, create a color section with an id “blog” then a Blog Posts element to it. Create a new menu item called blog then add the anchor link which is “#blog”.
IsmaelJuly 20, 2014 at 7:35 am #293546
Could you specify what part (section or layerslider) refers to ‘prijzen’?
JosueJuly 20, 2014 at 5:58 pm #293630
Yes I can! In both parallax pages it’s the color section part which contains the Table, just above the color section with the Masonry (Blog).
SanderJuly 21, 2014 at 2:56 am #293689
Thank you for the info but I guess you’re doing it wrong. Please refer to my answer above.
IsmaelJuly 21, 2014 at 9:06 am #293742
I musrt be doing something wrong, cause it ain’t working! It’s just not clear to me, what it is I’m doing wrong, even with the info you gave me.
SanderJuly 22, 2014 at 6:13 pm #294513
I am sorry but i am a bit confused. I have checked all of your pages and you are not using one page layout. Could you please explain once again, which button should take visitor to which section? We can create one example and then you can replicate it
YigitJuly 22, 2014 at 7:57 pm #294545
Thank God, I’m not the only one that is confused :) :)
Visualizing by creating an example would be great, thanks very much!
As you can see in ‘Appearance>Menu’ I’ve created a different menu for each website I’ve created.
In this case I suggest we use the page Home Parallax D, as I’ve set the menu to this page. The menu consists of:
Button ‘Filosofie': this should take you to the section with the advanced layer slider that contains ‘Filosofie’
Button ‘Dingen': this should take you to the section with the advanced layer slider that contains ‘Dingen’
Button ‘Prijzen': this should take you to the color section which contains Table (right below the social media icons)
Button ‘Contact': this should take you to the color section with the ‘contact form’ and “Alle leven is ontmoeting”.
Regarding the advanced layer sliders ‘Filosofie’ and ‘Dingen':
With advanced layer slider ‘Filosofie’, under Attributes>ID I’ve added an Anchor to all the 9 layers…….
and with ‘Dingen’ I did exactly the same with every single slide.
I hope this information helps you to create an example.
SanderJuly 23, 2014 at 1:09 am #294693
Please go to Appearance > Menus > Manage Location and choose “one page” as your Enfold main menu. Then go to your page called “home-parallax-d-2″ and use navigation items to scroll to the sections.
YigitJuly 23, 2014 at 2:57 pm #294954
This works perfect! Thnx very much :)
I do have a question about the menu:
When I look at the one page menu you’ve created, I noticed all the elements are marked as ‘custom’, and there is a URL added to it. In my other menus all the elements are marked as ‘page’. How do I change this into ‘custom’, in case I want to add another element or use ‘home-parallax M & D’ as a one page website.
SanderJuly 23, 2014 at 3:42 pm #294974
You are welcome :)
You can add custom links in Appearance > Menus > Links as shown in screenshot here – http://i.imgur.com/JUdaLsZ.png
YigitJuly 23, 2014 at 6:31 pm #295067
Many thnx for your persistance! Both parallax versions work like I imagened.
It’sjust that the customizing part in the menu wasn’t clear to me :) :)
If I decide to use the one page version, is it possible then to delete the individual pages I’ve created without doing any harm?
SanderJuly 23, 2014 at 7:59 pm #295098
You must be logged in to reply to this topic.