Edit bookmark URL from the Edit bookmark menu?

Question

In the menu that is opened by clicking on the blue star icon that appears near your URL bar when you have a page bookmarked, there is no option to edit the URL of said bookmark. This is annoying when you only wish to make a minor change to the bookmark, such as changing example.com/page-1 to example.com/page-2. Is there any way to make this menu display the URL of your bookmark? I feel like Firefox used to be able to do this in much older versions.

I had hoped that a userChrome.css fix would do the trick. I found the below online, but it seems to have had no effect.

/* Add option to edit bookmark URLs under blue star menu */
#editBMPanel_locationRow, #editBMPanel_keywordRow {
  visibility: visible !important;
}

This question expresses a similar frustration, but does not insist on modifying the menu that I've screenshotted above. I only want solutions that modify said menu.

It appears that my current userChrome.css file may be of relevance. Here it is

/*@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");*/
@namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
@namespace html "http://www.w3.org/1999/xhtml";
.bookmark-item{
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-right: 0 !important;
    padding-left: 0 !important; 
}
toolbarbutton.bookmark-item .toolbarbutton-text{
    display: none !important;
}
toolbarbutton.bookmark-item .toolbarbutton-icon{
    margin-left: 2px !important;
}
#PlacesToolbarItems > .bookmark-item > .toolbarbutton-icon[label]:not([label=""]) {
    margin-inline-end: 2px !important;
}
toolbarbutton.subviewbutton.subviewbutton-iconic .toolbarbutton-text{
    display: -moz-box !important;
}
/* --- [1] --- */
toolbarbutton.bookmark-item:hover:not(.subviewbutton):not([disabled="true"]):not([open]) .toolbarbutton-text{
    display: -moz-box !important;
}
/* Hide Giant Thumbnail and Favicon */
#editBookmarkPanelImage,
*|div#editBookmarkPanelFaviconContainer {
  display: none !important;
}

/* fix right click menu disappearing on highlighted text */
*#contentAreaContextMenu { margin: 12px 0 0 12px };

/* Add option to edit bookmark URLs under blue star menu */
#editBMPanel_locationRow, #editBMPanel_keywordRow {
  visibility: visible !important;
}

Answer 1

Works for me (on latest FF 98.0.2).

Are you sure you put the userChrome.css file to the right place, in a folder called "chrome" inside your profile folder. Note that the "chrome" folder does not exist in default installations, it's only used for customization, so you must create it.

For example:
C:\Users\YYYY\AppData\Roaming\Mozilla\Firefox\Profiles\XXXXXXXX.default\chrome\userChrome.css

You can find the correct folder by typing about:support in your URL bar and clicking "Open Folder" under the "Profile Folder" category.

You probably also need to have the xul and html tags in the file, like this:

/* userChrome.css */

@namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
@namespace html "http://www.w3.org/1999/xhtml";

/* Add option to edit bookmark URLs under blue star menu */
#editBMPanel_locationRow {
  visibility: visible !important;
}

You also need to set the configuration option
toolkit.legacyUserProfileCustomizations.stylesheets = true
in about:config to allow userChrome.css to function.

---

Or just extract this zip file to your profile folder: https://gist.github.com/anzz1/980102da101505b8bc03e46d54f778fe/archive/3ab4d55882bd0b72828c9d3c880bb7b6ba387cbb.zip

It contains the userChrome.css style file and user.js to set the config option for you.

---

EDIT I forgot about the last part, which should fix the problem of configuration not applying. After applying userChrome.css and user.js, go to about:support and select "Clear Startup Cache" option. After that, restart your Firefox twice.