APM Modern Customization - modify Header in user-common.js and form in user-logon.js
Hi! I try to customize the modern logon pages and as I have multiple pages so I want to modify the header section in the user-common.js and the single logon pages in the user-logon.js files. I somehow cannot make it work, currently only the header from user-common.js gets rendered but not the user-logon.js. It seems to me that they interfere with each other the way that I try to do that. user-common.js: define(['require', 'exports', 'tslib', 'module', 'apmui/page/logon/View'], function ( require, exports, tslib_1, module, View_1 ) { 'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); requirejs.config({ map: { 'apmui/master/View': { 'apmui/page/logon/View': module.id, }, }, }); /* Replacement View component */ var CustomLogonView = /** @class */ (function (_super) { tslib_1.__extends(CustomLogonView, _super); function CustomLogonView() { return (_super !== null && _super.apply(this, arguments)) || this; } CustomLogonView.prototype.componentDidMount = function () { _super.prototype.componentDidMount.call(this); var header = document.getElementsByClassName('apmui-header')[0]; header.classList.add( 'header', 'sticky', 'top-0', 'left-0', 'z-10', 'w-full', 'box-border', 'flex', 'items-center', 'justify-center', 'text-sm', 'border-b', 'border-b-gray-300', 'dark:border-b-neutral-700' ); header.innerHTML = '<div class="flex flex-col w-full max-w-7xl p-4 gap-4 justify-between"><div class="flex flex-col w-full gap-2 overflow-hidden"><div class="flex flex-row w-full gap-8 select-none"><a class="h-14 pointer-events-none flex flex-shrink-0 place-items-center gap-4 p-8 lg:pointer-events-auto lg:p-0" href="/"><img alt="" loading="lazy" width="185" height="56" decoding="async" data-nimg="1" src="images/logo.svg" style="color: transparent;"></a><span class="flex flex-col flex-grow justify-center text-primary text-3xl font-semibold">PAGE HEADER</span></div></div></div>'; }; return CustomLogonView; })(View_1.default); exports.default = CustomLogonView; }); user-logon.js: define(['require', 'exports', 'tslib', 'module', 'apmui/page/logon/View'], function ( require, exports, tslib_1, module, View_1 ) { 'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); requirejs.config({ map: { 'apmui/master/View': { 'apmui/page/logon/View': module.id, }, }, }); /* Replacement View component */ var CustomLogonView = /** @class */ (function (_super) { tslib_1.__extends(CustomLogonView, _super); function CustomLogonView() { return (_super !== null && _super.apply(this, arguments)) || this; } CustomLogonView.prototype.componentDidMount = function () { _super.prototype.componentDidMount.call(this); var content = document.getElementsByClassName('apmui-content')[0]; var content = document.createElement('div'); content.style.cssText = 'max-width: 400px; width: 100%; padding-top: 20px;'; content.innerHTML = "<p>Please register <a href='/register.php'>here</a> if you don't have an account yet.</p>"; }; return CustomLogonView; })(View_1.default); exports.default = CustomLogonView; }); How can I then modify only the header (or footer) via the user-common.js and the logon page content via user-logon.js files? I'm thankful for any advice :) Greetings, Eric
APM Page Customizations - Need request resource
I'm trying to customize the APM my.acl.inc page on one of my policies (from the GUI: Access Policy >> Customization >> Advanced | Edit Mode: Advanced ). Since the normal page just says "Access was denied by an access control list", I don't always know where the user was trying to go when they got that message. Anyone know of a way that I could add a value to the customization page to include the requested resource on that page?Customizng APM Logon page - change heard format
I am trying to locate where the setting is in APM customization that controls the page header format. Specifcially I want to know how to remove\replace the hashing\stripping effect in the logon page header with just a solid color. This is on v11.5 Thanks MikePHP and session variable substitution
I want to evaluate the content of a session variable during logon page processing. session.server.landinguri=/?pw=0 This doesn't work $landingUri = '%{session.server.landinguri}'; $pos = strpos($landingUri, 'pw'); if ($pos !== false) { ?> true This works! $landingUri = '/?pw=0'; $pos = strpos($landingUri, 'pw'); if ($pos !== false) { ?> true Does anyone know how APM and PHP interact that would cause this problem? I assume that there is an issue with how special characters from the session variable are substituted during runtime. I have tried using double quotes with no luck.Customized login page incorrectly replacing F5 variables
I have a customized footer that includes a few JavaScript variables to be used by some custom JS on the front-end, but when the footer.inc is inserted into the page, the code is pretty mangled. I've searched for anyone else mentioning this issue without any success. Here is the footer file: Here is what shows up on the page: Any ideas on what is causing this? Is it my code, or is this something that F5 needs to investigate?
F5 APM Advanced Customization Images
Morning, Apologizes in advance, as I'm new to F5 products. Problem: I am struggling with getting 1 new image to display on the Access Policy Logon page. The goal is not trying to replace the existing header logo image, but rather ADD a new image in the footer. I did the following: * Uploaded gif using the APM "Image Browser" tool * Established link between "image09" and the gif through "Advanced Customization Images" * Edited the Common/footer.inc file to reference the gif: Result: The logon page appears with a box indicating that it sees/recognizes the newly inserted code. But it doesn't show the actual gif. Inspecting the element shows that it inline translated the gif properly to: /public/images/customization/Common/service.name_ap_general_ui/image09_en.gif I tried the same code with the direct reference to the file as well, but it had the same result. I'm stuck and not sure how to fix this. Any suggestions would be welcome.
