Install a pre-made skin (zIF)

This documentation applies to zIFBoards only.

This documentation covers how to install a pre-made skin. Many free skins can be obtained in our Skin Galleries. Installing a new skin will replace the current skin on your board. To have more than one skin, a third party code is required.

Once you have chosen your new skin, the skin topic will contain the codes for your selected skin. These codes will be installed in the Skinning & Styles section of your AdminCP.

Replacing the CSS

CSS stands for “Cascading Style Sheets”. The style sheets control the colors, backgrounds and styling of your skin. The CSS is located on the Manage Style Sheets page linked under Skinning & Styles in the left side menu. Once you have clicked into the Style Sheets page:

— Remove everything contained in the Style Sheet text area box.

— Copy all the content from the box labelled CSS in the first post in the topic containing the skin you linked to, and paste it into the Style Sheet box on your board. Click “Edit CSS” to save the changes.

Replacing the Board Wrappers

The board wrappers contain the codes that are needed to format the placement of the various sections of your board. There may be some codes unique to your skin. You may or may not need to edit all the sections in the Board Wrappers, but most skins will have special codes for the Header & Body, and for the Footers. Instructions will be posted in the skin topic. In your Admin CP, go to Skinning & Styles » Board Wrappers.

— Remove everything from the Header & Body box.

— Copy all the content from the box labelled Header & Body in the skin topic, and paste it into the Header & Body box on your board.

— Copy the content from the box labelled Footer in the skin topic, and paste it into the Footer box on your board. It's located underneath the Header & Body box mentioned in the previous steps. Click “Edit Wrapper” to save the changes.

Replacing the Images

You may install custom buttons for your skin if you wish. If a button set is not provided with your skin, you can search our graphic galleries to find something suitable.

Locate the Images link in your Admin CP under the Skinning and Styles category. Click it. Each image (logo, buttons, markers, etc.) has a unique input box on this page which contains the coding used to generate the image. The codes in the boxes will look like this:

<img src='<#IMG_DIR#>/logo4.gif' alt='' border='0' />

'http:…….gif' is the hosted URL for the image. You need to replace the URL (found within the single quotes) with one that links to your own image. If you would like to add a text that will display if the image fails to load, type it in here between the single quotes: alt='YOUR ALT TEXT' Alternately, you may remove the coding altogether if you wish to omit the image for that section.

Your images need to be hosted to provide the URL you need to install them. You can upload images to your hard drive, and then host them on your board as an attachment to posts in a staff area of your forum, or to a third party hosting site. Uploading to your board is the preferred method.

Make sure uploading is enabled for both your member group and the forum used to host the images. [For more details on how to upload to your board, please see this post found in our support board tutorial section.]

Note: You do not need to insert your URL into the code, you can simply delete everything and then add the plain URL. The board will automagically supply the rest of the code when you submit the edit.

Tick the box at the right end of the field and then click “Submit” at the bottom of the page to complete the edit.

See Also

zifboards/skinning/install.txt · Last modified: 2015/07/10 15:28 by Helena