Edit Full Webtop Text v15.1.4

[The-messenger]

I'm creating APM policies for v15, using the Modern option. So far looks good but I need to edit text to show our organization. How do I edit the "Welcome to F5 Networks" text at the top of the Webtop page?

[The-messenger]

Found it. Select General Customization, Select the Text option. Find the Webtop profile, select Full Webtop Settings and Webtop Header Message.

[Niels_van_Sluis]

It's also possible to change the text with use of javascript. In the Advanced Customization settings, navigate to the webtop and add the code below to the user-webtop.js file. This example may help others when making changes to parts that can't be found in the General Customization settings.

define(["require", "exports", "tslib", "module", "apmui/page/webtop/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/webtop/View': module.id,
            },
        },
    });
    /* Replacement View component */
    var CustomWebtopView = /** @class */ (function (_super) {
        tslib_1.__extends(CustomWebtopView, _super);
        function CustomWebtopView() {
            return _super !== null && _super.apply(this, arguments) || this;
        }
        CustomWebtopView.prototype.componentDidMount = function () {
            var header = document.getElementsByClassName('apmui-header')[0];
            var span = header.getElementsByTagName("SPAN")[0];
            
            span.style.visibility = 'hidden';
        };
        
        CustomWebtopView.prototype.componentDidUpdate = function () {
 
            var header = document.getElementsByClassName('apmui-header')[0];
            var span = header.getElementsByTagName("SPAN")[0];
            span.innerHTML = "My Cool Company";
            
            span.style.visibility = 'visible';
 
        };
        return CustomWebtopView;
    }(View_1.default));
    exports.default = CustomWebtopView;
});

[The-messenger]

Thanks. The entire code above is added? Currently I see no code when I select the .js file. In previous version, I could see the default code and edit it.

So to be clear, with default settings, viewing the viewer-webtop.js file, it will be blank?

Only added/custom code is seen when viewing the vewer-webtop.js file ?

*For the message box, wouldn't we edit user-message.js?

[Niels_van_Sluis]

Yes, by default all the user js and css files are empty. And yes, these files are per section (webtop, messagebox, logon) and are only triggered in the releated parts of the APM user interface.

[The-messenger]

Thanks! Much appreciated here. So, to see what I would be working with, I pasted your code under the .js file, in the Advanced Customization area for the message box. I didn't see any change in the message box for that policy. Is there something I missed, that is required to enable the customization?

[Niels_van_Sluis]

I'm no expert on this subject, but you'll need to change the 'apmui/page/webtop/View' to 'apmui/page/messageBox/View' to get it working. There isn't much documentation on this subject. I'm using developer mode in Chrome to locate the path.