F5 Logo MyF5
Search
  1. MyF5 Home
  2. Knowledge Centers
  3. BIG-IP APM
  4. BIG-IP Access Policy Manager: Customization
  5. Personalizing Access Profile Appearance Settings
Manual Chapter : Personalizing Access Profile Appearance Settings

Applies To:

Show Versions Show Versions

BIG-IP APM

  • 13.1.5, 13.1.4, 13.1.3, 13.1.1, 13.1.0
Manual Chapter
Table of Contents | << Previous Chapter | Next Chapter >>

What is access profile personalization?

With full and mobile browser customization, you can change the appearance, text, and messages of all pages that a browser views, either from the BIG-IP® Edge Client® by directly logging in through a web browser, or on a mobile device. Some settings that are specific to the BIG-IP Edge Client software are customized separately in the BIG-IP Edge Client customization view.

Personalizing page appearance for common access profile settings

Personalize access profile login pages to change the front image and advanced customization images for the login page in a specific access policy.
  1. On the Main tab, click Access > Profiles / Policies > Customization > General .
    The Customization tool appears in General Customization view, displaying Form Factor: Full/Mobile Browser settings.
  2. To configure common settings, click Customization Settings > Access Profiles > access_profile_name > Common .
  3. Customize the settings for each individual element by clicking the element and changing the displayed settings.
  4. After you customize settings, click the Save icon at the top of the Customization tool.
The access policy login page reflects your changes.

Previewing customization changes

You must have customized an element with the Customization tool to see a preview of your changes.
After you customize and save an element with the Customization tool, you can preview the changes you have made in the Preview window. The Preview window opens a separate browser window, and shows a live update of changes as you save them.
  1. On the Main tab, click Access > Profiles / Policies > Customization > General .
    The Customization tool appears in General Customization view, displaying Form Factor: Full/Mobile Browser settings.
  2. On the menu bar, at right, click the Preview button.
  3. Navigate to a page to view customizations.
    For example, to navigate to a logon page and view the results of access profile branding customization, in the Preview window expand Customization Settings > Access Profiles > access_profile_name > Access Policy > Logon Pages , then click logon_page_name .
The Preview window shows the results of any customization changes.

General page style settings for access profiles

You can customize the following settings for general page style with the Customization tool.

Name Value Description
Page alignment Left, Center, or Right. Indicates the general HTML page alignment for all pages displayed by the access profile.
Page background color A hex color code, for example, #123ABC. When you click the color value, two color choosers appear. One allows you to select a color from 40 common color blocks, and the other allows you to select any HTML color from a more sophisticated color wheel. You can also type the color value in as text. Indicates the color for the general page background for all pages displayed by the access profile.
Page width (px or %) A specific pixel value, for example 800px, or a percentage, for example 80%. Specifies the width of the content on all HTML pages displayed by the access profile, as an absolute pixel value or as a percentage of the entire browser screen.

Font settings for access profiles

You can customize the following settings for general page style with the Customization tool.

Setting Value Description
Font family (comma-separated) Font names or font-family names, space-separated, for example Calibri, Tahoma, Verdana, Arial, Helvetica, Sans-Serif. Specifies the base font used by pages displayed by the access profile.
Headline font size (px) A pixel value, for example 18px. Indicates the pixel size for heading items on pages displayed by the access profile.
Text font size (px) A pixel value, for example 14px. Indicates the pixel size for text items on pages displayed by the access profile.

Page header settings for access profiles

You can customize the following settings for the page header style with the Customization tool.

Setting Value Description
Disconnect icon An image icon 48 x 48 pixels or smaller. Specifies the icon image displayed in the browser when the page is disconnected.
Header background color A hex color code, for example, #123ABC. When you click the color value, two color choosers appear. One allows you to select a color from 40 common color blocks, and the other allows you to select any HTML color from a more sophisticated color wheel. You can also type the color value in as text. Indicates the background color for HTML header elements for the web pages served to web and mobile clients.
Header left image (Full Size) An image name. This is a larger image up to 80 x 80 pixels, for display on web pages. The header image for web pages. To replace this image, type the relative path, or click the preview icon to the right of the filename, and click Replace.
Header left image (Mobile Devices Size) An image name. This is a smaller image up to 32 x 32 pixels, for display on mobile devices. The header image for mobile device pages. To replace this image, type the relative path, or click the preview icon to the right of the filename, and click Replace.

Page footer settings for access profiles

You can customize the following settings for the page footer style with the Customization tool.

Name Value Description
Footer font size (px) A font size, in pixels, for example 12px. Specifies the font size for text in web page footers.

Layout settings for access profiles

You can customize the following settings for page layouts with the Customization tool.

Name Value Description
Form cell width (px or %) Width, in pixels or percentage, of the main login page form, for example 240px, or 50%. Specifies the width of the login page form in pixels or as a percentage of the frame.
Image cell width (px or %) Width, in pixels or percentage, of the main login page image cell width, for example 240px, or 50%. Specifies the width of the login page image area in pixels or as a percentage of the frame.
Main table background color A hex color code, for example, #123ABC. When you click the color value, two color choosers appear. One allows you to select a color from 40 common color blocks, and the other allows you to select any HTML color from a more sophisticated color wheel. You can also type the color value in as text. Indicates the background color for the login page main frame.
Page layout Form left, form center, or form right. Indicates the placement of the login page form on the main access policy page.

Image settings for access profiles

You can customize the following settings for the main page image with the Customization tool.

Name Value Description
Default image Width, in pixels or percentage, of the main login page form, for example 240px, or 50%. Specifies the width of the login page form in pixels or as a percentage of the frame.
Image left margin (px) Left side margin, in pixels, of the main login page image, for example 24px. Specifies the left margin of the login page image.
Image right margin (px) Right side margin, in pixels, of the main login page image, for example 24px. Specifies the right margin of the login page image.
Image top margin (px) Top-edge margin, in pixels, of the main login page image, for example 24px. Specifies the top margin of the login page image.
Side image alignment Center, left, or right. Specifies the alignment of the image within the side frame.

Form settings for access profiles

You can customize the following settings for the login form with the Customization tool.

Setting Value Description
Form alignment Center, Left, or Right. Specifies the alignment of the form within the form frame.
Form background color A hex color code, for example, #123ABC. When you click the color value, two color choosers appear. One allows you to select a color from 40 common color blocks, and the other allows you to select any HTML color from a more sophisticated color wheel. You can also type the color value in as text. Indicates the background color for the login page form.
Form height (px, %, or auto) Height value in pixels, as a percentage of the frame, or auto, for example 240px, 40%, or auto. Specifies the height of the login form in the login frame.
Form left margin (px) Left margin, in pixels, of the main login page form, for example 24px. Specifies the left margin of the login form.
Form right margin (px) Right margin, in pixels, of the main login page form, for example 24px. Specifies the right margin of the login form.
Form top margin (px) Top margin, in pixels, of the main login page form, for example 24px. Specifies the top margin of the login form.
Form width (px or %) Form width in pixels or as a percentage of the form frame, for example 250px or 50%. Specifies the login form width within the login frame.

Form element settings for access profiles

You can customize the following settings for the appearance of elements in the login form with the Customization tool.

Name Value Description
Field alignment Center, Left, or Right. Specifies how fields align in the login form.
Field width (%) A percentage value, for example 67%. Specifies the width of fields in the login form, as a percentage of the total size of the login form.
Header alignment Left, center, or right. Specifies the alignment of header elements in the login form.
Label alignment Left, center, or right. Specifies the alignment of form field labels in the login form.
Label position Left or above. Specifies whether login form field labels are above or to the left of their respective fields.
Label width (%) A percentage value, for example 67%. Specifies the width of field labels in the login form.

Advanced customization image settings

You set advanced customization images to make images you add through the image browser available to your advanced customization pages.

The Advanced Customization Images properties pages allow you to set advanced customization images from the image browser to associate with advanced customization image names. You can then use the image name to add an image to an advanced customization page.

To select an image from the image browser to associate with an image for advanced customization, click the button next to the current (or default) image name, and select Replace.

Personalizing page appearance for access profile logout settings

Personalize access profile logout settings to add advanced customization image support to logout pages in the access profile.
  1. On the Main tab, click Access > Profiles / Policies > Customization > Advanced .
    The Customization tool appears in Advanced Customization view, displaying the Form Factor: Full/Mobile Browser settings in the left pane.
  2. To configure logout settings, in the left pane, expand the folders and navigate to Customization Settings > Access Profiles > access_profile_name > Logout .
  3. Customize the settings for advanced customization images.
  4. After you customize settings, click the Save icon at the top of the Customization tool.
The access policy advanced customization page reflects your changes.

Advanced customization image settings

You set advanced customization images to make images you add through the image browser available to your advanced customization pages.

The Advanced Customization Images properties pages allow you to set advanced customization images from the image browser to associate with advanced customization image names. You can then use the image name to add an image to an advanced customization page.

To select an image from the image browser to associate with an image for advanced customization, click the button next to the current (or default) image name, and select Replace.

Personalizing page appearance for access policy pages

Personalize access policy pages to change advanced customization images for the login page in a specific access policy, and to add advanced customization images for other access policy pages.
  1. On the Main tab, click Access > Profiles / Policies > Customization > Advanced .
    The Customization tool appears in Advanced Customization view, displaying the Form Factor: Full/Mobile Browser settings in the left pane.
  2. On the Branding tab, click Customization Settings > Access Profiles > access_profile_name > Access Policy , and select the folder for the item to customize.
  3. Customize the settings for each individual element by clicking the element and changing the displayed settings.
  4. After you customize settings, click the Save icon at the top of the Customization tool.
The access policy pages reflect your changes.

Customization settings for access policy items

You can personalize the following settings for pages exposed to the user in an access policy.

Setting Value Description
General > Front image Image The image that appears in the image frame of the login page for an access policy.
Advanced Customization Images Images Each Advanced Customization Images properties page allows you to set advanced customization images from the image browser to associate with advanced customization image names. Each access policy item has a page for advanced customization images. You can use these image names to add an image to a page using advanced customization. To select an image from the image browser to associate with an image for advanced customization, click the button next to the current (or default) image name, and select Replace.

Localizing messages for BIG-IP Edge Client

Configure localization for BIG-IP® Edge Client® to change the messages and text in the BIG-IP Edge Client application.
  1. On the Main tab, click Access > Profiles / Policies > Customization > General .
    The Customization tool appears in General Customization view, displaying Form Factor: Full/Mobile Browser settings.
  2. From the Form Factor list at the top of the Customization tool, select BIG-IP Edge Client.
  3. To select the BIG-IP Edge Client, in the left pane, expand the folders and navigate to Customization Settings > Connectivity Profiles > name_of_connectivity_profile , and click BIG-IP Edge Client.
  4. At the top right of the Customization settings pane, select the Language for which to customize localization messages for the BIG-IP Edge Client.
  5. Customize the settings for BIG-IP Edge Client localization.
  6. After you customize settings, click the Save icon at the top of the Customization tool.

Previewing customization changes

You must have customized an element with the Customization tool to see a preview of your changes.
After you customize and save an element with the Customization tool, you can preview the changes you have made in the Preview window. The Preview window opens a separate browser window, and shows a live update of changes as you save them.
  1. On the Main tab, click Access > Profiles / Policies > Customization > General .
    The Customization tool appears in General Customization view, displaying Form Factor: Full/Mobile Browser settings.
  2. On the menu bar, at right, click the Preview button.
  3. Navigate to a page to view customizations.
    For example, to navigate to a logon page and view the results of access profile branding customization, in the Preview window expand Customization Settings > Access Profiles > access_profile_name > Access Policy > Logon Pages , then click logon_page_name .
The Preview window shows the results of any customization changes.

Customization settings for BIG-IP Edge Client localization

You can customize the following settings for BIG-IP® Edge Client® customization with the Customization tool.

Setting Value Description
About link A URL The text that appears as a link in the about area of the BIG-IP Edge Client.
About text Text Text, typically copyright info or some other identifying information, that appears in the about area of the BIG-IP Edge Client.
Application Name Text The application name, which appears in the status bar of the application.
Table of Contents | << Previous Chapter | Next Chapter >>
Contact Support Contact Support

Have a Question?

Support and Sales >

About F5

Education

F5 Sites

Support Tasks




©2023 F5 Networks, Inc. All rights reserved.


Trademarks Policies Privacy California Privacy Do Not Sell My Personal Information