Wikia

Community Central

Help:Main page column tags/source

Talk0
89,449pages on
this wiki

< Help:Main page column tags

The main page column tags code below is the source code for the main page of this demo wikia: http://main-page-demo.wikia.com

<mainpage-leftcolumn-start />

<div style="background-color:#BBC; color:#000; height:100px; padding:1em;">
'''I am a box in the left column, currently set to 100 pixels tall.'''

Your wiki's title and welcome message could go here, or a cool title image. (The box is optional.)
</div>

<div style="background-color:#BCB; color:#000; margin-top:1em; padding:1em;">''' I am a sentence in the left column.'''</div>

<div style="border:2px solid #BCB; color:#000; margin-top:1em; padding:1em;">
'''I am a box containing content in the left column.'''

This set of '''main page <tags/>''' allows for easier main page design and is the recommended method of creating layouts for main pages.

Using the following tags, you can create a main page that will work with the Wikia ad and will be compatible with any future changes Wikia may need to make to the main page layouts.

<pre>
<mainpage-leftcolumn-start />

content the left column

<mainpage-endcolumn />

<mainpage-rightcolumn-start />

content in the right column

<mainpage-endcolumn />
</pre>

==How to use the tags==
[[File:Main_page_tags_editor.png|thumb|300px|An example of how main page tags might look in the editor]]
The "leftcolumn" tag starts the fluid width left column, and comes first:

<pre><mainpage-leftcolumn-start /></pre>

The left column is ended by:

<pre><mainpage-endcolumn /></pre>


Next, the following starts a 300px wide right column:

<pre><mainpage-rightcolumn-start /></pre>

The right column is ended by:

<pre><mainpage-endcolumn /></pre>


After the end of the rightcolumn tag you can place anything you wish, and make them 100% page width. (Please note this is recommended against, especially on shorter pages.) However, you will need to add the following to ensure it appears below the columns:

<pre><br style="clear:both;"/></pre>

</div>

<mainpage-endcolumn />

<mainpage-rightcolumn-start />

<div style="background-color:#BBC; color:#000; height:250px; padding:1em;">'''I am a 300x250px or a 300x600px box in the right column.''' Wikia's ad will go here.</div>

<div style="background-color:#BCC;  margin-top:1em; padding:1em;">'''I am a sentence in the right column.'''</div>

<div style="margin-top:1em; padding:1em; border:2px solid black; margin:auto;text-align:center">
This is a Featured Image<br />
[[File:Greece-0723.jpg|270px]]</div>

<div style="background-color:#CBB; color:#000; height:500px; margin-top:1em; padding:1em;">'''I am a very long sentence in a box with a height of 500px in the right column.''' Any sort of wiki content could go here -- a featured article or picture, a list of popular categories, an embedded widget, a video or poll or calendar -- anything you like.</div>

<mainpage-endcolumn />
<br style="clear:both;"/>

<div style="background-color:#BCB; color:#000; margin-top:1em; padding:1em;">''' I am a sentence in a full-width box beneath both columns'''</div>

Around Wikia's network

Random Wiki