Single page Navigation - Is there a simple solution?

Hi,
Is there a simple solution to single page navigation in RW?

I wish to link to sections on the same page from the main menu. I’ve done a considerable amount of searching and can’t find a solution.

Big White Duck has MagicGellan but this seems to work only with Foundation and I have Foundry.

Seems like a simple thing to do. I have transferred from Adobe Muse which had this feature baked in as page anchors. I feel like I’m missing a simple fundamental piece of knowledge.

Any suggestions?

thanks

Hi, just use the mega menu from Foundry. In the page you use the anchor stack and from the mega menu you can jump to the anchor.

In the anchor you place a container stack with the content of the section. Check https://einfach-gute-seiten.de I use it this way there.

2 Likes

Hi Jan

thanks for the suggestion. It looks like it will be a solution, although it means purchasing way more than i need.
I just thought that it would be such a simple thing to do that I had overlooked a built in method like in Adobe Muse.

take care

Out

You might check out the free link & anchor.

2 Likes

I’m pretty sure you could use the link stacks @teefers posted in conjunction with a menu stack like one little designers clean menu, other menu stacks that allow custom links too probably, to get the effect you are after.
You could also add your anchored links as offsite page links in RW to make them part of the RW menu.

101 Ways to achieve this. I’ll add one which may seem a little arcane, but does prevent you from having to add a bunch of pointless offsite page (links). Assuming you are using the standard Foundry nav stack…

In the global javascript container add this:

$navbar = $('div.nav_bar_placeholder > nav > div > ul')

$links_arr = [
	'<li class=""><a href="#area_one" rel="" class="nav_item">Area One</a></li>',
	'<li class=""><a href="#area_two" rel="" class="nav_item">Area Two</a></li>',
	'<li class=""><a href="#area_three" rel="" class="nav_item">Area Three</a></li>'
]

try {
	$.each($links_arr, function(i,v) {		
		$navbar.append(v)
	});
} catch(error){
	console.log("Error adding custom links")
}

Now, customise the href links in the $links_arr to point to any html stack you fancy, anywhere you like on the page. Inside each html stack just add something like:

<div id="area_one"></div>

Thats just an empty div, of course, but the ID it uses corresponds to the href target in the content being injected into the main menu.

Not saying this is a perfect solution, or has been tested for compatibility with everything else under the Rapidweaver sun … but it works and avoids the need for extra stacks, apart from the very lightweight HTML stacks and it prevents having to add offsite pages (which they themselves would still have to point to something anyway).

Take a look at:
https://s3.ap-northeast-2.amazonaws.com/weavium-bucket/products/Ascend/preview_page/index.html

Hi Doug,

thanks for the link. I’ve tried it and it works with buttons in foundry although it’s not very elegant. It jumps rather than scrolls. Which may be fine.

Thanks Paul. Looks like ti would work well I’ll investigate further.

Hi Indridcold,

thanks for the suggestion. It is probably a bit too complex for my level of expertise. I’d much prefer a solution that means the CSS and javascript is kept at arms length.

Hi rollsize,

thanks for the suggestion i’ll investigate further.

This post was flagged by the community and is temporarily hidden.