Carnage's Guide to Creating a Main Page

Greetings fellow contributors, I am Ultimate Dark Carnage, and I am going to show you a tutorial on how to create a presentable main page. If you want to learn how to create a presentable main page, you are reading the right blog. Here are the tips on creating a good main page:

Main Page Content[]

This section shows you what content is recommended on the left column, and where should they be placed.

Left Column[]

This part of the tutorial shows you what item should be on the left column. Here are the following items:

Banner: The banner is the logo that goes on top of the main page. The image must be at least 200 × 200.
Welcome Section: The welcome section lets you know what the wiki is about, and welcomes you to the wiki.
- Slider: The slider is a gallery that is used to navigate the wiki.
- Portal: The portal is used to navigate the pages of characters, locations, and other stuff.
- Input Box: The input box is used to create a page in an instant. It can also be used for presentation.
Navigation: The navigation section is also used for easy navigation.
Activity Feed: The activity feed lets you know how active the wiki is.

Right Column[]

This part of the tutorial shows you what item is recommended on the right column. Here are the following items:

Chat Entry Point: The chat entry point is used as a quick way to enter chat.
Bloglist: The blog list lets you know which blogs are popular and active.
Polls: The polls lets the readers and the contributors vote for someone or something.
News: The news section tells the users about what happened on the wiki.

Footer[]

This part of the tutorial shows you what item should be on the footer. Here are the following items:

Affiliations: The affiliations section lets people know what wikis are related to this wiki.
Resources / Social Network: The social networking section lets people know that the wiki has a Twitter, Facebook, Pinterest, and other social networking accounts. It can also be used as a resources section.

Styling the Main Page sections[]

This section shows you how the main page section is supposed to look. The main page sections and its heading should be bordered too. If you want to know how to add a border around the main page section, see below:

HTML (or Wiki-text)[]

You can use HTML and/or wiki-text to create a main page section. You can change it if you like.

Source[]

Here is the source code for the bordered main page section:

<div style="border: 3px solid black; padding: 8px; border-radius: 10px;">
<h2 style="border: 2px solid black; padding: 5px; border-radius: 10px; margin: 0; text-align: center; font-size: 16pt;">Example</h2>
Content
</div>

Result[]

Here is the result of the code:

Example

Content

Note: You can also add the code to a template, e.g. Template:MainPageHeadline.

CSS[]

You can use CSS to add styling to the main page sections.

Code[]

Here is the CSS code for the main page sections. Note: You must add the class="mainpage-headline" attribute to the main page section for the styling to work.

.mainpage-headline {
    border: 3px solid black;
    padding: 8px;
    border-radius: 10px;
}

.mainpage-headline h2 {
    border: 2px solid black;
    padding: 8px;
    border-radius: 10px;
    margin: 0;
    text-align: center;
    font-size: 16pt;
}

You can add the CSS above to the MediaWiki:Wikia.css, MediaWiki:Common.css, or MediaWiki:MainPage.css. If you have added the code to the MediaWiki:MainPage.css, or any other CSS page, see below.

Importing[]

You can import the code via CSS or JavaScript. Here are the source codes for importing the CSS:

CSS

Here is the CSS method of importing the MediaWiki:MainPage.css page.

@import "http://yourwiki.wikia.com/wiki/MediaWiki:MainPage.css?action=raw&ctype=text/css";

You can add the above code on top of the MediaWiki:Wikia.css, or the MediaWiki:Common.css page.

JavaScript

Here is the JavaScript method of importing the MediaWiki:MainPage.css page.

window.importStyleSheet('MediaWiki:MainPage.css', 'yourwiki');

Note: You must replace the words "yourwiki" with the name of your wiki in order for the code to work.

Conclusion[]

The main page makes the wiki presentable for the viewers to look at. Additionally, a presentable main page increases the popularity of a wiki, and improves the readability of it. If you have any questions, feedback, and/or ideas, comment on this blog.

— This blog is created by Ultimate Dark Carnage