Difference between revisions of "Template:TOCnestright"

From Ballotpedia
Jump to: navigation, search
m (update format)
 
Line 16: Line 16:
 
</div><!--
 
</div><!--
 
-->{{{after|}}}{{{2|}}}<!--
 
-->{{{after|}}}{{{2|}}}<!--
--></includeonly><noinclude>{{documentation|template:TOCnestright/doc}}</noinclude><noinclude>[[Category:TOC templates]]</noinclude>
+
--></includeonly><noinclude>{{documentation|template:TOCnestright/doc}}[[Category:TOC templates]]</noinclude>

Latest revision as of 20:49, 18 January 2014

[edit] Template-info.png Template documentation

Usage

This TOCnestright template is used beside tall right located graphics structures like infoboxes 
and is similar in purpose and use to {{TOCright}}. Unlike the latter, it does not hog the right margin as do so many page elements in this project, but instead shares the center upper space allowing text to wrap below and to the left, thus eliminating a lot of ugly white space on many pages while still keeping compliance with WP:MOS recommendations.

  • In addition, it allows an easy limitation ({{{maxwidth}}}) to be applied to the width of a TOC when a few section title lines are "overlong".
       

(It is not recommended that wrapping be forced when the majority of lines are being wrapped, so check what you apply in several zoom in and zoom out settings—using [CTRL][+] and [CTRL][-] on most modern browsers. This is good practice when adding any graphic element to a page... for older readers tend to use larger effective fonts (and so zoom in), and younger readers — withbetter eye-sight!— most often use smaller fonts (or equivalently, zoom settings) (some of these 'types' (sic)... may even reach their fourties and experience the sad difference nature imposes themselves! But probably not! <G>) and of course, some people like wikipedia editors may bounce to and fro in between!

  • Experience and spot checks using seven different modern browsers suggest that the safest and surest course to avoid browser rendering order problems is to use {{FixHTML}} when this template is utilized. FixHTML boxes right floating elements and 'safes' them against various browser page rendering order differences. The {{FixHTML}} template was developed because of an old problem discussed in Wikipedia:How to fix bunched-up edit links, and merely formalizes the advice given in that old guideline in easy to use fashion, but uses the most reliable method of the several given (Those seven browsers used in testing again!).
  • It does take a number of optional formating arguments:
Structure control:    {{ before=| and/or ... prependinside= and appendinside=
                       and ... in closing ... after=| or {{{2}}}=|
Format (div style=):     "left=| margin=| otherstyle=| maxwidth=|"
count control:           limit=| or {{{1}}}=|
                      }} <!-- specify only 1 or limit, not both -->

prependinside and appendinside

parameters {{{prependinside}}} and {{{appendinside}}} differ from {{{before}}} and {{{after}}}
as the later two are outside the control structure established by the controlling <div> ... </div> nested content. In practice,
   

before=otherright floating element will present the TOC adjacent to the left side of the otherright floating element, such as an image or infobox.
   


prependinside

  • prependinside= or prependimage=, will line up the TOC with the given element, both in a right floated column—in other words, the TOC will appear UNDER the other element, whereas with before, it appears to it's left and so more centered on a page.
       


    • It has the same technical complication including images as that which happens in image boxes because of the way they are rendered in a browser, requiring a couple of extra minor steps; this is the same complication as is experienced with infobox templates which require a separate caption and image definition.

      • prependwidth=defined inside as is the image statement, but should work for a table or text but will not work for an image. In the below one would use:
      • "prependinside=250px"
      • prependcaption=the image caption, in the below, if not obvious, don't edit here! Pleaase!!! <g>
      • in general, it is best and is easiest to use an inline comment, AND KEEP the old image link together:
             

[[Image:Something.png|thumb|right|250px|This a picture...]] becomes instead:
     

[[Image:Something.png<!--|thumb|right|250px|This a picture of the Rhine river taken at night.--></nowiki>]]</nowiki>

Prependinside example

Put all together first we get:

Example 1: Non-image element...

{{TOCnestright
 | prependwidth  = mandatory
 | prependinside = Some template or text or table
 | maxwidth      = 250px;
 }}<!--

Example 2: 

For an IMAGE we need...

{{TOCnestright|  <!-- This comment
    [[ Image:Something Rhinish.png|thumb|right|250px|This a picture of the [[Rhine|Rhine river]] taken at night.'''
+++ 
]] --> replaced by:

 | prependimage   = Image:Something Rhinish.png

 | prependcaption =This a picture of the [[Rhine|Rhine river]] taken at night.

 | prependwidth   =240px

 | maxwidth       =250px 
}}
which boils down to:

{{TOCnestright
 | prependimage= Image:Something Rhinish.png

 | prependcaption=This a picture of the [[Rhine|Rhine river]] taken at night.

 | prependwidth=240px

 | maxwidth=250px 
}}

Cut-N-paste template, infobox style:

| prependwidth  = mandatory
| maxwidth      =
| prependinside = 
where the prependinside element is a Pre-sized Table or text block, not images!!!
 OR for an image or two:

| maxwidth      = 
| prependimage  = bare image name, without [[ and ]]
| prependwidth  = mandatory
| prependcaption= 

Strictly optional (bounding table controls)
 |prependpadding=  
 | prependmargin=
Note: NOT SPECIFYING a maxwidth value is NOT a good idea.
Using either appendinside or prependinside feature. </font>

The width of the template is auto unless this parameter is specified and consequently
the picture fills the whole screen as it has no upper boundary so far as your browser is concerned.
</div>


  • If prependinside is not specified with one or the other of prependwidth or prependcaption, the template assumes you are a total ignorant fool and tries (and succeeds!) to display nothing at all. (Thus ensuring someone will read the above! <g>)
  • there are other prepend only in scope parameters that are purely optional, and adjust width, margins, padding and so forth (other common HTML box element parameters). These are probably uneeded,... well,... but just in case!


appendinside

  • appendinside= puts the image lined up within the TOC box... ( example where-ever other HTML rendering locates that box element. It is thusly used for images primarily on many "history " pages where there is a long tall infobox preventing images from appearing high up and one wants those, but do not want text to be sandwiched between floating HTML elements, as per the WP:MOS. This use presents nicely, and keeps all text left, but allows small images to be beside of infoboxes, just like the TOCnestright floats on pages using no frills.
Other examples
See Example page, and the three pictures stacked in Schwarzburg-Rudolstadt. (Code below, displayed effect must be seen on the page)

Three images inside-after example

Excerpt from three-stack
({http://en.wikipedia.org/w/index.php?title=Schwarzburg-Rudolstadt&oldid=224775886text (20:16, Saturday 12 July 2008 (UTC)], manually wrapped for readability) above and below included)
'''Schwarzburg-Rudolstadt''' was a small state in [[Germany]], in the present-day state of
 [[Thuringia]] formed in a resettlement of [[Schwarzburg dynasty]] family lands, with its 
 capital (and the Guenther ({{lang-de|Günther}}) family seat) originally in the castle at
 [[Schwarzburg]], but later, for most of its existence as a polity having the capital at the
 larger town of [[Rudolstadt]]. It was founded after the partition of the schwarzburger
 possessions in [[1599]]. A sovereign [[county]] under the [[Holy Roman Empire]] until
 [[1711]], in that year it became a [[principality]] under the same entity.
 
{{TOCnestright|maxwidth=200px|appendinside=
[[Image:Schwarzburg new.jpg|thumb|center|190px|The ruins of the Guenther family [[castle]] at [[Schwarzburg]].]]

[[Image:Schloss Schwarzburg 1900.jpg|thumb|center|190px|The castle in 1900 AD.]]  

[[Image:Treppsteinblick_1900.jpg|thumb|center|190px|Aerial view at [[Schwarzburg]].]]
}}
In late [[1918]], and during the [[German Revolution]], resulting in the fall of all the
 [[German monarchies]], the prince abdicated, and in [[1920]] the former principality
 became a part of the new state of [[Thuringia]]. Schwarzburg-Rudolstadt had an area of
 {{km2 to mi2|940|wiki=yes|abbr=yes}} and a population of 97,000 (1905).

otherstyle

The |otherstyle= parameter is for any element not controlled currently by the style line as listed below. It might be used for example to define a color, a line-height, or other such HTML parameter.


Actual code...
{{{1|}}}<!-- specify only 1 or limit, not both --><!--
-->{{{before|}}}<div style="float:{{#if:{{{left|}}}|left;|right;}}<!--
--> margin: {{{margin|1em 0 1em 1.5em}}}; <!--
-->{{{otherstyle|}}};{{#if:{{{maxwidth|}}}|max-width:{{{maxwidth}}};}}"<!--
--> {{#if:{{{1|}}}{{{limit|}}}|class="toclimit-{{{1|{{{limit|}}}}}}"}}> <!--

-->{{#if:{{{prependinside|}}}{{{prependimage|}}}<!-- prepend makes a HTML table
+++
-- " -->|{{#if:{{{prependcaption|}}}{{{prependwidth|}}}{{{prependimage|}}}<!--
+++
-- "--   " -->|<table style="border:1px solid black; width:{{{prependwidth|250px}}}; <!--
+++
-- "     "      -->{{#if:{{{maxwidth|}}}|max-width:{{{maxwidth}}}; <!--
+++
-- "     "      -->}} padding:{{{prependpadding|.25em}}};<!--
+++
-- "     "         --> margin:{{{prependmargin|0 0 0 .25em}}}; "><tr<!--
+++
-- "--   " -->><td>{{{prependinside|}}}<br></td></tr<!--
+++
-- "--   " -->><tr><td>{{{prependcaption|"prependcaption"}}}</td></tr<!--
-- "--   " -->></table><br/><br/><!-- Table ends... with some spacing.
-- "  -->}}<!--
-->}}  <!--
-->__TOC__ <!--
-->{{#if:{{{appendinside|}}}|<br/>{{{appendinside|}}}}}
</div><!--
-->{{{after|}}}{{{2|}}}<!--
-->
Tips
  • |left= is only used inside a table element, to place the TOC, under a page's first image. It looks a little better used that way.
  • The most useful format parameter is maxwidth. Setting between 180-220px usually does a nice job of wrapping long section titles within the displayed TOC for the most likely viewing zoom-in/zoom-out settings used by a typical viewer.
  • prependinside= allows another structure to float part-right ABOVE the TOC as well, such as a small image.
  • appendinside= allows another structure to float part-right below the TOC as well, such as a small image.
Tech note...
  • HTML renders in differing order on different browsers, so it is advisable to use the template {{FixHTML}} in conjunction with this template around any right floating elements. This tablizes such and the behavior has been tested satisfactorily against most modern browsers from MacIntosh computers to Unix, and no less than three generations of the troublesome Internet Explorers (IE5, IE6, and IE7), all work satisfactory when the two templates are used together in mutual support.

See also
template:TOCright/doc

</div>