Please vote and give your opinion about Today's Topic at Talk:Topics!
User info boxes
From WWR
How to put an userbox on a page
- Copy the "template tag" (bolded text, including the curly brackets) from the "how to use it" column below. You do not need to go into edit mode, just swipe over the text in the column and copy it.
- Go to the page to which you want to add the info box.
- Click the "Edit" link, and a page opens that has a big edit box.
- Paste what you copied into the big edit box. If the tag has a pipe (|) in it, you need to personalize the text that follows the pipe.
- Click "Save page".
Align to right side of page
The userboxes are configured to align to the left side of the page. To align them to the right side of the page, copy this code and put the userbox code on the middle line.
<div style="float: right; margin: 0 0 0 1.5em; ">
{{Userbox name}}{{Userbox name}}
</div>
User page info boxes
| Usage | How to use it (You can use these on any page or in chats) |
What you see |
| If you play something, put this on your user page. | {{Musician}} | Template:Musician |
| If you've visited WWR in Talkeetna put, this on your user page. | {{Been to WWR}} | Template:Been to WWR |
| Add to your user page if you have pooped in the Whole Wheat Radio outhouse in Talkeetna. | {{Pooped in the WWR outhouse}} | Template:Pooped in the WWR outhouse |
| If you're planning to attend Wheatstalk 2008, put this on your user page. | {{Going to Wheatstalk 2008}} | Template:Going to Wheatstalk 2008 |
| If you have a crush on Mr. Monkey, put this on your user page. | {{Mr. Monkey crush}} | Template:Mr. Monkey crush |
| If you fly something, put this on your user page. | {{Pilot}} | Template:Pilot |
| Add to your user page if you garden. Adds your page to the gardeners category. | {{I garden}} | Template:I garden |
| Add to your user page if... you love cats. | {{Cats}} | Template:Cats |
| Add to your user page if... you brew beer. | {{Brewer}} | Template:Brewer |
| Add to your user page if you blog. Adds your page to the bloggers category and has a link to your blog. | {{I blog|http://www.yourdomain.com}} Use your full URL after the pipe. |
|
| Mac lovers put it on their user page. | {{Love Mac}} | Template:Love Mac |
| Add to your user page if... well you know if it works for you or not. No category. | {{Peacenik}} | Template:Peacenik |
Personal info boxes
| Usage | How to use it (You can use these on any page or in chats) |
What you see | ||
| Jimbob uses this to indicate his double-favorite songs. | Jimbob's. See Template:Doublefav to make one like it. |
|
Customizable info boxes
| Usage | How to use it |
What you see | ||
| What you're currently doing. | {{I am|whatever you're doing}} e.g.: {{I am|listening}} or {{I am|at work}} |
|||
| Anything you want to say. | {{Chatbox|whatever you want to say|optional image URL or wiki Image:Xyz.jpg|optional background color i.e. red, blue, green, etc}} e.g.: {{Chatbox|Well now I've seen everything|http://www.wholewheatradio.org/wiki/images/e/ea/Anon.gif|red}}' |
|
||
| Post something you're pondering — just like the EJs! | {{Just thinking|whatever you are thinking}} |
Music-related user info boxes
| Usage | How to use it (You can use these on any page or in chats) |
What you see | ||
| To indicate you'd like to hear more of an artist. | {{Hear more|Your user name}} Further details: Template talk:Hear more |
|||
| To indicate you want a particular album. Put it on an album's page. | {{Wish list|Your user name}} Further details: Template talk:Wish list |
|
||
| To indicate you have a particular album. Put it on an album's page. | {{Have album|Your user name}} Further details: Template talk:Have album |
How to create new info boxes
You don't have to know about coding to make info boxes. You can create info boxes just by copying others and changing the colors, text and images.
When you want to learn more about the coding part see Editing cheat sheet, How to for information about wiki code. W3Schools has easy tutorials and information about CSS.
- Open the page for an existing info box that you like. For example, click on Template:Been to WWR
- Click the "Edit" link. Another page opens with a big edit box filled with code.
- Swipe over all the code in the edit box and copy it into your clipboard.
- Think of a name you'd like to call your new info box. Make it something easy and self-explanatory so people can easily put it on their user page. To create the page, put Template:Whatever you want to call it in the Search box on the left hand side of the screen and hit the "Go" button. A page comes up saying your page does not currently exist but you can create it. Click the link to create it.
- A page opens with a big empty edit box. Paste the code from your clipboard into the edit box.
- Modify the image and/or text that displays for the box. Don't modify any of the other formatting if you don't know what it does. See the Example below.
- Save your page.
- Anyone can now include your info box on a page by using the format: {{Whatever you want to call it}}
Example
Template:Been to WWR This example uses the Template:Been to WWR to show some things you can do with info box templates.
Line 1 - Opening CSS tag/Border weight and color
<div style="float:left; clear:left; margin:0 1.5em .25em 0; border-style:solid; border-width:1px; border-color:#6B594F;">
- Set "border-color" value to either a color name or color number. When using color numbers the number sign is required.
See colors or handy chart of recognized color names for examples.
Line 2 - Opening HTML tag/Background color of the entire info box
<table cellspacing="0" style="width:238px; background:wheat;">
- Set "background" value to either a color name or color number.
Line 3 - Background color of left section of box
<tr><td style="width:45px; height:45px; text-align:center; background:#F1F1F1;">
- Set "background" value to either a color name or color number.
Line 4 - Image and/or text in the left section of box
[[Image:Jwalkwwrlogo10.gif|30px]]</td>
- Type an image location, and image's size if necessary. This example uses an image that has been uploaded to the WWR wiki. To change the size use this format: [[Image:imagename.jpg|45px]]. The pixel (px) value determines the width that the image will display.
You can also link to non-wiki images by putting a URL directly to an image file on the WWR site, however you cannot resize these. (e.g.: http://www.wholewheatradio.org/wwimages/3%20BLIND%20MICE.JPG.)
Emoticons can be added by using the emoticon tag. e.g.: <emoticon>smile</emoticon>
Some examples have text rather than a picture in this section. See Line 5 for ideas on setting the text.
Line 5 - Text weight, style and color of right section
<td style="padding:4px; line-height:1.25em; text-align:center; font-weight:bold; color:#6B594F;">
- Set text color for the right section of the box by changing the "color" value.
- Set other text parameters by changing "font-style" or "font-weight". "Font-family" can be added, but not all computers have the same fonts.
Line 6 - Right section content and wiki category link
I [[:Category:Been to WWR|have been]] to<br>Whole Wheat Radio<br>in [[Talkeetna]].
- Enter the text or links to an image or emoticon for the right-hand box.
- If you want to link to a category, use the format above. Notice the colon before the word "Category" without it the category name will not show in your content. It also requires that you add a pipe (|) followed by an alternate name (can actually be the same name as the category).
If your info box includes a category (not required), use a category name that makes sense for your box. When users click on your category link, they will go to a page that shows everyone who has included that box on their user page.
Line 7 - All the closing tags for the template/Category
</td></tr></table></div><noinclude>[[Category:User page templates]]</noinclude><includeonly>[[Category:Been to WWR]]</includeonly>
- Include a category in your info box: If you want all the pages that use your info box to be included in a category, the category code needs to be entered on this line between the "include only" tags and without the colon before the word "Category". (With the colon, only a link to the category is created. Without the colon the page is actually added to the category.)
- Don't include a category: Delete everything from <includeonly> through </noinclude> so the line looks like this:
</td></tr></table></div><includeonly>[[Category:Been to WWR]]</includeonly>
Don't mess with the "Category:User info boxes" part. This adds your template to a category of info boxes.
Some example info boxes to give you formatting ideas
| What you see | Code is at |
| Template:Infobox Example 1 | |
| Template:Infobox Example 2 |
