Execute Javascript defined in the `Theme Extensions`

OS type and version Ubuntu Linux 22.04.3
Webmin version 2.105
Usermin version 2.005
Virtualmin version 7.9.0
Theme version 21.09.5
Package updates All installed packages are up to date


I have written some javascript code along with some CSS to add a separation bar between the 2 sections of the menu as follows


This code is entered at:

  • Theme Configuration --> Theme Extensions --> Edit extension file: /etc/webmin/authentic-theme/style.css
  • Theme Configuration --> Theme Extensions --> Edit extension file: /etc/webmin/authentic-theme/scripts.js

the issue

When I save the Javscript code using the following buttons the code works fine:
(these buttons are at the bottom of the GUI pages where you edit these files in virtualmin)

But when I just login in to webmin the code does not activate. do I need to wrap my code in a trigger function?

My code


/* Add in a div to allow correct sizing of bar */

// only add the seperator if it dopes not exist
if (document.getElementById("customSectionSeparator") == null)
	// Get the container
	let container = document.getElementById("webmin_search_form").parentElement;

	// Build the code
	let myCreatedElement = document.createElement("div");

	// Insert the code
	container.insertBefore(myCreatedElement, container.firstChild);


/* Day Mode - Put White line between sections and a gap */
#customSectionSeparator {
	width: 50%;
    margin-left: 25%;
    border-top: 2px solid #f5f0fffa !important;
    margin-top: 30px !important;
    padding-top: 30px !important;

/* Day Mode - Put full box around search input */
#webmin_search_form>div.form-group .form-control.sidebar-search {
	border: 1px solid #ffffff29 !important;

Authentic theme supports JQuery so it was very easy to add using:

$(document).ready(function() {

However I cannot get the modifications to stay consistenly when swapping between webmin and virtualmin tabs. Because the of how the single page is rebuilt i cant find the javascript or JQuery triggers I need to use.


So I had to use

setTimeout(addCustomSectionSeparator, 500);
1 Like

This topic was automatically closed 8 days after the last reply. New replies are no longer allowed.