F.A.Q. (Frequently Asked Questions)

Assistance for WSC 5 / WSC 3

Explanations of basic functions in styles by Gino Zantarelli ...

  • How to install a WSC 5 / WSC 3 style by Gino Zantarelli
  • 1. Log into your Administrator Control Panel (ACP) of the WSC 5 / WSC 3 Forum Software / WCF.

    2. To install the style pack, open the path CONFIGURATION > PACKAGES > INSTALL PACKAGE and select the button + INSTALL PACKAGE (top right).

    3. Upload and install the WSC 5 / WSC 3 style pack named com.zantarelli.style.xxxxxx.tar.gz from the Theme folder. The style package must not be unpacked beforehand!

  • How to update a WSC 5 / WSC 3 style by Gino Zantarelli
  • At irregular intervals there may be a style update for your purchased product, so carry this out in the Administrator Control Panel (ACP).:


    1. Log into your Administrator Control Panel (ACP) of the WSC 5 / WSC 3 forum software.

    2. Before the upcoming update activities, switch your forum to maintenance mode (path: CONFIGURATION > GENERAL > MAINTENANCE MODE) to avoid problems with the forum software and users and to close background applications.

    3. In the package management under the path CONFIGURATION > PACKAGES, uninstall the style package that is to be updated, save before your self-created logo and any code changes you may have made yourself.

    4. Under the path CUSTOMIZATION > TEMPLATE GROUPS, uninstall the old template group of the style that is to be updated.

    5. Upload and install the newly received WSC 5 / WSC 3 style pack named com.zantarelli.style.xxxxxx.tar.gz from the Theme folder. The style package must not be unpacked beforehand!

    6. Switch off the maintenance mode under the path CONFIGURATION > GENERAL > MAINTENANCE MODE (it's easy to forget...)

  • How to add your own site logo to a WSC 5 / WSC 3 style
  • You can upload your own site logo directly in the Administrator Control Panel (ACP) of your WSC 5 / WSC 3 under the path CUSTOMIZATION > STYLES > YOUR USED STYLE > GLOBAL SETTINGS, in the style settings is then the exact height and Specify width in pixels.


    Under the path CUSTOMIZATION > STYLES > YOUR USED STYLE > GLOBAL SETTINGS, a logo for the mobile view can also be uploaded directly. The dimensions should not be too large (max. 250px x 50px).

  • How do I change the background image of the page
  • A page background image is used in various WSC 5 / WSC 3 styles by Gino Zantarelli. You can adapt this to your own needs.


    1. In the installed Woltlab software on your server use an FTP program to search for the image "pageBG.jpg" in the style folder for the style to be used in the path IMAGES > NAME OF THE STYLE FOLDER and download it to your PC.

    2. Create your background image with the same pixel sizes as the original background image (which was downloaded) and save it as a jpg file titled pageBG (i.e. pageBG.jpg).

    3. Transfer your self-created background image for the page via FTP program back to the style folder of the style to be used, then update the page view in the browser and check it.

  • How do I change the background image of the header
  • A background image is displayed in the header area in various WSC 5 / WSC 3 styles by Gino Zantarelli. Of course, you can adapt this to your own needs.


    1. In the installed Woltlab software on your server, use an FTP program to search for the image "headerBG.jpg" in the style folder of the style to be used in the path IMAGES > NAME OF THE STYLE FOLDER and download it to your PC.

    2. Create your background image with the same pixel sizes as the original background image (which was downloaded) and save it as a jpg file with the title headerBG (i.e. headerBG.jpg).

    3. Transfer your self-created background image for the header via FTP program back to the server in the style folder of the style to be used, then update the page view in the browser and check it.

  • How do I center the header logo image of a WSC 5 / WSC 3 style
  • There are always requests as to how the header logo image of a WSC 5 / WSC 3 style can be set in the middle (centering). Here are a few solutions that are easy to implement.

    If you would like to place your logo image horizontal in the middle of the header in the standard style of the WSC 5 / WSC 3, please proceed as follows:


    1. In the WSC 5 / WSC 3 Administrator Control Panel (ACP), open CUSTOMIZATION > STYLES > YOUR STYLE.

    2. Go to the ADVANCED SETTINGS tab, there you will find the upper input window "Individual CSS and SCSS" with the already inserted CSS adjustments from the style creator.

    3. Remove any active write protection, otherwise your changes will not be applied later!

    4. Paste the following CSS code in the upper part of the input window:

    5. If the logo has already been set to the "absolute" position using CSS code (can be found in many styles that have already been adjusted), the following CSS code may be used:


    If you would like to align your logo image in the header vertically in the standard style of the WSC 5 / WSC 3, please proceed as follows:


    1. In the WSC 5 / WSC 3 Administrator Control Panel (ACP), open CUSTOMIZATION > STYLES > YOUR STYLE.

    2. Paste the following CSS code in the upper part of the input window:

    3. Now adjust the numerical values - the first and third value is the distance above & below, the "0" value on the left & right.

  • Where do I find and edit the CSS definition of a WSC 5 / WSC 3 style
  • Sehr viele WSC 5 / WSC 3-Stile werden mit CSS-Codes speziell angepasst um ein optisch ansprechendes Aussehen oder Funktionen zu ermöglichen, daher sollte ein Forenbesitzer auch wissen wo dieser diverse Anpassungen oder Änderungen vornehmen kann.

    If you would like to adapt the display / text content for your own purposes, proceed as follows:


    1. In the WSC 5 / WSC 3 Administrator Control Panel (ACP), open CUSTOMIZATION > STYLES > YOUR STYLE.

    2. Now go to the ADVANCED SETTINGS tab, where you will find the upper input window "Individual CSS and SCSS" with the already inserted CSS adjustments from the style creator.

    3. Remove any active write protection, otherwise your changes will not be applied later!

    4. Paste your CSS customization codes in the upper part of the input window, mobile mode CSS codes in the places with various snap points like e.g. ex. for smartphone mode or for tablet mode.

    ATTENTION: SAVE the original content beforehand (e.g. as a txt file on your PC)!

  • How do I use the search function in the CSS definition of a WSC 5 / WSC 3 style
  • CSS definitions for a style by Gino Zantarelli can contain well over 7000 lines of code. If a certain line of code is searched for, the built-in (but hidden) search function in the Codemirror Editor can be called up and used.

    If you would like to use the search function, proceed as follows:


    1. In the WSC 5 / WSC 3 Administrator Control Panel (ACP), open CUSTOMIZATION > STYLES > YOUR STYLE.

    2. Now go to the ADVANCED SETTINGS tab, where you will find the upper input window "Individual CSS and SCSS" with the already inserted CSS adjustments from the style creator. Remove any write protection that may be active, otherwise the changes you have made will not be applied later!

    3. Click in the input window at the top left and then press the key combination STRG + F, a small input window opens for your search query.

    4. Enter the code you are looking for in the input window and then press the ENTER key. If the code you are looking for is available, it will be displayed in yellow in the window.

    4. If you are looking for more than one place in your entered CSS code, then use the key combination CTRL + G to get to the next possible search result. This practical search function can also be used in templates.

  • How do I remove external GoogleFonts embeds from a style
  • Many of our products have a direct integration of Google Fonts in the CSS definition of the style, which is legally very controversial despite its inclusion in the data protection declaration. In order to protect yourself from possible warnings, you should remove this integration yourself, since the current WSC supports its own hosting of the font. To remove the possibly integrated GoogleFont font, proceed as follows:


    1. In the WSC 5 / WSC 3 Administrator Control Panel (ACP), open CUSTOMIZATION > STYLES > YOUR STYLE.

    2. Now go to the ADVANCED SETTINGS tab, where you will find the upper input window "Individual CSS and SCSS" with the already inserted CSS adjustments from the style creator. Remove any write protection that may be active, otherwise the changes you have made will not be applied later!

    Locate and remove the line of embedded Google Fonts code under the === Basics === section at the top of the CSS definitions which looks something like this:

    ATTENTION: Make sure that the font to be used is entered in the style settings under the GLOBAL SETTINGS > FONT tab. In this example, the font would be Open Sans.

  • Where to edit supplied templates in WSC 5 / WSC 3 styles by Gino Zantarelli
  • Various WSC 5 / WSC 3 styles by Gino Zantarelli use special template adjustments to create extensions or improvements in styles. If you want to adapt the template content for your own purposes, proceed as follows:


    1. In the Administrator Control Panel (ACP) of your WSC 5 / WSC 3, open the path CUSTOMIZATION > TEMPLATES.

    2. In the selection field on the left of the filter function, select the template group used for the style and press the "Send" button.

    3. A list opens showing the templates used in the selected template group, which can now be edited manually.

    ATTENTION: SAVE the original content beforehand (e.g. as a txt file on your PC)!