bookmark_count.uc.js funktioniert im Nightly nicht mehr.

FuchsFan

Zitat von Endor

Sobald der Text des Ordners länger ist wird er überlagert.

Das wird wohl nur funktionieren, wenn die Breite der Popup-Menüs angepasst wird. Bei mir kein Problem, weil das schon immer so war. Ich habe mal auszugsweise nur den Teil für die Bookmarks genommen, und ihn so angepasst, dass beide Scripte zusammen funktionieren. Teste es mal bei dir, wobei der Code aber auch für den Einsatz von Icons vorbereitet ist.

CSS

@-moz-document url(chrome://browser/content/browser.xhtml) {

:root {
    --arrowpanel-border-radius: 0px !important;
}

:is(menupopup, panel)[type="arrow"] {
    --panel-border-radius: 0px !important;
}

/* Popup-Menüs (äußerer Rahmen) / außer Lesezeichen und Urlbar Suche */
menupopup {
    appearance: none!important;	
	background: #00d4ff !important;
    border: 3px solid 	#0070ff !important; /* Umrandung/Farbe */
    padding: 5px 5px 5px 5px !important; /* Ausrichtung */
    font-size: 9pt !important; /* Schriftgröße */
    border-radius: 0px !important;
	--border-radius: 0px !important;	
}

/* Popup-Menüs (inneres Panel) / außer Lesezeichen */
arrowscrollbox:not(#tabbrowser-arrowscrollbox), menupopup, popup {
    appearance: none!important;
    min-width: 400px !important; /* vorgegebene Breite der Popup-Fenster */
    --panel-background: #ffd700 !important;
    --panel-border-color: magenta !important;  
    --panel-border-radius: 0px !important;
    padding: 5px 5px 5px 5px !important;	
} 
arrowscrollbox:not(menupopup){
	border-radius: 6px !important;
}

/* für alle Bookmark-Item */
#PlacesToolbarItems toolbarbutton.bookmark-item menupopup.toolbar-menupopup menu.menu-iconic.bookmark-item,
#PlacesToolbarItems toolbarbutton.bookmark-item menupopup.toolbar-menupopup menuitem.menuitem-iconic.bookmark-item,
#bookmarksMenuPopup .menu-iconic.bookmark-item,
#bookmarksMenuPopup menuitem {
    width: 100% !important;
    max-width: 400px !important;
    min-width: 0 !important;
    background-color: white !important;
    min-height: 24px;
    padding: 0 0 0 40px !important;
    margin: 0.5px !important;
    border-width: thin !important;
    border: 1px solid #a6a6a6;
    border-radius: 4px !important;
    background-repeat: no-repeat !important;
    background-position: 10px 3px;
    background-size: 15px 15px !important;
}

/* aktive Menüeinträge bei hover */
menupopup :is(menu, menuitem):hover {
  background-color: #ccf5ff !important;
}

/* die inaktiven Menüeinträge bei hover grau */ 
menupopup :is(menu[disabled="true"], menuitem[disabled="true"]):hover {
  background-color: #cccccc !important;
}
}

Alles anzeigen

FuchsFan

Eine andere Möglichkeit wäre die Einstellung der Breite direkt im Script, was in Zeile 16 (eingestellt sind 400px) erfolgen kann.

Dann teste bitte mal:

JavaScript

// ==UserScript==
// @name            BMMultiColumn.uc.js
// @description     Lesezeichenmenü automatisch in Spalten anzeigen (mit manueller Breiteneinstellung für Items).
// @author          Ryan, ding, angepasst für manuelle Breite
// @include         main
// @charset         UTF-8
// @version         2026.08.20
// @compatibility   Firefox 153
// @async
// @shutdown        window.BMMultiColumn.destroy();
// @homepageURL     https://github.com/benzBrake/FirefoxCustomize/blob/master/userChromeJS
// @note            2026.08.20 Manuelle Breiteneinstellung für Menü-Items hinzugefügt
// ==/UserScript==

// --- BENUTZEREINSTELLUNG: Hier die gewünschte Breite für alle Menü-Items in Pixel eintragen ---
const USER_MENU_ITEM_WIDTH = 400; // Standard: 400px - einfach diesen Wert ändern!

location.href.startsWith("chrome://browser/content/browser.x") && (function (css) {
    function uninitBMMultiColumn(instance) {
        for (let i = 0; i < instance.menupopup.length; i++) {
            clearInterval(instance.timer[i]);
            instance.timer[i] = null;
            const menupopup = document.getElementById(instance.menupopup[i]);
            if (!menupopup) continue;
            instance.resetPopup(menupopup);
            menupopup.removeEventListener('popupshowing', instance, false);
            menupopup.removeEventListener('DOMMenuItemActive', instance, false);
        }
    }

    function hasOtherBMMultiColumnWindow() {
        const windows = Services.wm.getEnumerator("navigator:browser");
        while (windows.hasMoreElements()) {
            const win = windows.getNext();
            if (win !== window && win.BMMultiColumn && !win.BMMultiColumn._destroyed) {
                return true;
            }
        }
        return false;
    }

    function destroyBMMultiColumn(instance) {
        if (!instance || instance._destroyed) return;
        instance._destroyed = true;
        window.removeEventListener('unload', instance, false);
        window.removeEventListener("aftercustomization", instance, false);
        if (window.BMMultiColumn === instance) {
            delete window.BMMultiColumn;
        }
        uninitBMMultiColumn(instance);
        if (!hasOtherBMMultiColumnWindow()
            && instance.style
            && instance.sss.sheetRegistered(instance.style, instance.sss.AUTHOR_SHEET)) {
            instance.sss.unregisterSheet(instance.style, instance.sss.AUTHOR_SHEET);
        }
        instance.style = null;
    }

    destroyBMMultiColumn(window.BMMultiColumn);

    window.BMMultiColumn = {
        _destroyed: false,
        menupopup: ["historyMenuPopup", "bookmarksMenuPopup", 'PlacesToolbar', 'BMB_bookmarksPopup'],
        timer: [],
        count: [],
        sss: Cc['@mozilla.org/content/style-sheet-service;1'].getService(Ci.nsIStyleSheetService),
        init: function() {
            this.style = makeURI('data:text/css;charset=UTF-8,' + encodeURIComponent(css));
            if (!this.sss.sheetRegistered(this.style, this.sss.AUTHOR_SHEET)) {
                this.sss.loadAndRegisterSheet(this.style, this.sss.AUTHOR_SHEET);
            }
            window.removeEventListener("load", this, false);
            window.addEventListener('unload', this, false);
            window.addEventListener("aftercustomization", this, false);
            this.delayedStartup();
        },
        delayedStartup: function() {
            if (this._destroyed) return;
            for (var i = 0; i < this.menupopup.length; i++) {
                clearInterval(this.timer[i]);
                this.count[i] = 0;
                this.timer[i] = setInterval(function(self, i) {
                    if (self._destroyed || ++self.count[i] > 50 || document.getElementById(self.menupopup[i])) {
                        clearInterval(self.timer[i]);
                        var menupopup = document.getElementById(self.menupopup[i]);
                        if (!self._destroyed && menupopup) {
                            menupopup.addEventListener('popupshowing', self, false);
                            menupopup.addEventListener('DOMMenuItemActive', self, false);
                        }
                    }
                }, 250, this, i);
            }
        },
        uninit: function() {
            uninitBMMultiColumn(this);
        },
        destroy() {
            destroyBMMultiColumn(this);
        },
        hasOtherActiveWindow() {
            return hasOtherBMMultiColumnWindow();
        },
        handleEvent(event) {
            if (this._destroyed) return;
            switch (event.type) {
                case 'popupshowing':
                    let menupopup;
                    if (event.target.tagName == 'menu' || event.target.tagName == 'toolbarbutton') {
                        menupopup = event.target.menupopup;
                    } else if (event.target.tagName == 'menupopup') {
                        menupopup = event.target;
                    } else return;
                    this.initHorizontalScroll(event);
                    if (menupopup.id === "PlacesChevronPopup") {
                        setTimeout(_ => {
                            if (!this._destroyed) {
                                this.initMultiColumn(menupopup, event);
                            }
                        }, 10);
                    } else {
                        this.initMultiColumn(menupopup, event);
                    }
                    break;
                case 'aftercustomization':
                    setTimeout(() => this.delayedStartup(), 0);
                    break;
                case 'unload':
                    this.destroy();
                    break;
            }
        },
        initHorizontalScroll(event) {
            let scrollBox = event.originalTarget.scrollBox;
            scrollBox.scrollbox.style.setProperty("overflow-y", "auto", "important");
            scrollBox.scrollbox.style.setProperty("margin-top", "0", "important");
            scrollBox.scrollbox.style.setProperty("margin-bottom", "0", "important");
            scrollBox.scrollbox.style.setProperty("padding-top", "0", "important");
            scrollBox.scrollbox.style.setProperty("padding-bottom", "0", "important");

            event.originalTarget.on_DOMMenuItemActive = function(event) {
                let elt = event.target;
                if (elt.parentNode != this) {
                    return;
                }
                if (window.XULBrowserWindow) {
                    let placesNode = elt._placesNode;
                    var linkURI;
                    if (placesNode && PlacesUtils.nodeIsURI(placesNode)) {
                        linkURI = placesNode.uri;
                    } else if (elt.hasAttribute("targetURI")) {
                        linkURI = elt.getAttribute("targetURI");
                    }
                    if (linkURI) {
                        window.XULBrowserWindow.setOverLink(linkURI);
                    }
                }
            }.bind(event.originalTarget);
            scrollBox._scrollButtonUp.style.display = "none";
            scrollBox._scrollButtonDown.style.display = "none";
        },
        initMultiColumn(menupopup) {
            menupopup.style.maxWidth = "calc(100vw - 20px)";
            let arrowscrollbox = menupopup.shadowRoot.querySelector("::part(arrowscrollbox)");
            let scrollbox = arrowscrollbox.shadowRoot.querySelector('[part~=scrollbox]');
            if (scrollbox) {
                Object.assign(scrollbox.style, {
                    minHeight: "21px",
                    height: "auto",
                    display: "flex",
                    flexFlow: "column wrap",
                    width: "unset",
                    scrollSnapType: "x mandatory",
                });
                arrowscrollbox.style.width = "auto";
                arrowscrollbox.style.maxHeight = "calc(100vh - 129px)";
                let slot = scrollbox.querySelector('slot');
                slot.style.display = "contents";

                // --- MANUELLE BREITE: Hier wird die eingestellte Breite verwendet ---
                let columnWidth = USER_MENU_ITEM_WIDTH;

                let maxWidth = calcWidth(-129);
                for (let item = menupopup.firstElementChild; item; item = item.nextElementSibling) {
                    if (!item.matches?.("menu, menuitem, menuseparator")) continue;
                    item.style.setProperty("min-width", "0", "important");
                    item.style.setProperty("max-width", columnWidth + "px", "important");
                    item.style.setProperty("width", columnWidth + "px", "important");
                }
                if (maxWidth < scrollbox.scrollWidth) {
                    scrollbox.style.setProperty("overflow-x", "auto", "important");
                    scrollbox.style.setProperty("width", maxWidth + "px");
                } else {
                    scrollbox.style.setProperty("width", scrollbox.scrollWidth + "px", "important");
                    scrollbox.clientWidth = scrollbox.scrollWidth;
                }
                bindWheelEvent(scrollbox);
            }
            function bindWheelEvent(item) {
                if (item._bmMultiColumnWheelHandler) return;
                const wheelHandler = (e) => {
                    e.preventDefault();
                    const delta = e.deltaY || e.detail || e.wheelDelta;
                    item.scrollLeft += delta * 50;
                };
                item.addEventListener('wheel', wheelHandler, { passive: false });
                item._bmMultiColumnWheelHandler = wheelHandler;
            }
        },
        resetPopup(menupopup) {
            let arrowscrollbox = menupopup?.shadowRoot?.querySelector("::part(arrowscrollbox)");
            if (!arrowscrollbox) return;
            menupopup.style.maxWidth = "";
            arrowscrollbox.style.width = "";
            arrowscrollbox.style.maxHeight = "";
            let scrollbox = arrowscrollbox.shadowRoot.querySelector('[part~=scrollbox]');
            if (!scrollbox) return;
            if (scrollbox._bmMultiColumnWheelHandler) {
                scrollbox.removeEventListener('wheel', scrollbox._bmMultiColumnWheelHandler);
                delete scrollbox._bmMultiColumnWheelHandler;
            }
            let slot = scrollbox.querySelector('slot');
            if (slot) {
                slot.style.display = "";
            }
            Object.assign(scrollbox.style, {
                minHeight: "",
                height: "",
                display: "",
                flexFlow: "",
                overflow: "",
                overflowX: "",
                overflowY: "",
                maxHeight: "",
                width: "",
                scrollSnapType: "",
            });
            let menuitem = menupopup.lastElementChild;
            while (menuitem) {
                menuitem.style.minWidth = "";
                menuitem.style.maxWidth = "";
                menuitem.style.width = "";
                menuitem = menuitem.previousElementSibling;
            }
        }
    };

    function calcWidth(offset) {
        if (typeof offset == 'number') {
            return window.innerWidth + offset;
        } else if (typeof offset == 'string') {
            if (/^-?\d+px$/.test(offset.trim())) {
                return window.innerWidth + parseInt(offset.trim().match(/^-?(\d+)px$/)[1]);
            }
        }
        throw new Error('Invalid offset value');
    }

    window.BMMultiColumn.init();
})(`
#PlacesToolbarItems menupopup {
    max-width: calc(100vw - 20px);
    max-height: calc(100vh - 129px);
}
#PlacesToolbarItems menupopup > * {
    scroll-snap-align: start;
}
`);

Alles anzeigen

Endor

Hallo FuchsFan

Das ist prima. Funktioniert .
Frage:
ließe sich das eventuell auch nur auf Menüleiste - Lesezeichen Popup beschränken?

Wenn nicht dann nehme ich das so.
Vielen vielen Dank für Deine Mühe.
Mfg.
Endor

FuchsFan

Zitat von Endor

ließe sich das eventuell auch nur auf Menüleiste - Lesezeichen Popup beschränken?

Endor

In Zeile 16 und 17 beides getrennt einstellbar, bitte testen.

JavaScript

// ==UserScript==
// @name            BMMultiColumn.uc.js
// @description     Lesezeichenmenü automatisch in Spalten anzeigen (mit manueller Breiteneinstellung für Menü- und Toolbar-Items).
// @author          Ryan, ding, angepasst für manuelle Breite
// @include         main
// @charset         UTF-8
// @version         2026.08.20
// @compatibility   Firefox 153
// @async
// @shutdown        window.BMMultiColumn.destroy();
// @homepageURL     https://github.com/benzBrake/FirefoxCustomize/blob/master/userChromeJS
// @note            2026.08.20 Manuelle Breiteneinstellung für Menü- und Toolbar-Items hinzugefügt
// ==/UserScript==

// --- BENUTZEREINSTELLUNG: Hier die gewünschte Breite für Menü- und Toolbar-Items in Pixel eintragen ---
const USER_MENU_ITEM_WIDTH = 400;   // Breite für Menü-Popups (Lesezeichen, Chronik)
const USER_TOOLBAR_ITEM_WIDTH = 300; // Breite für Toolbar-Popups (Lesezeichenordner in der Personal-Toolbar)

location.href.startsWith("chrome://browser/content/browser.x") && (function (css) {
    function uninitBMMultiColumn(instance) {
        for (let i = 0; i < instance.menupopup.length; i++) {
            clearInterval(instance.timer[i]);
            instance.timer[i] = null;
            const menupopup = document.getElementById(instance.menupopup[i]);
            if (!menupopup) continue;
            instance.resetPopup(menupopup);
            menupopup.removeEventListener('popupshowing', instance, false);
            menupopup.removeEventListener('DOMMenuItemActive', instance, false);
        }
    }

    function hasOtherBMMultiColumnWindow() {
        const windows = Services.wm.getEnumerator("navigator:browser");
        while (windows.hasMoreElements()) {
            const win = windows.getNext();
            if (win !== window && win.BMMultiColumn && !win.BMMultiColumn._destroyed) {
                return true;
            }
        }
        return false;
    }

    function destroyBMMultiColumn(instance) {
        if (!instance || instance._destroyed) return;
        instance._destroyed = true;
        window.removeEventListener('unload', instance, false);
        window.removeEventListener("aftercustomization", instance, false);
        if (window.BMMultiColumn === instance) {
            delete window.BMMultiColumn;
        }
        uninitBMMultiColumn(instance);
        if (!hasOtherBMMultiColumnWindow()
            && instance.style
            && instance.sss.sheetRegistered(instance.style, instance.sss.AUTHOR_SHEET)) {
            instance.sss.unregisterSheet(instance.style, instance.sss.AUTHOR_SHEET);
        }
        instance.style = null;
    }

    destroyBMMultiColumn(window.BMMultiColumn);

    window.BMMultiColumn = {
        _destroyed: false,
        menupopup: ["historyMenuPopup", "bookmarksMenuPopup", 'PlacesToolbar', 'BMB_bookmarksPopup'],
        timer: [],
        count: [],
        sss: Cc['@mozilla.org/content/style-sheet-service;1'].getService(Ci.nsIStyleSheetService),
        init: function() {
            this.style = makeURI('data:text/css;charset=UTF-8,' + encodeURIComponent(css));
            if (!this.sss.sheetRegistered(this.style, this.sss.AUTHOR_SHEET)) {
                this.sss.loadAndRegisterSheet(this.style, this.sss.AUTHOR_SHEET);
            }
            window.removeEventListener("load", this, false);
            window.addEventListener('unload', this, false);
            window.addEventListener("aftercustomization", this, false);
            this.delayedStartup();
        },
        delayedStartup: function() {
            if (this._destroyed) return;
            for (var i = 0; i < this.menupopup.length; i++) {
                clearInterval(this.timer[i]);
                this.count[i] = 0;
                this.timer[i] = setInterval(function(self, i) {
                    if (self._destroyed || ++self.count[i] > 50 || document.getElementById(self.menupopup[i])) {
                        clearInterval(self.timer[i]);
                        var menupopup = document.getElementById(self.menupopup[i]);
                        if (!self._destroyed && menupopup) {
                            menupopup.addEventListener('popupshowing', self, false);
                            menupopup.addEventListener('DOMMenuItemActive', self, false);
                        }
                    }
                }, 250, this, i);
            }
        },
        uninit: function() {
            uninitBMMultiColumn(this);
        },
        destroy() {
            destroyBMMultiColumn(this);
        },
        hasOtherActiveWindow() {
            return hasOtherBMMultiColumnWindow();
        },
        handleEvent(event) {
            if (this._destroyed) return;
            switch (event.type) {
                case 'popupshowing':
                    let menupopup;
                    if (event.target.tagName == 'menu' || event.target.tagName == 'toolbarbutton') {
                        menupopup = event.target.menupopup;
                    } else if (event.target.tagName == 'menupopup') {
                        menupopup = event.target;
                    } else return;
                    this.initHorizontalScroll(event);
                    if (menupopup.id === "PlacesChevronPopup") {
                        setTimeout(_ => {
                            if (!this._destroyed) {
                                this.initMultiColumn(menupopup, event);
                            }
                        }, 10);
                    } else {
                        this.initMultiColumn(menupopup, event);
                    }
                    break;
                case 'aftercustomization':
                    setTimeout(() => this.delayedStartup(), 0);
                    break;
                case 'unload':
                    this.destroy();
                    break;
            }
        },
        initHorizontalScroll(event) {
            let scrollBox = event.originalTarget.scrollBox;
            scrollBox.scrollbox.style.setProperty("overflow-y", "auto", "important");
            scrollBox.scrollbox.style.setProperty("margin-top", "0", "important");
            scrollBox.scrollbox.style.setProperty("margin-bottom", "0", "important");
            scrollBox.scrollbox.style.setProperty("padding-top", "0", "important");
            scrollBox.scrollbox.style.setProperty("padding-bottom", "0", "important");

            event.originalTarget.on_DOMMenuItemActive = function(event) {
                let elt = event.target;
                if (elt.parentNode != this) {
                    return;
                }
                if (window.XULBrowserWindow) {
                    let placesNode = elt._placesNode;
                    var linkURI;
                    if (placesNode && PlacesUtils.nodeIsURI(placesNode)) {
                        linkURI = placesNode.uri;
                    } else if (elt.hasAttribute("targetURI")) {
                        linkURI = elt.getAttribute("targetURI");
                    }
                    if (linkURI) {
                        window.XULBrowserWindow.setOverLink(linkURI);
                    }
                }
            }.bind(event.originalTarget);
            scrollBox._scrollButtonUp.style.display = "none";
            scrollBox._scrollButtonDown.style.display = "none";
        },
        initMultiColumn(menupopup) {
            menupopup.style.maxWidth = "calc(100vw - 20px)";
            let arrowscrollbox = menupopup.shadowRoot.querySelector("::part(arrowscrollbox)");
            let scrollbox = arrowscrollbox.shadowRoot.querySelector('[part~=scrollbox]');
            if (scrollbox) {
                Object.assign(scrollbox.style, {
                    minHeight: "21px",
                    height: "auto",
                    display: "flex",
                    flexFlow: "column wrap",
                    width: "unset",
                    scrollSnapType: "x mandatory",
                });
                arrowscrollbox.style.width = "auto";
                arrowscrollbox.style.maxHeight = "calc(100vh - 129px)";
                let slot = scrollbox.querySelector('slot');
                slot.style.display = "contents";

                // --- MANUELLE BREITE: Unterschiedliche Breite für Menü- und Toolbar-Popups ---
                let columnWidth;
                let isToolbarPopup = false;

                // Prüfe, ob das Popup in der Personal-Toolbar liegt
                let parent = menupopup.parentNode;
                while (parent) {
                    if (parent.id === "PlacesToolbar" || parent.id === "BMB_bookmarksPopup" || parent.id === "PersonalToolbar") {
                        isToolbarPopup = true;
                        break;
                    }
                    parent = parent.parentNode;
                }

                columnWidth = isToolbarPopup ? USER_TOOLBAR_ITEM_WIDTH : USER_MENU_ITEM_WIDTH;

                let maxWidth = calcWidth(-129);
                for (let item = menupopup.firstElementChild; item; item = item.nextElementSibling) {
                    if (!item.matches?.("menu, menuitem, menuseparator")) continue;
                    item.style.setProperty("min-width", "0", "important");
                    item.style.setProperty("max-width", columnWidth + "px", "important");
                    item.style.setProperty("width", columnWidth + "px", "important");
                }
                if (maxWidth < scrollbox.scrollWidth) {
                    scrollbox.style.setProperty("overflow-x", "auto", "important");
                    scrollbox.style.setProperty("width", maxWidth + "px");
                } else {
                    scrollbox.style.setProperty("width", scrollbox.scrollWidth + "px", "important");
                    scrollbox.clientWidth = scrollbox.scrollWidth;
                }
                bindWheelEvent(scrollbox);
            }
            function bindWheelEvent(item) {
                if (item._bmMultiColumnWheelHandler) return;
                const wheelHandler = (e) => {
                    e.preventDefault();
                    const delta = e.deltaY || e.detail || e.wheelDelta;
                    item.scrollLeft += delta * 50;
                };
                item.addEventListener('wheel', wheelHandler, { passive: false });
                item._bmMultiColumnWheelHandler = wheelHandler;
            }
        },
        resetPopup(menupopup) {
            let arrowscrollbox = menupopup?.shadowRoot?.querySelector("::part(arrowscrollbox)");
            if (!arrowscrollbox) return;
            menupopup.style.maxWidth = "";
            arrowscrollbox.style.width = "";
            arrowscrollbox.style.maxHeight = "";
            let scrollbox = arrowscrollbox.shadowRoot.querySelector('[part~=scrollbox]');
            if (!scrollbox) return;
            if (scrollbox._bmMultiColumnWheelHandler) {
                scrollbox.removeEventListener('wheel', scrollbox._bmMultiColumnWheelHandler);
                delete scrollbox._bmMultiColumnWheelHandler;
            }
            let slot = scrollbox.querySelector('slot');
            if (slot) {
                slot.style.display = "";
            }
            Object.assign(scrollbox.style, {
                minHeight: "",
                height: "",
                display: "",
                flexFlow: "",
                overflow: "",
                overflowX: "",
                overflowY: "",
                maxHeight: "",
                width: "",
                scrollSnapType: "",
            });
            let menuitem = menupopup.lastElementChild;
            while (menuitem) {
                menuitem.style.minWidth = "";
                menuitem.style.maxWidth = "";
                menuitem.style.width = "";
                menuitem = menuitem.previousElementSibling;
            }
        }
    };

    function calcWidth(offset) {
        if (typeof offset == 'number') {
            return window.innerWidth + offset;
        } else if (typeof offset == 'string') {
            if (/^-?\d+px$/.test(offset.trim())) {
                return window.innerWidth + parseInt(offset.trim().match(/^-?(\d+)px$/)[1]);
            }
        }
        throw new Error('Invalid offset value');
    }

    window.BMMultiColumn.init();
})(`
#PlacesToolbarItems menupopup {
    max-width: calc(100vw - 20px);
    max-height: calc(100vh - 129px);
}
#PlacesToolbarItems menupopup > * {
    scroll-snap-align: start;
}
`);

Alles anzeigen

Endor

FuchsFan
Prima. passt nun.
Vielen Dank.
Mfg.
Endor

FuchsFan

Zitat von Endor

Prima. passt nun.
Vielen Dank.

Endor Sehr schön, ist gern geschehen, aber nur mit Hilfe KI.

Endor

Zitat von FuchsFan

aber nur mit Hilfe KI

Na und. Stört mich überhaupt nicht.
Wichtig ist für mich nur, dass es jetzt so funktioniert wie ich es möchte.
Daher nochmals vielen Dank für Deine Hilfe.
Mfg.
Endor

Mira_Belle

Da ist man einmal im Urlaub, ts.
Das Skript funktionierte schon eine ganze Weile in der Nigtly so nicht mehr.
Und da ich in Urlaub war, konnte ich zwar verfolgen was hier geschah,
aber nicht eingreifen!
Das originale korrigierte Skript habe ich natürlich,
poste es aber nur auf Nachfrage.

Endor

Hallo Mira_Belle.

Schön, dass Du wieder da bist. Hoffe Du hattest einen schönen
erholsamen Urlaub.
Gerne nehme ich Dein Angebot an und bitte um Zusendung des
Scriptes. Gerne auch nur per PN. Wie Du magst.
Viele Grüße
Endor

Sören Hentzschel

Und aus welchem Grund genau sollte das Script nur auf Anfrage oder nur privat geteilt werden?

Mira_Belle

Zitat von Sören Hentzschel

Und aus welchem Grund genau sollte das Script nur auf Anfrage oder nur privat geteilt werden?

Weil ich schon einmal doof angemacht wurde, weil es ja gar nicht um "mein" Skript ging.
Ich bin nun erholt und in Zukunft etwas vorsichtiger!
Das Skript gibt es nicht exklusiv per PN!
Ich wurde inzwischen danach gefragt und hier kommt es.

Beitrag

RE: Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

Da das JavaScript BookmarkCount.uc.js in der aktuellen Nightly scheinbar nicht mehr so funktioniert, wie es eigentlich sollte
hier eine gefixte Version!

(Quelltext, 255 Zeilen)

Mira_Belle

18. Juli 2026 um 17:00

Im weiteren Verlauf des Threads werden einige Optionen erklärt.

JavaScript

// BookmarkCount.uc.js

/* ******************************************************************************************************************* */
/* Author BrokenHeart               => https://www.camp-firefox.de/forum/thema/136572/?postID=1229536#post1229536 **** */
/* Correction from BrokenHeart      => https://www.camp-firefox.de/forum/thema/136572/?postID=1229696#post1229696 **** */
/* Extension from Sören Henschel    => https://www.camp-firefox.de/forum/thema/136572/?postID=1229555#post1229555 **** */
/* Customized by Mira inspired by grisu2099     ********************************************************************** */
/* Source                           => https://www.camp-firefox.de/forum/thema/136572/?postID=1229875#post1229883 **** */
/* Customized by Mira inspired by Horstmann     ********************************************************************** */
/* Source                           => https://www.camp-firefox.de/forum/thema/136572/?postID=1229993#post1229993 **** */
/* Adjustments for 139 and customized by Mira inspired by Horstmann     ********************************************** */
/* Source                           => https://www.camp-firefox.de/forum/thema/136572/?postID=1270254#post1270254 **** */
/* Bugfixes for 'popupshowing' to 'popupshown'inspired by BrokenHeart & Horstmann ************************************ */
/* Source                           => https://www.camp-firefox.de/forum/thema/136572/?postID=1274881#post1274881 **** *
/* ******************************************************************************************************************* */
/* Version 1.04a                    => https://www.camp-firefox.de/forum/thema/136572/?postID=1274881#post1274881 **** */
/* Version 1.05                     => https://www.camp-firefox.de/forum/thema/136572/?postID=1291576#post1291576 **** */
/* ******************************************************************************************************************* */
/* Custom Counter in the Bookmarks for folders and links ************************************************************* */
/* ******************************************************************************************************************* */

(function() {
  if (!window.gBrowser) return;

  setTimeout(function() { setFunction(); }, 10);

  let ProfilePath = PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir, 'chrome', 'icons'));

  // ■■ START UserConfiguration ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
  
  //Custom icons in profile/chrome/icons folder
  let icon1 = "folder-fat.svg";                     //  Custom  Folder Icon
  let icon2 = "bookmark-hollow.svg";                //  Custom  Link Icon              
  let icon3 = "arrow-right.svg";                    //  Custom  Arrow Icon

  // Custom settings
  let bm_font_size = 12; 
  let cs_font_weight = 700;
  let bm_icon_size = 16;

  // NEU: Schriftfarben getrennt definieren
  //let cs_font_color_1 = "#FFA500";                 // Farbe für Folder-Zähler (links)
  //let cs_font_color_2 = "#00FFFF";                 // Farbe für Link-Zähler (rechts)
  let cs_font_color_1 = "#FFD700";                 // Farbe für Folder-Zähler (links)
  let cs_font_color_2 = "#FFD700";                 // Farbe für Link-Zähler (rechts)

  // NEU: Symbolfarben getrennt definieren 
  //let cs_icon_color_1 = "#5fe575";                 // Farbe für "Ordner", 1.Symbol
  //let cs_icon_color_2 = "#fbf328";                 // Farbe für "Link", 2.Symbol
  //let cs_icon_color_3 = "#bbf700";                 // Farbe für den Pfeil
  let cs_icon_color_1 = "#C0C0C0";                 // Farbe für "Ordner", 1.Symbol
  let cs_icon_color_2 = "#C0C0C0";                 // Farbe für "Link", 2.Symbol
  let cs_icon_color_3 = "#C0C0C0";                 // Farbe für den Pfeil

  // NEU: Farbe für die Zahlenwerte und Symbole beim Hovern. 

  let cs_font_hovercolor_1 = "#FFD700";                 // Farbe für Folder-Zähler (links)
  let cs_font_hovercolor_2 = "#FFD700";                 // Farbe für Link-Zähler (rechts) "#80ffff";
  let cs_icon_hovercolor_1 = "#C0C0C0";                 // Farbe für "Ordner", 1.Symbol "#ff0000";
  let cs_icon_hovercolor_2 = "#C0C0C0";                 // Farbe für "Link", 2.Symbol "#00ff00";

  let cs_icon_hovercolor_3 = "#ffff80";                 // Farbe für den Pfeil

  // Calculated settings  
  let cs_font_size = `${bm_font_size}px`;
  let cs_icon_size = `${bm_icon_size}px`;
  let cs_width_one = `calc(${bm_icon_size}px + 1.4em)`;
  let cs_width_uno = `calc(${bm_icon_size}px)`;
  let cs_width_two = `calc(${bm_icon_size}px + 1.4em)`;
  let cs_width_due = `calc(${bm_icon_size}px)`;

  //let useStyle1 = true; // <- HIER Weiche setzen: true = Variante 1, false = Variante 2
  let useStyle = 1; // <- HIER Weiche setzen:  0 = Symbole hinter den Zählern, 1 = Symbole vor den Zählern
  // ■■ END UserConfiguration ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

  // Symbole vor den Zählern
  let css_one = `
    #bmContent::before {
      content: attr(data-value1) !important;
      width: ${cs_width_one} !important;
      align-items: center !important;
      display: flex !important;
      justify-content: end !important;
      margin-left: 16px !important;
      margin-right: -1px !important;
      background-image: url("${ProfilePath}/${icon1}")!important;
      background-position: center right calc(${cs_width_one} - ${cs_icon_size}) !important;
      background-repeat: no-repeat !important;
      background-size: ${cs_icon_size} ${cs_icon_size} !important;
      color: ${cs_font_color_1} !important;
      fill: ${cs_icon_color_1} !important;
    }
    #bmContent::after {
      content: attr(data-value2) !important;
      width: ${cs_width_two} !important;
      align-items: center !important;
      display: flex !important;
      justify-content: end !important;
      margin-left: 4px !important;
      margin-right: -1px !important;
      background-image: url("${ProfilePath}/${icon2}") !important;
      background-position: center right calc(${cs_width_two} - ${cs_icon_size}) !important;
      background-repeat: no-repeat !important;
      background-size: ${cs_icon_size} ${cs_icon_size} !important;
      color: ${cs_font_color_2} !important;
      fill: ${cs_icon_color_2} !important;
    }
  `;

  // Symbole hinter den Zählern
  let css_two = `
    #bmContent::before {
      content: attr(data-value1) !important;
      width: ${cs_width_one} !important;
      align-items: center !important;
      display: flex !important;
      justify-content: end !important;
      background-image: url("${ProfilePath}/${icon1}")!important;
      background-position: center right calc(${cs_width_uno} - ${cs_icon_size}) !important;
      background-repeat: no-repeat !important;
      background-size: ${cs_icon_size} ${cs_icon_size} !important;
      color: ${cs_font_color_1} !important;
      fill: ${cs_icon_color_1} !important;
      padding: 2px 20px 0px 10px !important;
      margin-left: 16px !important;
      margin-right: 12px !important;
    }
    #bmContent::after {
      content: attr(data-value2) !important;
      width: ${cs_width_two} !important;
      align-items: center !important;
      display: flex !important;
      justify-content: end !important;
      background-image: url("${ProfilePath}/${icon2}")!important;
      background-position: center right calc(${cs_width_due} - ${cs_icon_size}) !important;
      background-repeat: no-repeat !important;
      background-size: ${cs_icon_size} ${cs_icon_size} !important;
      color: ${cs_font_color_2} !important;
      fill: ${cs_icon_color_2} !important;
      padding: 2px 22px 0 0 !important;
      margin-left: -14px !important;
      margin-right: -1px !important;
    }
  `;

  function setFunction() {
    const css =`
      /* Fix für Firefox Nightly - Label als Flex-Container */
      #bookmarksMenuPopup > menu > label,
      #bookmarksMenuPopup > menu > menupopup > menu > label,
      #bookmarksMenuPopup > menu > menupopup > menu > menupopup > menu > label,
      #PlacesToolbarItems > .bookmark-item > menupopup > menu > label {
        display: flex !important;
        justify-content: space-between !important;
      }

      /* Counter Container */
      #bmContent {
        display: flex !important;
        margin-inline: auto 0 !important;
        font-family: Consolas, "Lucida Console", "Courier New", monospace !important;
        font-size: ${cs_font_size} !important;
        font-weight: ${cs_font_weight} !important;
        height: ${cs_icon_size} !important;
      }

      /* Dynamisch gewählter Counter-Stil */
      ${useStyle ? css_one : css_two}

      /* Pfeil */
      menupopup > menu::after {
        content: "" !important;
        background-image: url("${ProfilePath}/${icon3}")!important;
        height: ${cs_icon_size} !important;
        fill: ${cs_icon_color_3} !important;
        margin-inline: 0 !important;
      }


      /* Farbe für die Zahlenwerte und Symbole beim Hovern. */
      menupopup[placespopup="true"] > menu.bookmark-item:hover > .menu-text > #bmContent::before {
          color: ${cs_font_hovercolor_1} !important;
          fill: ${cs_icon_hovercolor_1} !important;
      }
      menupopup[placespopup="true"] > menu.bookmark-item:hover > .menu-text > #bmContent::after {
          color: ${cs_font_hovercolor_2} !important;
          fill: ${cs_icon_hovercolor_2} !important;
      }
      /* Farbe für den Pfeil beim Hovern. */
      menupopup > menu:hover::after { 
          fill: ${cs_icon_hovercolor_3} !important; }
      }


    `;

    const sss = Cc['@mozilla.org/content/style-sheet-service;1'].getService(Ci.nsIStyleSheetService);
    const uri = Services.io.newURI('data:text/css,' + encodeURIComponent(css));
    sss.loadAndRegisterSheet(uri, sss.AGENT_SHEET);

    let bmbMenu = document.getElementById('bookmarks-menu-button');
    let bookMenu = document.getElementById('bookmarksMenu');
    let persToolBar = document.getElementById('PersonalToolbar');

    if(bmbMenu) {
      let bmbMenuPopup = document.getElementById('BMB_bookmarksPopup');
      if(bmbMenuPopup) {
        bmbMenuPopup.openPopup();
        bmbMenuPopup.hidePopup();
        bmbMenuPopup.setAttribute("hasbeenopened","true");
      }
      bmbMenu.addEventListener('popupshowing', onPopupShowing);
    }
    if(bookMenu) {
      let bookMenuPopup = document.getElementById('bookmarksMenuPopup');
      if(bookMenuPopup) {
        bookMenuPopup.openPopup();
        bookMenuPopup.hidePopup();
        bookMenuPopup.setAttribute("hasbeenopened","true");
      }
      bookMenu.addEventListener('popupshowing', onPopupShowing);
    }
    if(persToolBar) {
      persToolBar.addEventListener('popupshown', onPopupShowing);
    }
  }

  function onPopupShowing(aEvent) {
    let popup = aEvent.originalTarget;
    for (let item of popup.children) {
      if (item.localName != 'menu' || item.id?.startsWith('history')) continue;

      setTimeout(() => {
        let itemPopup = item.menupopup;
        itemPopup.hidden = true;
        itemPopup.collapsed = true;
        itemPopup.openPopup();
        itemPopup.hidePopup();

        let menuitemCount = 0;
        let menuCount = 0;
        for (let subitem of itemPopup.children) {
          if (subitem.classList.contains('bookmark-item') && !subitem.disabled && !subitem.hidden) {
            if (subitem.localName == 'menuitem') menuitemCount++;
            else if (subitem.localName == 'menu') menuCount++;
          }
        }

        itemPopup.hidden = false;
        itemPopup.collapsed = false;

        // Neues Element für Zaehler
        let bmCounta = item.childNodes[1];
        if (!bmCounta) return;                             // Falls undefiniert

        bmCounta.innerHTML = "";
        let bmContent = document.createElement("bmContent");
        bmContent.id = "bmContent";
        bmCounta.appendChild(bmContent);

        //let strCountOut1 = " " + menuCount + " ";         //  Has no brackets
        //let strCountOut1 = "(" + menuCount + ")";         //  Has round brackets
        //let strCountOut1 = "[" + menuCount + "]";         //  Has square brackets
        
        let strCountOut1 = String(menuCount).padEnd(2, " ");
        bmContent.setAttribute('data-value1', strCountOut1);

        //let strCountOut2 = " " + menuitemCount + " ";      //  Has no brackets
        //let strCountOut2 = "(" + menuitemCount + ")";      //  Has round brackets
        //let strCountOut2 = "[" + menuitemCount + "]";      //  Has square brackets
        // let strCountOut2 = String(menuitemCount).padEnd(2, " ");
        // bmContent.setAttribute('data-value2', strCountOut2);
        
        let strCountOut2 = (useStyle === 0)
          ? String(menuitemCount).padStart(4, "/  ") // (5, " |  ")
          : String(menuitemCount).padEnd(2, " "); //1 rechtsbündig / 2 linksbündig
        bmContent.setAttribute('data-value2', strCountOut2);
      }, 100);
    }
  }
})();

Alles anzeigen

bookmark_count.uc.js funktioniert im Nightly nicht mehr.

RE: Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

Ähnliche Themen

Quicklink.uc.js funktioniert nicht mehr

Skript für den Toolbox-Button funktioniert im Nightly nicht mehr

Das Script New_Addonbar.uc funktioniert nicht mehr.

Firefox startet nicht mehr

Das "DeepL-Skript" funktioniert nicht mehr richtig!

Scrollbar Farbe ändern in Fx 143 - 144 funktioniert nicht mehr richtig