RapidWeaver FAQ - Tear down menu







Share/Bookmark


How can I add a tear down menu in RapidWeaver?


Here's an example of this menu...



1. First we need the HTML code for the tear down menu, so here it is for a five choices menu:

Copy and paste it into a text editor so you can modify it as explained further on...

This is the code which needs to go in the header () part of the page. Copy it and paste it under “Page Info”, “Header”, “Header” again where it says “Custom Header”.

<script>
<!--
function land(ref, target)
{
lowtarget=target.toLowerCase();
if (lowtarget=="_self") {window.location=loc;}
else {if (lowtarget=="_top") {top.location=loc;}
else {if (lowtarget=="_blank") {window.open(loc);}
else {if (lowtarget=="_parent") {parent.location=loc;}
else {parent.frames[target].location=loc;};
}}}
}
function jump(menu)
{
ref=menu.choice.options[menu.choice.selectedIndex].value;
splitc=ref.lastIndexOf("*");
target="";
if (splitc!=-1)
{loc=ref.substring(0,splitc);
target=ref.substring(splitc+1,1000);}
else {loc=ref; target="_self";};
if (ref != "") {land(loc,target);}
}
//-->
</script>



2. Whereas this is the part of the code which has to go into the body part of the website where you want the menu to display:

<style type="text/css">
<!--

.combobox {
background-color: #000000;
color: #CCCCCC;
font-size: 8pt;
font-family: verdana;
font-weight: normal;
font-style: none;
}

-->
</style>
<form action="dummy" method="post"><select name="choice" size="1" class="combobox" onChange="jump(this.form)">
<option value="">Title of the menu</option>
<option value="http://yoururl.com*_top">name of the page</option>
<option value="http://yoururl.com*_top">name of the page</option>
<option value="http://yoururl.com*_top">name of the page</option>
<option value="http://yoururl.com*_top">name of the page</option>
</select>
</form>



Either paste this part of the code into your page, select it and go to "Format", "HTML" choose "Code".
Or add the code to the Sidebar by going to “Page Info”, “Sidebar” from the bottom-right of the window choose “HTML” then paste the code of the menu in the appropriate field.

3. In the code which goes into the body part of the page replace Title of the menu with the title you want to display when the tear down menu loads
Replace http://yoururl.com with the URL (address) of the page you want to open when people select that choice
Replace _top with _blank if you want to have the page opening in a new window instead of opening in the same window as you placed the menu
Replace name of the page with the title which should appear in the menu
To add more choices simply add more lines like this:

<option value="http://yoururl.com*_top">name of the page</option>



Of course you can also change the background color and all that stuff by modifying the style part of the code where it says .combox

If there are special characters in the titles you want to use you will have to replace them with the html code
Example: “é” would be replaced with

&eacute


A list of these codes can be found
here.


This FAQ is also discussed in my RapidWeaverFAQ.org E-Book (sample)

RapidWeaverFAQ.org - Tutorials, Tips & Tricks is made with RapidWeaver and for RapidWeaver.
It's an EBookStoreToday.com company. It's presented by Cédric Giger and hosted by HostGator.com

Thank you for visiting and supporting my website,
- Cédric -


Now share it…

Share