cancel
Showing results for 
Search instead for 
Did you mean: 

change find bar back

SOLVED
Highlighted
New Contributor

change find bar back

is there anyway to get the old find bar back? i tried looking in about:config and searching online but couldn't find anything. i was hoping you could customize it like the other toolbars and i could remove the flexible space or move the controls around.

does mozilla do usability tests? i doubt they do because there is no way the new find is easier to use or an upgrade over then the old one. i really don't want to install an add-on just to make the find bar usable again. this is almost as bad as when they removed the new tab option from the tabs context menu (something chrome has). thanks.

why the new find bar is horrible.

  • the find next/previous occurrence buttons are tiny and much harder to click. there is no reason for them to be so small because there is plenty of unused space.
  • the find next occurrence was moved farther away from the textbox. i just about always want to use the find next occurrence option first.
  • highlight all, match case and the X to close the find bar are all the way on the opposite side. with ff maximized on a widescreen monitor that is nowhere near the textbox and next/previous buttons.

just to remind you how much better the old find bar was. everything about the top bar is better and more user friendly.

http://s11.postimg.org/qsc5piwr7/ff_find.png

1 ACCEPTED SOLUTION

Accepted Solutions
Site Moderator

Re: change find bar back

Here is a better code to move the spacer from its current position before the two buttons to a position after the two buttons to push the close button to the right end.

Add code to the userChrome.css file below the default @namespace line.

The customization files userChrome.css (user interface) and userContent.css (websites) are located in the chrome folder in the Firefox profile folder.

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */

/* add text to Previous and Next buttons */
.findbar-find-previous label:after { content: "Previous"; }
.findbar-find-next label:after { content: "Next"; }

/* more possible tweaks */
/* Quick find - show buttons */
.findbar-container>*, .findbar-container>hbox>* { display:-moz-box; }

/* move spacer to a position behind the Match case button */
.findbar-container>spacer { -moz-box-ordinal-group:2 !important; }

/* close button at far left */
.findbar-closebutton { -moz-box-ordinal-group: 0 !important; }
/* older Firefox versions may need this code */
/* .findbar-container>.findbar-closebutton { -moz-box-ordinal-group: 0 !important; margin-right:10px!important} */

/* adjust the width of the text field */
.findbar-textbox { width:30em !important; }

/* add a background color to the checked Highlight and Case sensitive buttons */
.findbar-highlight[checked]>label { background-color:#ff8 !important; }
.findbar-case-sensitive[checked]>label { background-color:#f88 !important; }
.findbar-case-sensitive[checked]+label { display:none !important; } /* hide "(Case sensitive)" label */

(you can consider to use "Prev" instead of "Previous" to give both buttons the same size)

edited to update the code for current releases.

32 REPLIES
Site Moderator

Re: change find bar back

(see my next post for updated code: /questions/976166#answer-497046)

New Contributor

Re: change find bar back

not sure why it mangled the formatting of my first post. i didn't see a preview option for the initial post or an edit option so i could fix it. that's horrible.

thanks. anyway to get the X highlight all and match case back to where they were before?

New Contributor

Re: change find bar back

I too would like to know if its possible in userchrome.css to move the Highlight/Match Case back to the original left position for easier clicking rather than having to move the mouse all the way left and then right on the browser to find something.

Site Moderator

Re: change find bar back

(see my next reply for updated code)

Site Moderator

Re: change find bar back

Here is a better code to move the spacer from its current position before the two buttons to a position after the two buttons to push the close button to the right end.

Add code to the userChrome.css file below the default @namespace line.

The customization files userChrome.css (user interface) and userContent.css (websites) are located in the chrome folder in the Firefox profile folder.

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */

/* add text to Previous and Next buttons */
.findbar-find-previous label:after { content: "Previous"; }
.findbar-find-next label:after { content: "Next"; }

/* more possible tweaks */
/* Quick find - show buttons */
.findbar-container>*, .findbar-container>hbox>* { display:-moz-box; }

/* move spacer to a position behind the Match case button */
.findbar-container>spacer { -moz-box-ordinal-group:2 !important; }

/* close button at far left */
.findbar-closebutton { -moz-box-ordinal-group: 0 !important; }
/* older Firefox versions may need this code */
/* .findbar-container>.findbar-closebutton { -moz-box-ordinal-group: 0 !important; margin-right:10px!important} */

/* adjust the width of the text field */
.findbar-textbox { width:30em !important; }

/* add a background color to the checked Highlight and Case sensitive buttons */
.findbar-highlight[checked]>label { background-color:#ff8 !important; }
.findbar-case-sensitive[checked]>label { background-color:#f88 !important; }
.findbar-case-sensitive[checked]+label { display:none !important; } /* hide "(Case sensitive)" label */

(you can consider to use "Prev" instead of "Previous" to give both buttons the same size)

edited to update the code for current releases.

New Contributor

Re: change find bar back

Many thanks cor-el for the code. Would it be possible for you to explain what each option does? Besides the obvious one like Previous/Next text. The rest below I am not sure what it tweaks. Any images perhaps that you could provide as the end result of applying said code? I only really want the Highlight/Match case to be moved to the left as I can deal with the non-texted previous/next icons. I also would like to know if its possible to keep quick find open when I switch tabs as it closes for each tab I switch to. This would be okay if I just started typing where quick find would popup automatically but if I CTRL-F, you would think it would stay open since I forced it to open.

Site Moderator

Re: change find bar back

F3 will open the Find bar and /and ' will open the Quick find bar, so you do not need to use Ctrl+F all the time. ESC will close the Find bar when having focus.

I've added some comments to the last version I posted above that should make it easier to decide which parts to use.
The first part adds the text to the buttons via :after {content} rules.
The section that follows makes Firefox show the Highlight and Case sensitive buttons to the Quick Find bar that opens via / and '.
The next section moves the spacer to a position after the "Highlight" and"Case sensitive" buttons causing the "Highlight" button to be positioned right after the Next button.
You can choose to have the close button at the far left (-moz-box-ordinal-group:0) or at the far right (-moz-box-ordinal-group:3; remove the comment delimiters).
You can choose to make the text field wider to see more of longer search terms.
The last section gives a background color to the two buttons, so you notice immediately that you have pressed them (I usually tend to forget if I clicked Case sensitive).
You can also hide the (Case sensitive) text as you can have the buttons instead in Quick Find mode with one of the other sections.

New Contributor

Re: change find bar back

thanks this is what i was looking for. mozilla should reevaluate the useability of the new find bar.

New Contributor

Re: change find bar back

Thank you! Nice solution.

One more thing... Is there a way to change the order of the buttons? The old way was to have the down arrow (Next button) first. Can that be done?