Difference between revisions of "Help:Wiki University Wikitext--Infobox - Placing"

From FamilySearch Wiki
Jump to: navigation, search
m (Try these out: Ch 15 Infobox Placing: modified parameters to match answer code and added explanation)
m (Modified page for clarity)
Line 7: Line 7:
 
</table>
 
</table>
 
----
 
----
==How to place an infobox==
+
==How to place or embed an infobox==
*Given that infoboxes are templates, they are placed like templates with double opening and closing curly brackets.<br>
+
*Given that infoboxes are templates, they are placed or embedded like templates with double opening and closing curly brackets.<br>
 
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:100%; font-size:10pt; font-family:Courier New"><font color="red"><nowiki> {{Name of infobox}} </nowiki></font color>
 
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:100%; font-size:10pt; font-family:Courier New"><font color="red"><nowiki> {{Name of infobox}} </nowiki></font color>
 
</div><br>
 
</div><br>
<div style="width:100%; border:5px double red; padding:5px; ">The big difference is when you embed the infobox template you must add the parameter coding as shown below:</div>
+
<div style="width:100%; border:5px double red; padding:5px; ">The big difference is when you embed the infobox template '''you must add the parameter coding''' as shown below:</div>
 
<br>
 
<br>
  
Line 24: Line 24:
 
<br>
 
<br>
  
*You add the information after the = sign.  Here is the coding example for a fictitious organization:
+
*You add the data values after the = sign.  Here is the coding example for a fictitious organization:
 
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:100%; font-size:10pt; font-family:Courier New">
 
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:100%; font-size:10pt; font-family:Courier New">
 
<nowiki>{{Infobox Sample</nowiki><br>
 
<nowiki>{{Infobox Sample</nowiki><br>
Line 62: Line 62:
 
Again it is up to '''you to add the parameter coding''' when embedding the infobox.  The parameters do NOT automatically show up if you have only embedded <nowiki>{{Sample infobox}}</nowiki>.
 
Again it is up to '''you to add the parameter coding''' when embedding the infobox.  The parameters do NOT automatically show up if you have only embedded <nowiki>{{Sample infobox}}</nowiki>.
 
|}
 
|}
 
  
 
==Edit an infobox==
 
==Edit an infobox==
 
When you need to edit the infobox, you edit the page where the infobox is embedded as normal. The infobox coding will show up in the page coding.  Then you make whatever changes you want to the infobox coding.  The ability to make changes or add to other pages with different information makes infoboxes very useful tools.
 
When you need to edit the infobox, you edit the page where the infobox is embedded as normal. The infobox coding will show up in the page coding.  Then you make whatever changes you want to the infobox coding.  The ability to make changes or add to other pages with different information makes infoboxes very useful tools.
 
  
 
==Customize infoboxes==
 
==Customize infoboxes==
*Be creative when creating these infoboxes.  Try different background colors, different kinds of borders, etc.   
+
*Be creative when creating these infoboxes.  Try different background colors, different kinds of borders, etc.  
 +
   
 
==Existing infoboxes==
 
==Existing infoboxes==
 
*There are hundreds of infoboxes already created.  Please check to see if there is one that might apply to your needs.
 
*There are hundreds of infoboxes already created.  Please check to see if there is one that might apply to your needs.
 
*Be careful with these existing infoboxes.  Some of them have built-in features not covered in this chapter.
 
*Be careful with these existing infoboxes.  Some of them have built-in features not covered in this chapter.
*Many only require the image name without the square brackets or the word "File" to place the image: <br><font color="red">Missouri.png<nowiki> </nowiki></font color> not <font color="red"><nowiki>[[File:Missouri.png]]</nowiki></font color>
+
*Many only require the image name without the square brackets or the word "File:" to place the image. For example, you would enter <font color="blue">Missouri.png</font> not <font color="blue"><nowiki>[[File:Missouri.png]]</nowiki></font>
 
*If you have used the square brackets and the word "file" and the image does not show, try leaving them out.  It might be a infobox that has these attributes already built in.
 
*If you have used the square brackets and the word "file" and the image does not show, try leaving them out.  It might be a infobox that has these attributes already built in.
  
Line 83: Line 82:
 
<div style="font-size:14pt; width:100%; height:30px; vertical-align:middle; background-color:lightgreen; ">Exercises</div>
 
<div style="font-size:14pt; width:100%; height:30px; vertical-align:middle; background-color:lightgreen; ">Exercises</div>
 
<div style="padding-top:12px; padding-left:10px; ">
 
<div style="padding-top:12px; padding-left:10px; ">
Here is an existing infobox:<br><nowiki>{{Infobox U.S. County</nowiki>}}. <br>Fill out the information for the county you were '''born in''':
+
<p>Here is an existing infobox template: <nowiki>{{Infobox U.S. County}}</nowiki>. <br>(1) Place this template into your sandbox. (2) Determine and add the appropriate parameter coding. The parameters used for this temple are bulleted below. Finally, (3) add the data values for the county in which you were born
 
*county
 
*county
 
*county_map
 
*county_map
Line 91: Line 90:
 
*founded date
 
*founded date
 
*seat wl
 
*seat wl
'''This is an existing infobox for US Counties.  You will not need the square brackets and the word "File:" to place any image.'' "Founded date"'' represents month and day.'' "Seat wl"'' represents the county seat.'''
+
<br>'''<font color="red">ATTENTION:</font>  This is an existing infobox for US Counties.  You will not need the square brackets and the word "File:" to place any image.'' "Founded date"'' represents month and day.'' "Seat wl"'' represents the county seat.'''
  
 
</div>
 
</div>

Revision as of 20:39, 12 December 2017

MAIN PAGE
WIKI
WIKITEXT
HTML/CSS
FAMILY HISTORY CENTERS
VISUAL EDITOR

Lessons

  1. HOME
  2. Introduction
  3. Headers
  4. Lists
  5. Nesting Lists
  6. Links
  7. Broken Links
  8. Comments
  9. Categories
  10. PDF & Image files
  11. Images (cont.)
  12. Image Links
  13. Images and Text
  14. Snipping Tool & Paint
  15. Paragraphs
  16. Inline Styling
  17. Changing Fonts
  18. Font Colors
  19. Font Bold-Italics
  20. Multi-attributes
  21. Backgrounds
  22. Padding
  23. Div Tag - Intro
  24. Margins
  25. Borders
  26. Width and Height
  27. Alignment - Horizontal
  28. Tables
  29. Breadcrumb Trails
  30. Ref/Footnotes
  31. SEO

Intermediate

  1. Table - Borders
  2. Tables - Widths
  3. Tables - Captions
  4. Tables - Col Labels
  5. Tables - Cells
  6. Tables - Rows
  7. Tables - Placement
  8. Tables - Sorting
  9. Tables - Scrolling
  10. Tables - Col Spans
  11. Tables - Row Spans
  12. Alignment - Vertical
  13. Templates
  14. Infobox - Creating
  15. Infobox - Placing
  16. Image Maps

Advanced

  1. Research Record Templates
  2. If functions
  3. Sidebars
  4. Navboxes
  5. Position - Relative
  6. Position - Absolute

Flexbox

  1. Flexbox Training

Additional Helps


<< Previous Chapter Next Chapter >>

How to place or embed an infobox

  • Given that infoboxes are templates, they are placed or embedded like templates with double opening and closing curly brackets.
{{Name of infobox}}

The big difference is when you embed the infobox template you must add the parameter coding as shown below:


{{Infobox Sample

| organization name=
| image=
| president=
| address=
| phone=
| hours open=

}}


  • You add the data values after the = sign. Here is the coding example for a fictitious organization:

{{Infobox Sample
| organization name=Smith Family Assoc
| image=[[File:Erastus Deaf Smith.JPG|180]]
| president=John Smith
| address=1234 Hill St, Anytown, Anystate.
| phone=360-555-1234
| hours open=12:01 pm - 12:02 pm.

}}


Here is the final product:

Smith Family Assoc.
180
President: John Smith
Address: 1234 Hill St, Anytown, Anystate.
Phone: 360-555-1234
Hours Open: 12:01 pm - 12:02 pm.
  • NOTICE the name of the organization and the image are centered. We built these attributes into the infobox when we created it. It is also floated to the right side.
Html12.png

Again it is up to you to add the parameter coding when embedding the infobox. The parameters do NOT automatically show up if you have only embedded {{Sample infobox}}.

Edit an infobox

When you need to edit the infobox, you edit the page where the infobox is embedded as normal. The infobox coding will show up in the page coding. Then you make whatever changes you want to the infobox coding. The ability to make changes or add to other pages with different information makes infoboxes very useful tools.

Customize infoboxes

  • Be creative when creating these infoboxes. Try different background colors, different kinds of borders, etc.

Existing infoboxes

  • There are hundreds of infoboxes already created. Please check to see if there is one that might apply to your needs.
  • Be careful with these existing infoboxes. Some of them have built-in features not covered in this chapter.
  • Many only require the image name without the square brackets or the word "File:" to place the image. For example, you would enter Missouri.png not [[File:Missouri.png]]
  • If you have used the square brackets and the word "file" and the image does not show, try leaving them out. It might be a infobox that has these attributes already built in.


Try these out

Tests.gif
Exercises

Here is an existing infobox template: {{Infobox U.S. County}}.
(1) Place this template into your sandbox. (2) Determine and add the appropriate parameter coding. The parameters used for this temple are bulleted below. Finally, (3) add the data values for the county in which you were born.

  • county
  • county_map
  • state
  • state_map
  • founded year
  • founded date
  • seat wl

ATTENTION: This is an existing infobox for US Counties. You will not need the square brackets and the word "File:" to place any image. "Founded date" represents month and day. "Seat wl" represents the county seat.


Quick Quiz
  • Once the information after the equal signs is entered and saved, there is no changing the parameters.
A. True
B. False
  • Infoboxes can only be used on county pages.
A. True
B. False
  • Infoboxes are limited just to genealogical organizations.
A. True
B. False