Xfce Forum

yytuanko

Member

Registered: 2020-07-22

Posts: 5

How to customize xfce whisker menu.

Is there a css file that changes the color and placement of the whisker menu?
I'm not very good at English so I'm using a translation. I'm sorry.

KBar

Moderator

Registered: 2021-11-05

Posts: 689

Re: How to customize xfce whisker menu.

User-defined custom CSS rules are usually written to and stored in $HOME/.config/gtk-3.0/gtk.css. If it doesn't exist yet, simply create it. Here's an excerpt from mine:

#whiskermenu-button {
  background: @launcher_bg url("assets/whisker_icon_back.png") center;
  margin-top: -2px;
  padding-bottom: 0px;
}

#whiskermenu-button:hover {
  background: @launcher_bg url("assets/launcher_arrow_rtl_19.svg") right no-repeat, url("assets/whisker_icon_back.png") center;
  margin-top: -2px;
  padding-bottom: 0px;
}

#whiskermenu-button:checked {
  background: @launcher_bg url("assets/launcher_arrow_ltr_19.svg") left no-repeat, url("assets/launcher_arrow_rtl_19.svg") right no-repeat, url("assets/whisker_icon_selected_back.png") center;
  margin-top: -2px;
  padding-bottom: 0px;
}

The code above produces the following:
          

I had to edit and apply some effects to the original logo in GIMP to make it look like this. You can select any image as its icon by right-clicking on it and going Properties → Panel Button → Icon.

Some resources you may find helpful:

Overview of CSS in GTK3: https://docs.gtk.org/gtk3/css-overview.html
CSS Backgrounds and Borders Module Level 3: https://www.w3.org/TR/2021/CRD-css-back … -20210726/
xfce4-panel - Panelbar Theming: https://docs.xfce.org/xfce/xfce4-panel/theming
Great tutorial by ToZ: https://forum.xfce.org/viewtopic.php?pid=54292#p54292

Last edited by KBar (2022-01-05 16:54:16)

---

Remember to edit the subject of your topic to include the [SOLVED] tag once you're satisfied with the answers or have found a solution (in which case, don't forget to share it as well), so that other members of the community can quickly refer to it and save their time. Pretty please!

yytuanko

Member

Registered: 2020-07-22

Posts: 5

Re: How to customize xfce whisker menu.

Thank you for your politeness