User info boxes

From WWR

Jump to: navigation, search

Contents

How to put an userbox on a page

  1. 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.
  2. Go to the page to which you want to add the info box.
  3. Click the "Edit" link, and a page opens that has a big edit box.
  4. 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.
  5. 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}}
Image:802_charlie_singing.gifI am a musician.
If you've visited WWR in Talkeetna put, this on your user page. {{Been to WWR}}

I have been to
Whole Wheat Radio
in Talkeetna.

Add to your user page if you have pooped in the Whole Wheat Radio outhouse in Talkeetna. {{Pooped in the WWR outhouse}}
I have pooped in the
Whole Wheat Radio outhouse
in Talkeetna.
If you're planning to attend Wheatstalk 2008, put this on your user page. {{Going to Wheatstalk 2008}}
I am planning to get on up to
Wheatstalk 2008.
If you have a crush on Mr. Monkey, put this on your user page. {{Mr. Monkey crush}}
Image:MrMonkey-45px.gif I have a crush on
Mr. Monkey!
Add to your user page if... you worship Esther. {{I worship Esther}}
I worship
Esther!
Add to your user page if... you like Rants. {{Dig rants}}
Image:726_jimbobsm.gif I dig WWR
Rants & Muffins!
If you fly something, put this on your user page. {{Pilot}}
I am a pilot.
If you fly something in the bush, put this on your user page. {{BushPilot}}
I am a bush pilot.
Add to your user page if you garden. Adds your page to the gardeners category. {{I garden}}
Image:Gardener.gif I garden.
Add to your user page if... you love cats. {{Cats}}
I love cats!
Add to your user page if... you brew beer. {{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}}
Image:Maclogo.gif I love my Mac!
Everyone else can put this on their user page. {{Macs suck}}
Add to your user page if... well you know if it works for you or not. No category. {{Peacenik}}
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.
Double Favorite This song is one of
Jimbob's Double Favorites.
A label, lovingly applied by Esther. Now you can apply it to yourself or others! {{Neurotic}}
You know who you are {{PMS}}
Image:Esther001.gif I have PMS
Watch out!
Embarass yourself and Grandkids {{Grandpa}}
Image:802_charlie_singing.gif I am a SAG


(Singing Association Grandpa)

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}}
Image:Yell.gif
{{I am|xyz}}
I am currently listening.
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}}'
Anon.gif Well now I've seen everything
Post something you're pondering — just like the EJs! {{Just thinking|whatever you are thinking}}
I was just thinking about this...
your thought.
Image:I_think.gif

Chat info boxes

Usage How to use it
What you see
Announce that you are working and lurking in the chat. {{Work & lurk}}
Image:Pirate1.gif I am working and lurking.
Announce that you are working and lurking in the chat. For artists and children. {{Work & lurk - art}}
Image:Edcolor.gif I am working and lurking.
Feeling drifty? {{Drifting}}
Image:Schiff026.gif I am drifting in and out of chat.
A proper insult to anyone {{Been Jac'ed}}
I been
Black Jac'ed

"Off with his head!" from Alice's Adventures in Wonderland. (Remember that the Queen of Hearts always changed her mind when it came right down to the beheading.) {{Off with his head}}
Off with his head!
Secret Wheatie Gift Exchange Reminder {{Secret Wheatie}}
Image:Mouse_cj.gif Sign up now to be a Secret Wheatie.

WHEAT NOW or forever hold your

Secret Wheatie 'Live Event' Reminder {{Secret Wheatie 'Live' Event}}
Image:Mouse_cj.gif Secret Wheatie 'Live' Event is over. depressed.gif It was Jan. 26th 4-7p.m. Talkeetna time. Get in line for next year. Image:Kidpresentopen.gif

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
More!
Image:Thumbsup.gif

username wants to
hear more of this artist.
Usage: {{Hear more|your username}}
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
Image:Star-45px.gif This is on
Username's 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.

  1. Open the page for an existing info box that you like. For example, click on Template:Been to WWR
  2. Click the "Edit" link. Another page opens with a big edit box filled with code.
  3. Swipe over all the code in the edit box and copy it into your clipboard.
  4. 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.
  5. A page opens with a big empty edit box. Paste the code from your clipboard into the edit box.
  6. 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.
  7. Save your page.
  8. Anyone can now include your info box on a page by using the format: {{Whatever you want to call it}}

Example

I have been to
Whole Wheat Radio
in Talkeetna.

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;">
  1. 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;">
  1. 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;">
  1. 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>
  1. 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;">
  1. Set text color for the right section of the box by changing the "color" value.
  2. 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]].
  1. Enter the text or links to an image or emoticon for the right-hand box.
  2. 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
I am a member of the
very elite WWR
transgendered club
Template:Infobox Example 1
Image:Sparkitchaticon-small.gif Sparkit has ranked this box
extremely boring
Template:Infobox Example 2
Image:Laffpuppet01.gif
This is Toad's box.
It's empty.
That's why it's Toad's. smile
Template:Infobox Example 3
Image:MrMonkey-45px.gif I read J-Walk's blog
That may or may not interest you.
wave
Template:Infobox Example 4
KATE%20PURCELL.JPG hello everyone!
Template:Infobox Example 7

See also

Personal tools
help / reports
12.03 secs to build