Help:Layout customization

From GRWiktionaryHelp

Contents 1 Customizing the page layout 2 Questions 2.1 How do I customize the Quickbar/Navigation bar? 2.2 How do I customize the logo in the top left corner? 2.3 How do I change the icon in the browser's addressline? 2.4 How do I add a fast text editor like Wikipedia? 2.5 How do I change the "content page", "discussion", etc. tags at the top of the page? 2.6 How do I add an editable Left Menu 2.6.1 Skin MonoBook 2.7 How do I add a Google Search bar to the Search Results page? 2.8 How do I edit the layout of all my wiki pages (headers, crumbtrails, etc)? 2.8.1 Custom Headers 2.8.2 Breadcrumb Trail

Customizing the page layout

This is largely dependent on which skin you're using, how its constructed and which version of mediawiki you have. See Explaining Skins for a brief explanation of Skins.

Questions

How do I customize the Quickbar/Navigation bar?

When using the older table formatted Skin pages, the left hand Quickbar is displayed by the Skin::quickBar function.

When using the newer PHPTal formatted pages, the navigation, search and toolbar blocks are laid out in the template spec file (/templates/xhtml_slim.pt under 1.3; /skins/MonoBook.php under 1.4).

Under 1.4 you can add items to the navigation block by manipulating the $wgNavigationLinks array which is defined in /includes/DefaultSettings.php. Any changes should be made in /LocalSettings.php

Under 1.3 you can only add items by changing the xhtml_slim.pt file

New: Under 1.5 you need to edit MediaWiki:Sidebar, see the line in format of link|Display name

See Quickbar for more details about editing the Quickbar/Navigation bar ---

How do I customize the logo in the top left corner?

The logo is a portlet block without a pBody section. It is identified by the p-logo id. The background image is specified by the wgLogo variable, which is defined in /includes/DefaultSettings.php. Redefine this in /LocalSettings.php to change the image. However the size of the p-logo will need to be big enough for the logo if it is not to be clipped. This is set in the stylesheet, under the p-logo style, the default setting is:

.
#p-logo {
    z-index: 3;
    position:absolute; /*needed to use z-index */
    top: 0;
    left: 0;
    height: 155px;
    width: 12em;
    overflow: visible;
}

but note that a tag is on top of the logo so if you are trying to reduce the size of the logo's portlet you will also need to change the #p-logo a and #p-logo a:hover rules. The default setting for these is:

 #p-logo a,
 #p-logo a:hover {
    display: block;
    height: 155px;
    width: 12.2em;
    background-repeat: no-repeat;
    background-position: 35% 50% !important;
    text-decoration: none;
 }

This simple customization will re-define the size of all of them at once...

 #p-logo,
 #p-logo a,
 #p-logo a:hover {
    height: 75px;
}

There is one more rule controlling the amount of space between the logo and first portlet in the side column - the padding on the top of #column-one. By default this is:

#column-one { padding-top: 160px; }

If you want to remove the logo completely, comment out the wgLogo variable. Then set the column-one padding to a small value, such as 21:

#column-one { padding-top: 21px; }

---

How do I change the icon in the browser's addressline?

See article How do I change the icon in browser's address-line? in MediaWiki FAQ

How do I add a fast text editor like Wikipedia?

If you know just edit this question.

How do I change the "content page", "discussion", etc. tags at the top of the page?

The file includes/SkinTemplate.php contains a function that builds the list called buildContentActionUrls. It decides what tabs to include for a given page and what code to run when the user clicks on a tab.

How do I add an editable Left Menu

Skin MonoBook

• Insert a new page into the Namespace MediaWiki; e.g.. MediaWiki:MenuNavigation

• Fill that page with links

  * [[a Link]]
  * [[another Link]]
  * [http://www.Link.de a http-Link]

• open file skin/Monobook.php

• look for:

  <h5><?php $this->msg('navigation') ?></h5>
    <div class="pBody">
      <ul>
        <?php foreach($this->data['navigation_urls'] as $navlink) { ?>
        <li id="<?php echo htmlspecialchars($navlink['id'])
        ?>"><a href="<?php echo htmlspecialchars($navlink['href']) ?>"><?php 
        echo htmlspecialchars($navlink['text']) ?></a></li><?php } ?>
      </ul>
    </div>

• Replace

      <ul>
        <?php foreach($this->data['navigation_urls'] as $navlink) { ?>
        <li id="<?php echo htmlspecialchars($navlink['id'])
        ?>"><a href="<?php echo htmlspecialchars($navlink['href']) ?>"><?php 
        echo htmlspecialchars($navlink['text']) ?></a></li><?php } ?>
      </ul>

with:

      <?php $this->msgWiki( 'MenuNavigation' ) ?>

• The result should look like:

  <h5><?php $this->msg('navigation') ?></h5>
    <div class="pBody">
      <?php $this->msgWiki( 'MenuNavigation' ) ?>
    </div>

How do I add a Google Search bar to the Search Results page?

Look here: How to add Google search to your MediaWiki Search Results Page

How do I edit the layout of all my wiki pages (headers, crumbtrails, etc)?

Custom Headers

You must modify the specific skin.php file you use to display a common header. Insert your header as a <div> section after the <body> tag.

Breadcrumb Trail

Although this doesn't seem to work with 1.5*, see m:User:Barre/Extensions/kw bread crumbs.