With advanced customization, it is possible to change almost anything with a certain knowledge of HTML, CSS, and JavaScript. UI templates, which consist of HTML and PHP files, and CSS files, are available for edit directly from the Advanced Customization view.
Customization variables are special symbols, such as %[variable_name], in a UI template. A customization variable is a placeholder for actual customization and localization values. When a UI page is generated from a UI template, customization variables are replaced with actual values.
Customization uses PHP code inside UI templates.
In the hierarchy of the advanced customization user interface, all CSS code is located under apm_mobile.css and apm_full.css. When displaying generated UI pages, APM picks the correct .css file for the client (mobile browser, full browser, BIG-IP® Edge Client®).
. The folder contains various versions of the Access Policy Manager® (APM®) CSS code with names such asIf you create a UI template that partially or completely replaces the default structure provided by F5®, F5 recommends that you do not change existing CSS definitions but add your own with different names (IDs). Otherwise, you run the risk that other non-customized pages will be misrendered.
With advanced customization, you can partially or completely replace the default structure for pages. To avoid unexpected problems however, follow these recommendations when editing .css and .inc files.
You can customize the following files for access profiles in the Advanced Customization view.
Name | Description |
---|---|
apm_full.css | File that contains all CSS for desktop browsers; also contains this PHP:
|
apm_mobile.css | File that contains all CSS for mobile browsers. If you want mobile pages to look exactly the same as full browser pages, you can replace the contents of apm_mobile.css contents with the contents of apm_full.css. |
footer.inc | The include file that specifies the footer text line. |
apm_edge.css | File contains all CSS for BIG-IP®
Edge Client® pages.
Important: F5® recommends that you do not edit this file.
|
javascript_disabled.inc | File that is included with every page and displayed only when the browser does not support JavaScript. |
header.inc | File that specifies the page header content for access profile pages on all
devices. The file includes this PHP:
|
apm_mobile_ppc.css | Styles for old Windows mobile device. |
You can customize the following files for access profiles in the Advanced Customization view.
Name | Description |
---|---|
my.acl.inc | ACL denied page if user tries to access prohibited URL. |
urlfilter_blocked.inc | Secure Web Gateway (SWG) access denied page if user tries to access prohibited URL. |
access_notfound.inc | The HTML, JavaScript, and PHP code that presents a page when access is not granted. |
logout.inc | Default logout page. |
You can customize the following files for access profiles in the Advanced Customization view.
Name | Description |
---|---|
logon.inc | Customization of logon page. |
http_401.inc | Customization of HTTP 401 error (unauthorized) page. |
view.inc | Customization of VMware View logon page. |
You can customize the following files for access profiles in the Advanced Customization view.
Name | Description |
---|---|
decision_box.inc | Specifies the layout for the HTML that appears in a decision box. |
You can customize the following files for access profiles in the Advanced Customization view.
Name | Description |
---|---|
message_box.inc | Specifies the layout for the HTML that appears in a message box. |
You can customize the following files for access profiles in the Advanced Customization view.
Name | Description |
---|---|
my.acl.inc | ACL denied page if user tries to access prohibited URL. |
urlfilter_blocked.inc | Secure Web Gateway (SWG) access denied page if user tries to access prohibited URL. |
access_notfound.inc | The HTML, JavaScript, and PHP code that presents a page when access is not granted. |
logout.inc | Default logout page. |
You can customize the following files for webtops in the Advanced Customization view.
Name | Description |
---|---|
hometab.inc | Not applicable; file pop up. |
webtop_popup.css | Pop up file CSS. |
webtop_help.inc | Help file for webtop. |
desktopClass.js.inc | Main JavaScript file for webtop. |
In the General Customization view, each access profile, access profile page, and webtop includes an Advanced Customization Images setting. The setting provides storage for up to ten images that are then available for use in the Advanced Customization view. An image specified in the setting is managed with the parent object; it is exported, imported, copied, or deleted along with the parent object. It persists with the parent object through backup and upgrade procedures. An image is specified as a name-value pair.
Advanced Customization Images settings for some customization objects
You can think of the Advanced Customization Images settings as libraries of images. Each library has a scope: the object that manages the library can always use images from it; sometimes child objects can also use images from the library of a parent object. Advanced Customization Images settings offer a lot of flexibility. When deciding where to store images, consider how much flexibility you need and whether using images from a parent object library provides adequate control.
Sample custom image
Default message page
Customized message page with image
In this example, a custom image is stored in the Advanced Customization Images settings for an access profile. Then, the value of the image is used in advanced customization of the access profile page header. The header displays on all access policy pages, including the logon page. Then, the value of the image is used in additional advanced customization of the access policy logon page.
Sample custom image
Logon page with customized page header
Logon page with custom image after the form