Design Attributes

1. Requirements for use

2. Design Attributes

2.1 Add Design Attribute

2.2 Edit Design Attribute

2.3 Delete Design Attribute

3. Elements

3.1 Edit element

3.2 Delete element

4. Element conditions

5. Design Attribute Conditions

5.1 Add condition

5.2 Edit condition

5.3 Delete condition

---

With SITEFORUM Design Attributes you can display various colors, logos or special HTML code, depending on certain conditions (e.g. the display of various menus or the use of various applications). You can, for example, display an image everywhere in the portal while at the same time displaying a special logo or different color in your Online Shop.

Note: To work in this section it is absolutely necessary that you have good HMTL skills.

TIP: Take a look at the animated video manuals to this topic.

1. Requirements for use

• 1. Concept, Display, Dependence
  First, create a concept upon which displays will be dependent. The utilization of a Design Attribute could resemble the following:
  1. In the menu "Flowers" a flower logo should appear with appropriate colors.
  2. In the menu "Shipping" a transporter logo appears with appropriate colors.
  
  
• 2. Existence of elements
  Depending on the type of Design Attribute the following requirements must be set to allow the creation of new conditions:
  • Logo Logos have to exist already or must be uploaded onto the server.
  • CSS Style sheet files with various colors must be available in order to be selected.
  • Template Templates must exist in your account.
  • Newsflash Newsflashes have to be already created in order to be available.
  • Story You need the story ID for stories.
  • URL To link to external websites you need the entire URL.
  • Banner To create standard banners, banners have to exist.
  
  
• 3. Creating conditions
  To create Design Attributes you must create appropriate conditions for your concept. They are necessary to connect elements with conditions.
  
  
• 4. Placeholders in Master Design
  Please note that Design Attributes must always be added to "MasterDesign," "stories" or "story templates" through the use of the placeholder $designAttribute:your_name. When creating "CSS" attributes, assign the placeholder "$designAttribute:_css" to the design module "htmlHead."
  
  

WARNING: Design Attributes are session-dependent because of performance reasons. This means that changes made to attribute elements and activities will be visible first when you are logged in as "Portal Master" or "Designer". For all other users the changes will be visible after visiting the portal again.

TOP

2. Design Attributes

Please log in as "Designer" or "Portal Master."

1. Click the button Portal Manager to get to the administrative area.
2. Then click Tools & Administration > Design & Layout.
3. In the navigation on the left, below Master Design & Design Modules, click Design Attributes.

As far as Design Attributes exist already they are listed:

• Active The colored circle shows the status of the attribute, green = active, red = inactive.
  By clicking the circle you can change the status.
• Attribute name Shows the attribute name.
• Type Shows the attribute type.
• Elements Shows the number of changing elements which are displayed by calling up the Design Attribute.
• Edit elements By clicking the icon you can edit existing elements or add new ones.
• Edit conditions By clicking the icon assign conditions to the element.
• Edit attribute By clicking the icon you get to the editing mode.
• Delete By clicking the icon you can delete the element.

TOP

2.1 Add Design Attribute

1. Click the button Portal Manager to get to the administrative area.
2. Then click Tools & Administration > Design & Layout.
3. In the navigation on the left, below Master Design & Design Modules, click Design Attributes.
4. Click the tab Add Design Attribute.

All Design Attribute types are shown:

• Images or Logos Type for images and logos.
• Banner Type for banner ads.
• Script-Codes or HTML-Codes Type for Script-Codes or HTML-Codes.
• CSS-Colors, Fonts, Styles and Layouts Type for CSS-Colors, Fonts, Styles and Layouts.
• Newsflash Type for Newsflashs in the Menu Manager.
• Stories Type for Stories in the Story Manager.
• Feeds (External) Type for external feeds (Display as simple list).
• News Feeds (External) Type for external News Feeds (Display template bases).
• Websites (External) Type for the import of external websites.
• SITEFORUM Templates Type for including SITEFORUM templates.
• SITEFORUM Functions Type for including SITEFORUM functions.

5. Click the desired Design Attribute type.
6. Define the particular Design Attribute as follows:

• Images or Logos
  1. Enter in the field Name an identifier. This name becomes the placeholder, which then will be called up like &designAttribute:name.
  2. In the area Attribute type the chosen type is displayed.
  3. In the area Standard value choose the standard value (in this case standard image or standard logo) by clicking the button Select image and choosing the file.
  Note: The standard value is called up as soon as the Design Attribute is active and assigned in the Master Design with the particular placeholder ($designAttribute:name). If this field stays empty no value will be displayed.
  4. Activate the option Active, to activate the Design Attribute.
  5. Click the button Save.



• Banner
  1. Enter in the field Name an identifier. This name becomes the placeholder, which then will be called up like &designAttribute:name.
  2. In the area Attribute type the chosen type is displayed.
  3. In the area Standard value choose from the selection box the standard value. If the selection box is empty there was no banner created in the Banner Manager, q.v. Support End User > Tools & Administration > Banner
  Note: The standard value is called up as soon as the Design Attribute is active and assigned in the Master Design with the particular placeholder ($designAttribute:name). If this field stays empty no value will be displayed.
  4. Activate the option Active, to activate the Design Attribute.
  5. Click the button Save.



• Script-Codes or HTML-Codes
  1. Enter in the field Name an identifier. This name becomes the placeholder, which then will be called up like &designAttribute:name.
  2. In the area Attribute type the chosen type is displayed.
  3. Enter in the field Standard value HTML, CSS or JS Code. Below the field you can view placeholders, special characters and CSS. Click the small question mark on the right.
  Note: The standard value is called up as soon as the Design Attribute is active and assigned in the Master Design with the particular placeholder ($designAttribute:name). If this field stays empty no value will be displayed.
  4. Activate the option Active, to activate the Design Attribute.
  5. Click the button Save.



• CSS-Colors, Fonts, Styles and Layouts
  1. Enter in the field Name an identifier. This name becomes the placeholder, which then will be called up like &designAttribute:name.
  2. In the area Attribute type the chosen type is displayed.
  3. In the area Standard value choose from the selection box the standard value.
  Note: The standard value is called up as soon as the Design Attribute is active and assigned in the Master Design with the particular placeholder ($designAttribute:name). If this field stays empty no value will be displayed.
  4. Activate the option Active, to activate the Design Attribute.
  5. Click the button Save.



• Newsflash
  1. Enter in the field Name an identifier. This name becomes the placeholder, which then will be called up like &designAttribute:name.
  2. In the area Attribute type the chosen type is displayed.
  3. In the area Standard value choose from the selection box the standard value. If the selection box is empty there was no Newsflash created in the Menu Manager, q.v. Support End User > Website & CMS > Menus.
  Note: The standard value is called up as soon as the Design Attribute is active and assigned in the Master Design with the particular placeholder ($designAttribute:name). If this field stays empty no value will be displayed.
  4. Activate the option Active, to activate the Design Attribute.
  5. Click the button Save.



• Stories
  1. Enter in the field Name an identifier. This name becomes the placeholder, which then will be called up like &designAttribute:name.
  2. In the area Attribute type the chosen type is displayed.
  3. Enter in the field Standard value the standard StoryID.
  Note: The standard value is called up as soon as the Design Attribute is active and assigned in the Master Design with the particular placeholder ($designAttribute:name). If this field stays empty no value will be displayed.
  4. Activate the option Active, to activate the Design Attribute.
  5. Click the button Save.



• Feeds (external)
  1. Enter in the field Name an identifier. This name becomes the placeholder, which then will be called up like &designAttribute:name.
  2. In the area Attribute type the chosen type is displayed.
  3. In the area Standard value choose from the selection box the standard value. If the selection box is empty there was no Feed created in the Feed Manager, q.v. Support End User > Website & CMS > Feeds.
  Note: The standard value is called up as soon as the Design Attribute is active and assigned in the Master Design with the particular placeholder ($designAttribute:name). If this field stays empty no value will be displayed.
  4. Activate the option Active, to activate the Design Attribute.
  5. Click the button Save.



• News Feeds (external)
  1. Enter in the field Name an identifier. This name becomes the placeholder, which then will be called up like &designAttribute:name.
  2. In the area Attribute type the chosen type is displayed.
  3. In the area Standard value choose from the selection box the standard value. If the selection box is empty there was no News Feed created in the Feed Manager, q.v. Support End User > Website & CMS > Feeds.
  Note: The standard value is called up as soon as the Design Attribute is active and assigned in the Master Design with the particular placeholder ($designAttribute:name). If this field stays empty no value will be displayed.
  4. Activate the option Active, to activate the Design Attribute.
  5. Click the button Save.



• Websites (external)
  1. Enter in the field Name an identifier. This name becomes the placeholder, which then will be called up like &designAttribute:name.
  2. In the area Attribute type the chosen type is displayed.
  3. Enter in the field Standard value the standard website.
  Note: The standard value is called up as soon as the Design Attribute is active and assigned in the Master Design with the particular placeholder ($designAttribute:name). If this field stays empty no value will be displayed.
  4. Activate the option Active, to activate the Design Attribute.
  5. Click the button Save.



• SITEFORUM Templates
  1. Enter in the field Name an identifier. This name becomes the placeholder, which then will be called up like &designAttribute:name.
  2. In the area Attribute type the chosen type is displayed.
  3. Enter in the field Standard value the name and the path to the SITEFORUM template.
  Note: The standard value is called up as soon as the Design Attribute is active and assigned in the Master Design with the particular placeholder ($designAttribute:name). If this field stays empty no value will be displayed.
  4. Activate the option Active, to activate the Design Attribute.
  5. Click the button Save.



• SITEFORUM Functions
  1. Enter in the field Name an identifier. This name becomes the placeholder, which then will be called up like &designAttribute:name.
  2. In the area Attribute type the chosen type is displayed.
  3. In the area Standard value choose from the selection box the standard function.
  Note: The standard value is called up as soon as the Design Attribute is active and assigned in the Master Design with the particular placeholder ($designAttribute:name). If this field stays empty no value will be displayed.
  4. Activate the option Active, to activate the Design Attribute.
  5. Click the button Save.

The new attribute is listed in the overview.
Note: Because of technical reasons all blanks are exchanged through underlines.



TOP

2.2 Edit Design Attribute

1. Click the button Portal Manager to get to the administrative area.
2. Then click Tools & Administration > Design & Layout.
3. In the navigation on the left, below Master Design & Design Modules, click Design Attributes.
4. Choose in the overview the Design Attribute you want to edit.
5. Click the icon Edit attribute.
6. Edit the attribute as desired, q.v. 2.1 Add Design Attribute.
7. Click the button Save when ready.

TOP

2.3 Delete Design Attribute

1. Click the button Portal Manager to get to the administrative area.
2. Then click Tools & Administration > Design & Layout.
3. In the navigation on the left, below Master Design & Design Modules, click Design Attributes.
4. Choose in the overview the Design Attribute you want to delete.
5. Click the icon Delete.
6. Confirm the erasing procedure by clicking the button OK.

TOP

3. Elements

To assign elements like images to a Design Attribute, please log in as "Designer" or "Portal Master."

1. Click the button Portal Manager to get to the administrative area.
2. Then click Tools & Administration > Design & Layout.
3. In the navigation on the left, below Master Design & Design Modules, click Design Attributes.
4. Choose in the overview the Design Attribute to which you want to add an element.
5. Click the icon Edit elements.

As far as elements exist already they are listed:

• Priority Shows the priority.
• Element name Shows the element name.
• Conditions Shows how many fixed conditions are assigned.
  Note: A yellow circle demonstrates that no element condition was added yet.
• Catenation Shows the catenation of the condition.
• Edit By clicking the icon you get to the editing mode.
• Delete By clicking the icon you can delete the element.

5. Click the link Add new element below the table.
6. Enter in the field Name an identifier.
7. From the selection box Catenation type choose the catenation type.
8. Enter in the field Visible value the value.
   Note: This value is depending on the particular Design Attribute type. By default the field is filled with the standard value of the element.
9. Click the button Save when ready.

Note: Assign as many elements to the Design Attribute as you like; they will be active not before a condition was assigned to the element and this condition is true.

TOP

3.1 Edit element

1. Choose in the overview the Design Attribute whose element you want to edit.
2. Click the icon Edit elements.
3. Choose the element you want to edit.
4. Click the icon Edit.
5. Edit the element as desired, q.v. 3. Elements.
6. Click the button Save when ready.

TOP

3.2 Delete element

1. Choose in the overview the Design Attribute whose element you want to delete.
2. Click the icon Edit elements.
3. Choose the element you want to delete.
4. Click the icon Delete.
5. Confirm the erasing procedure by clicking the button OK.

TOP

4. Element conditions

With Element conditions you define what will happen with the element, like when it will be called up.

1. Click the button Portal Manager to get to the administrative area.
2. Then click Tools & Administration > Design & Layout.
3. In the navigation on the left, below Master Design & Design Module, click Design Attributes.
4. Choose in the overview the Design Attribute whose element you want to add an element condition.
5. Click the icon Edit conditions.
   Note: To assign element conditions, elements have to exist already, see column Elements.

As far as several elements exist they are listed among each other:

• # Numbers all elements serially.
• Priority By clicking the arrows you can move the elements and change the priority.
• Element name Shows the element name.
  By clicking the name you get to the editing mode.
• Catenation Shows the catenation.
• Condition The selection box contains all conditions.
• Delete By clicking the icon you can delete the element condition.

6. Choose from the selection box in the column Condition the first element condition.
7. Click the button Add condition.
8. Repeat this procedure as often as necessary.
9. By clicking the icon Delete you can delete the element condition.

Now embed the Design Attribute with elements and element conditions as well as the placeholder $designAttribute:name on the right place in the Master Design, so that the Design Attribute will be displayed, q.v. Support End User > Tools & Administration > Design settings.

TOP

5. Design Attribute Conditions

In this section you create conditions which you can use in the element conditions. Please log in as "Designer" or "Portal Master."

1. Click the button Portal Manager to get to the administrative area.
2. Then click Tools & Administration > Design & Layout.
3. In the navigation on the left, below Master Design & Design Module, click Design Attribute Conditions.

As far as conditions exist already they are listed.

TOP

5.1 Add condition

1. Click the button Portal Manager to get to the administrative area.
2. Then click Tools & Administration > Design & Layout.
3. In the navigation on the left, below Master Design & Design Module, click Design Attribute Conditions.
4. Click the tab Add condition.

You see all global conditions which you can add to Design Attributes:

• Condition type Shows the type of the condition.
• ObjectOperator Shows the "logic Operator" for controlling the condition.
• Value Depending on the condition type you can choose and add different values.

1. Choose the desired Condition type.
2. From the selection box choose the desired ObjectOperator.
3. From the selection box choose the desired Value.
4. Click the button Add condition.

You get back to the overview of the conditions. Repeat this process to add further conditions.

At the bottom of the table you can create individual conditions like
$if{$equals{$getCurrent{Test}}{123}}{yes}{no}

This example transacts as follows:

1. From the selection box Condition type select the type Current.
2. Enter in the field Name the name Test.
3. From the selection box ObjectOperator select the operator equals.
4. Enter in the field Value the value 123.
5. Click the button Add condition.

TOP

5.2 Edit condition

1. Click the button Portal Manager to get to the administrative area.
2. Then click Tools & Administration > Design & Layout.
3. In the navigation on the left, below Master Design & Design Module, click Design Attribute Conditions.
4. Choose in the overview the condition you want to edit.
5. Click the icon Edit.
6. Choose the element you want to edit.
7. Click the icon Edit.
   The chosen condition is pointed out grey.
8. Edit the condition as desired, q.v. 5.1 Add condition.
9. Click the button Update condition when ready.

TOP

5.3 Delete condition

1. Click the button Portal Manager to get to the administrative area.
2. Then click Tools & Administration > Design & Layout.
3. In the navigation on the left, below Master Design & Design Module, click Design Attribute Conditions.
4. Choose in the overview the condition you want to delete.
5. Click the icon Delete.
6. Confirm the erasing procedure by clicking the button OK.

TOP

SITEFORUM Portal Software : Web Applications To Smart Up Your Business | Enterprise Content Management Software | Shortcuts | Portalsoftware