Design & Layout

• 1. Settings
  • 1.a MasterSets, DesignSets*
  • 1.1 Logos & Header
  • 1.b Colors*
  • 1.c Background images*
  • 1.2 CSS Settings
  • 1.3 General Settings
• 2.Wysiwyg, BBCode, Editors
  • 2.1 WYSIWYG-Editors
  • 2.2 Wysiwyg Templates
• 3. Design Templates
  • 3.1 Story Templates
  • 3.2 Product Templates
  • 3.3 Feed Templates
  • 3.4 Blog Templates
  • 3.5 Company Templates
  • 3.6 Campaign Templates
• 4. Master Layout & Modules
  • 4.a Master Designs Templates*
  • 4.1 Design Modules
  • 4.2 Design Attributes
  • 4.3 Elements
  • 4.4 Design Attribute Conditions

v12.0 - Last Mod.: 07/04/2022

---

---

In the area "Design & Layout" of your SITEFORUM portal you can customize the colors, logos and the layout of your portal. For deeper and individual modification you will need to know HTML and CSS.

Log in as a "Designer" or "Portal Master."

1. Click the button Portal Manager to get to the administrative area.
2. Then click Tools & Administration > Design & Layout.

1. Settings

Here you define basic settings concerning the design and layout of your portals.

Top

1.a MasterSets, DesignSets*

Top

1.1 Logos & Header

Here you can customize basic settings concerning logos and header background images.

1. In the navigation on the left below Settings click Logos & Headers.
   • Logo "left"
     • If you have uploaded the logo to the file system already, you can simply select it from the corresponding folder.
     • In order to upload a new logo image from your harddrive
       1. click the button Browse.
       Another window opens up.
       2. Choose the file from your system.
       3. Click the button Open in the new window.
       The second window closes.
       4. Select the size, in which the logo should be uploaded (resize to 100 px, Standard size of 250 px, original width of image etc).
       5. Click the button Upload in the file system.
       The file is shown in the path.
2. Click on Save to finalize your settings and selection.
   1. Background "Header"* Here you can select header images for your portal:
      • General this image will be shown on all portal pages, except for the homepage.
        You can either upload a custom image or use some standard picture from the image gallery.
      • Homepage this image will be shown on your start page.
        You can either upload a custom image or use some standard picture from the image gallery.
   2. Background "General" Here you can select a general background image for your portal.
   3. Click the Save button when ready.

Top

1.b Colors*

1. Click Colors in the navigation on the left.
    You are forwarded to the Simple mode tab.
2. Select the area in which you want to edit the colors.
3. Enter the corresponding HTML color value or select the color from the color palette by clicking the icon.
4. If required repeat this process for further areas.
5. Click the button Save at the bottom of the page when ready.

Top

1.c Background Images*

1. Click Background Images in the navigation.
   You are forwarded to the Simple mode tab.
2. Select the area in which you want to edit the background image.
3. Choose the corresponding image by clicking the button select image.
4. From the selection box background image-repeat select how and if the image should be repeated.
5. Enter the exact position in the field background position.
6. If required repeat this process for further areas.
7. Click the button Save at the bottom of the page when ready.

Top

1.2 CSS Settings

1. Click on CSS Settings in the navigation.

Tab CSS Modules
Start

1.3 General Settings

1. Click General Settings in the navigation.

Tab General

1. Here you can select the view for several network applications:
   • Portal view: network applications are integrated into the portal design
   • Network view: network applications are not integrated into the portal design
   • Admin view: network applications are integrated into the portal design and the admin navigation is shown.    

1. Select the main doctype for your portal header from the Main Doctype selection box.
2. From the selection box CSS File select the *.css file for the story print mode.
3. From the selection box Portal label select the appropiate label.
4. Enter in the field Standard font size the desired font size in percent.
5. Enter in the field Words the number of words when a whitespace should be inserted.

 

1. Enter the width of images in intro templates in pixles in the field Intro Width.
2. Enter in the field Intro Hight the hight of images in intro templates in pixles.
3. Enter in the field Image Widths the width in pixles for uploaded images.
4. Click the button Save when ready.

 

• Design Manager - Recovery: Advanced options for recovery of Design Modules.
• Design Manager - Cache-System: Reset / clear the cache