menu customization
-
I want to be able to click on the different menu selections and have the page scroll down to that section on the main page (home page) instead of going to a completely different page. Would this be a CSS? I’m not too sure. the theme I am using is venture
The blog I need help with is: (visible only to logged in users)
-
You wouldn’t use CSS for this, but it is doable.
Let’s say you’ve added a heading to start off a Services section on your page (any heading size will do, but I’m going to use Heading 1 for this example). If you click into the HTML editor view, you should see something like this…
<h1>Services</h1>If you add an unique ID to this heading we can link directly to it. So let’s change it to…
<h1 id="services">Services</h1>The heading is now linkable. You can click back into your Visual Editor if you’d like and save your changes.
Now in Customize > Menus, select your menu and click Add Items. Choose Custom Links and in the URL field type #services. The browser will see that hashtag, know that you’re linking to an element on the page, and take you directly to it.
Give it a go and let us know if it works! :)
-
-
All support docs are at http://support.wordpress.com
https://en.support.wordpress.com/?s=HTML+editor
Results https://en.support.wordpress.com/editors/#html%C2%A0editor -
Please see this page to learn about the Visual / HTML editors and how to switch between them:
-
-
that where i thought it was but because i didn’t see anything similar to what you were talking about, i got confused! haha
-
-
Ok, So i understand that concept, but i don’t think it is exactly what I’m looking for. My home page has “featured” content from different posts and portfolios. I want to click on the services on my main menu and it will jump down the page to all my portfolios, not a specific page…doe that makes sense? kinda like this website http://baliwasdental.com thanks!
-
Yep! You and I are on the same page. If you followed my steps correctly it should do exactly as you’ve described. The only difference is that the “smooth scrolling” effect in the link you provided requires javascript.
I’d suggest searching the WordPress themes directory for a “one-page” theme. This will bring your website closer to the example you linked to.
-
Im sorry I’m being such a pain, buts its not working well for me. Can you give me a direct example on my page? for example lets say Locations in my menu….i want it to jump down to where is has the two featured pages phoenix and beverly hills. Thanks for all your help!
-
@drderekwallin, @slfrsn has you on the right track.
Looking at your site, doing this is going to be tricky though, since there really isn’t anything at the top of your locations section on the main page to jump to. What I suggest is that we put the anchor at the end of the previous section (We Love to See…).
Open your front page in the editor, switch to the Text tab, scroll to the bottom of the content and add this and update the page.
<span style="color: rgba(0, 0, 0, 0);" id="go-locations">loc</span>
This creates the anchor at the very bottom of that page and the “style” declarations makes the anchor text invisible.Now, go to your custom menu and delete the “Locations” page menu item. Add a Custom Links menu item, put “Locations” in for the Link Text and in the URL field, put the following
#go-locations
If you wish, put Beverly Hills and Phoenix back as submenu items and save your menu.Visit your site and click on “Locations” in your top menu and it will take you to the Locations section.
-
- The topic ‘menu customization’ is closed to new replies.
WordPress.com Forums 