Ribbon

In this section:

The ribbon contains three tabs:


Top of page

x
Layout Tab

In this section:

The following image shows the Layout tab.

Layout Tab

The layout tab has two groups, Portal and Page & Banner.



x
Portal Group

The following topics describe the options in the Portal group.



x
Navigation

The following image shows the Choose a Navigation Layout option.

Choose a Navigation Layout option

As shown, you can choose among:

  • None. There is no navigation menu.
  • Top. The navigation menu is located beneath the banner at the top of the window. This is the default layout.
  • Left. The navigation menu is located on the left side of the screen in the left banner.
  • Right. The navigation menu is located on the right side of the screen in the right banner.


x
Banner

The following image shows the Choose Banner Areas option.

Choose Banner Areas option

A banner is an area that is visible in the portal no matter what page you are on. You can choose to have no banner or any combination of top, bottom, left, and right banners.

As shown, you can choose among:

  • Top. The banner is at the top of the window. This is the default area.
  • Bottom. The banner is at the bottom of the window.
  • Left. The banner is at the left of the window.
  • Right. The banner is at the right of the window.

Click each menu option to turn the associated banner on or off.



x
Menu Bar

The following image shows the Menu Bar.

Menu Bar

The next image shows the Select Location & Alignment option for the Menu Bar.

Select Location and Alignment Option

The Menu Bar button allows you to use a visual interface to change the location of the links. You can choose from three main locations:

  • Top Bar. The links are displayed above the top banner.
  • Top Banner. The links are displayed within the top banner. This is the default location, with a right alignment of the links.
  • Bottom Bar. The links are displayed below the bottom banner.

The bar options are thin strips, either at the top or bottom of the window. They are always visible, no matter how far down or up you scroll.

In each of the locations, you can choose alignment options as shown. For example, you can align the links to the left, in the center, or to the right.



x
Theme

The following image shows the Choose a Theme option.

Choose a Theme option

On the Theme menu, you can select from several predefined themes, including a Custom theme. Each theme controls the styling of the banner, the page tabs, the panels, and the styling of the reports.

The default theme is Information Builders.



x
Security

The Security button launches the Security Rules dialog box, which enables you to specify an audience for the portal and add other designers.

The following image shows the Security Rules dialog box.

Security Rules dialog box

There are four permission sets for portals:

  • BIPCreatePortal. Allows you to create a portal.
  • BIPFullControl. Gives you design access and personalization features on a portal.
  • BIPViewAndCustomize. Provides access to run-time mode only. It saves the position of any content that you rearrange and lets you add new content to your copy of the portal.
  • BIPViewOnly. Does not save anything that you do in run-time mode. One use for this operation is anonymous access.


x
Properties

The Properties button makes the current portal the selected object. It also sets the Properties panel at the bottom of the Portal Designer window so that it applies to the current portal. The Properties button is shown in the following image.

Properties Button



x
Page & Banner Group

The Page & Banner group has a single Layout button. The following image shows the Choose a Layout option.

By default, all banner areas and pages are single area (free-form) layouts. You can use the Layout option to change to a column-based layout or to a fluid layout. In a column-based layout, dragging a panel results in a drop indicator, showing where the panel goes. In a fluid layout, the content automatically fills the page area in equal proportions. You can manually rearrange and nest these elements on the page. The display area changes its size depending on your browser dimensions. A page can have one of the following layouts:

When you choose any option other than Single Area, items snap to place within the area.


Top of page

x
Insert Tab

The following image shows the Insert tab.

The Insert tab is used to insert three types of items:


Top of page

x
Style Tab

In this section:

The following image shows the Style tab.

Style tab

The Style tab is divided into four groups:



x
State

The following image shows the Select State to Style option.

Select State to Style option

From the State group, you choose which of the available states you are styling for an object. The state options are:



x
Background

You can use an image, a color, or a combination of options when styling the background of an object.



x
Image

The Image button is a split button. Clicking the left side of the button launches an Open dialog box. Clicking the right side of the button displays the Background Image Options. The Background Image Options are as follows.

Background Image Options menu

Click Change Image to launch an Open dialog box, as shown here. This is the same as clicking the left side of the split button.

Open dialog box

From this dialog box, select an existing image in the WebFOCUS Repository to use as the background, and click Open.

To add a new image, use the WebFOCUS Resource Tree, and right-click the folder that you wish to place the new image in. Select Upload, Image.



x
Repeat

The following image shows the Select Background Repeat option.

Select Background Repeat option

The Select Background Repeat menu enables you to choose whether or not to repeat the background. The options are:

  • None. Displays the background image only once.
  • Everywhere. Repeats the background image horizontally and vertically. This is the default value.
  • Horizontally. Repeats the background image horizontally.
  • Vertically. Repeats the background image vertically.


x
Position

The following image shows the Select Background Position option.

Select Background Position option

If you do not choose to repeat the image everywhere, you can select a background position using a visual menu, as shown. For example, you can position the background image at the bottom of the window, on the right. This feature is similar to Menu Bar positioning.

The default background position is top left.



x
Background Color

The color picker icon Color Picker Icon launches the color selection dialog box for setting a page background color. The same icon is used in the Border and Font groups to set the border and font colors, respectively.



x
Reset Background

The reset background icon Reset Background Icon in the Background group resets the background styling to the theme settings for the currently selected state. The same icon is used in the Border and Font groups to reset those groups.



x
Border

In addition to color and reset, the Border group has style and width controls.



x
Style

The following image shows the Select Border Style option.

Select Border Style option

The Select Border Style menu is a visual menu that enables you to choose one of nine border styles. In the order of left to right (by row), the styles are:

  • None (This is the default border style.)
  • Solid
  • Dotted
  • Dashed
  • Double
  • Groove
  • Ridge
  • Outset
  • Inset


x
Width

The Width control sets the border thickness in pixels (px). If the style is set to none (the default for most objects), the Width control has no effect.



x
Color

The color picker icon Color Picker Icon launches the color selection dialog box for setting the Border color.



x
Reset Border

The reset border icon Reset Background Icon in the Border group resets the border styling to the theme settings for the currently selected state.



x
Font

The Font group enables you to set:

In addition, the Font group contains:



x
Color

The color picker icon Color Picker Icon launches the color selection dialog box for setting the Font color.



x
Reset Font

The reset border icon Reset Background Icon in the Font group resets the Font styling to the theme settings for the currently selected state.


WebFOCUS