Template:Dropdown

Purpose
This template is used to create a hidden dropdown area that becomes visible after the user selects a keyword on the page. There are many different parameters that can be passed into this template, see the Usage section below for details. It is important to understand the structure of dropdown menus in order to get this template to work properly. The most important thing to remember is that every time this template is used, make sure to also close the dropdown area by adding a call to.

Usage
To use this template insert the code on a page, with a combination of the following parameter:


 * Page title=|
 * Page title will change the page title from the URL to whatever is set as Page title. For example,


 * Section title=|
 * Section title size=|
 * Section title will output the text that you enter, and will use Section title size as the text size value. Section title size must be a number from 1-5, since it will use this number to generate the size of the text using, , , , and . Following are the current text sizes for numberes 1-6:
 * This is text size 1, including the underline across the width of the section
 * This is text size 2, including the underline across the width of the section
 * This is text size 3
 * This is text size 4
 * This is text size 5
 * This is text size 6
 * This is text size 6


 * Section text=|
 * Section text size=|
 * Section text will output the text that you enter and will use Section text size as the text size value. Section text size must be a number from 1-5...please refer to Section title size=| above, for a detailed explanation of font sizes. At the moment, Section text and Page text are identical, placing text at the top of the current working area.  This may change in the future with different sizes based on which text is being defined.
 * example:


 * Page text=|
 * Page text size=|
 * Page text can be as much text as you need in order to explain something. It will be put above the Dropdown area.  If you wish to put a carriage return in the middle of the text, use   .  The text size that will be used will be  , unless Page text size is specified.  Page text size must be a number from 1-5...please refer to Section title size=| above, for a detailed explanation of font sizes.


 * Begin text=|
 * Begin text size=|
 * Begin text will place text immediately after the dropdown keyword, and will be visible after the user has selected the keyword to open up the dropdown area. If no Begin text size is used,   will be used to define the text.  Please refer to Section title size=| above, for a detailed explanation of font sizes.


 * Page image=|
 * Page image will place an image on the page, exactly as you specify the image. In other words, use wiki code to define the Page image.
 * example:


 * Dropdown title=|
 * Dropdown title will be the keyword displayed that the user must select in order to open up the dropdown area.
 * example:


 * Dropdown text style=|
 * Dropdown text style defines how the text for the Dropdown title will look. If you do not use this parameter,   will be used.  If you wish to have the dropdown look like a link, you can use the following.


 * example:


 * Previous dropdown title=|
 * Previous dropdown title is used when you create dropdown areas inside of dropdown areas. For example, when you create 3 top-level options such as Birth, Marriage and Death, and then create dropdown areas within each of those 3 top-level options, you will need to use the this template.  In the code that creates the dropdown area, a proper name is assigned to the area, so when the keyword is selected, the wiki knows exactly which area is to be opened or closed.  These areas are named based on the title (or keyword) given to that particular dropdown areas, however, sometimes there are duplicate keywords that are used on the same page.  (Example: Under Birth, Marriage and Death, you may want to create dates like '1850 to 1900', as keywords under all three of the main options.  In this case, when you create the 2nd level dropdown using these duplicate keywords, you must also define the keyword that was used as the top-level option.
 * example:


 * and

Troubleshooting

 * Text styles not working correctly
 * Due to layering of css files in php, sometimes another css file may take higher priority than specific code defined on a page. If this happens, you may not see the style that you defined, but will see whatever css file code has been defined as a higher priority.  In order to fix this issue, add !important after each style that you define.  This forces your style to take priority over any other style defined in the css code.


 * example:

If you are unable to get the dropdown areas to work correctly, there are several things that you should verify.
 * Dropdown areas not working
 * 1) Verify that all parameters passed into the Dropdown template are spelled correctly, with correct lowercase and uppercase letters.
 * 2) If any of the keyword links you have created are red in color, that means that the call to the template is not recognized.  Check spelling and spacing of the template name.
 * 3) Make sure all calls to  are coupled with a call to , however, you must include all information inside the dropdown area BEFORE.

Code Example
Here's a simple example of code, which can be used to create your own dropdown area on a page.

Inside each dropdown area, you can place images, links or additional dropdown options.

Inside each dropdown area, you can place images, links or additional dropdown options.

Inside each dropdown area, you can place images, links or additional dropdown options.

Inside each dropdown area, you can place images, links or additional dropdown options.

Inside each dropdown area, you can place images, links or additional dropdown options.

Inside each dropdown area, you can place images, links or additional dropdown options.

{	"params": { "Page title": {}, "Section title": {}, "Section title size": {}, "Page text": {}, "Page text size": {}, "Section text": {}, "Section text size": {}, "Begin text": {}, "Begin text size": {}, "Page image": {}, "Dropdown title": {}, "Previous dropdown title": {}, "Dropdown text style": {} } }