Configuring portlets

Portlets may be configured in many ways. For example, you may change the way a portlet looks, the captions it uses, the data entry that it may accept, and its position on the screen.

The control toolbar

Each portlet can be configured using the control toolbar.

You access the toolbar from the context menu in the top right corner of the portlet. The context menu becomes visible when you hoover over the portlet.

Examples of settings that can be configured:

  • The look and feel of a portlet. For example, you may change the fonts, colours and titles.
  • Configuration of user types that may view this portlet.
  • Preferences for a portlet, that is, how the portlet works. For example, you may set data entry parameters. This only appears for Arena-specific portlets.
  • Export and import of settings and user preferences for a portlet.

When making changes in the control toolbar and clicking Reset, the settings will reset to default. If you click Reset by mistake, click Cancel and close the window.

Look and feel

Setting the portlet title or renaming a portlet

Each portlet has a title that appears on the screen. Portlet titles are set automatically in Arena, but you can also set them manually or adjust them.

You can rename a portlet in different ways, for example by clicking the title in the portlet or by entering the portlet preferences. You can also update the title using the control toolbar.

Changing the title using the control toolbar

  1. Select Look and Feel Configuration in the context menu.
  2. Select Yes for Use Custom Title.
  3. In the title field, type the new title for the portlet.
  4. Choose a language for the title. This must be the language in which the title has been written. When an Arena user chooses their preferred language, Arena will use the title in the chosen language for each portal.
  5. Make sure that Decorate or Borderless is selected for Application Decorators. The Barebone setting displays no portlet title.
  6. Click Save.

Choosing a portlet title

When choosing the title for a portlet, choose a title that…

  • reflects the function of the portlet. This makes it easier for Arena users to understand and use the portlet.
  • works in every language in which Arena will be used, and which translates easily.
  • is brief. Try to use nouns and transitive nouns, and avoid describing the portlet with adjectives.

Setting text styles

You can specify the text format for each portlet.

  1. Open the look and feel settings from the control toolbar and click the Text Styles tab.
  2. Choose a font and a font size. The list of fonts is limited to default fonts that are certain to be available on the computer of any Arena user. Leave this field blank to use the Arena default font. You can also choose bold or italic variants of the font.
  3. In Color, type the html # code for the text colour. Alternatively click the pen icon (not available in all portlets) next to the text field and in the dialog that opens choose a colour from the colour palette, using either the selector panels, RGB values, or an html # code.
  4. In Alignment choose the alignment (also known as justification) of the font.
  5. In Text decoration choose the addition marks for the font, such as underline or overline.
  6. In Word Spacing choose the word spacing value, in em. Em is a proportional unit of measurement, referring to the height of the font. For example, for a font 5 millimetres high, a word spacing value of 2 denotes that the space between each word will be 10 (2 x 5). Thus, if the font size is increased, the word spacing will increase proportionately for the same em value.
  7. In Line Height choose the line height of the font, in em.
  8. In Letter Spacing choose the letter spacing, in px. Px is a unit of measurement using pixels.
  9. Click Save.

Setting background styles

You can specify the background styles for each portlet.

  1. Open the look and feel settings from the control toolbar and click the Background Styles tab.
  2. In Background Colour type the name of the background colour. For example, to use black type ‘black’.
  3. Click Save.

Setting border styles

You can specify the border styles for each portlet.

  1. Open the look and feel settings from the control toolbar and click the Border Styles tab.
  2. In the Border Width section, check Same for All to use the same width for all borders.
  3. In Top type the border width, and then select the border width unit.
  4. If you have checked Same for All, the values set in Top will apply to all four borders Otherwise, set individual width for Right, Bottom, and Left.
  5. In the Border Style section, check Same for All to use the same style for all borders.
  6. In Top choose the border style.
  7. If you have checked Same for All, the values set in Top will apply to all four borders Otherwise, set individual style for Right, Bottom, and Left.
  8. In the Border Color section, check Same for All to use the same the colour for all borders.
  9. In Top choose the border colour.
  10. If you have checked Same for All, the values set in Top will apply to all four borders Otherwise, set individual colour for Right, Bottom, and Left.
  11. Click Save.

Setting margins and padding

You can specify the margin and padding for each portlet. Margin is a gap around the outside of the portlet, which separates it from neighboring portlets. Padding is the space between the border of the portlet and the portlet’s content.

  1. Open the look and feel settings from the control toolbar and click the Margin and Padding tab.
  2. In the Padding section, check Same for All to use the same padding for all borders.
  3. In Top type the border padding width, and then select the border padding width unit.
  4. If you have checked Same for All, the values set in Top will apply to all four borders Otherwise, set individual padding for Right, Bottom, and Left.
  5. In the Margin section, check Same for All to use the same margin for all borders.
  6. In Top type the border margin width, and then select the border margin width unit.
  7. If you have checked Same for All, the values set in Top will apply to all four borders Otherwise, set individual margin for Right, Bottom, and Left.
  8. Click Save.

Setting advanced styling

You can specify a custom CSS for use with a portlet, and apply CSS rules to control how the CSS behaves with this portlet or all similar portlets.

Note:
Do not change these settings unless you are familiar with how the changes will affect Arena
  1. Open the look and feel settings from the control toolbar and click the Advanced Styling tab.
  2. In Enter your custom CSS class names type your custom CSS class names.
  3. In Enter your custom CSS type your custom CSS.
  4. Optionally, click Add a CSS rule for just this portlet to add a rule for this portlet only. This will add the relevant script to the Enter your custom CSS field.
  5. Optionally, click Add a CSS rule for all portlets like this one to add a rule for all portlets similar to this one. This will add the relevant script to the Enter your custom CSS field.
  6. Modify the script as required.
  7. Check Update my styles as I type to update styles as you modify them here.
  8. Click Save.

Configuration

You can configure access to a portlet. For example, a portlet may only be visible to users who have logged in to Arena.

Setting up supported clients

  1. Select Configuration from the control toolbar and click the Supported Clients tab.
  2. To define from what client editing should be possible, select Regular browsers and/or Mobile devices under Portlet Mode: Edit.
  3. To define from what client viewing should be possible, select Regular browsers and/or Mobile devices under Portlet Mode: View.
  4. Click Save.

Sharing a portlet with other web sites

You can share a portlet with any other website by pasting the provided code into the target website’s webpage.

  1. Select Configuration from the control toolbar and click the Sharing tab
  2. The code to copy is shown in a text box. Highlight all the code and copy it.
  3. Paste the code into the target webpage.

Sharing a portlet on Facebook

  1. Select Configuration from the control toolbar and click the Sharing tab
  2. Click the Facebook area.
  3. If you have not already registered as a developer with Facebook, do so and you will get an API key and a canvas page URL.
  4. Paste the API key and the canvas page URL in the fields respectively.
  5. Click Save.

Configuration tabs not described

The tab Communication appears for some portlets. This tab should not be used.

Under the tab Sharing, the tabs OpenSocial gadget, Netvibes and Friends are not covered in this help.

Settings on the Permissions tab should not be used. Permissions are defined using roles. There are high level definitions of a couple of roles, and new default roles will be launched shortly.

Preferences

You can set preferences for a portlet. As each portlet does something different, the preferences for each portlet may differ widely.

See also: Portlets in Arena