(SOLVED) Specific Whisker Menu modifications

Aravisian · 2019-08-17 11:21:35

I made the switch to Linux this past January. I seem to have joined the crowd a bit late...
I took an instant liking to a depreciated and obsolete Gnome Theme, Azenis. For anything GTK3, the existing copies no longer work. So, I set about making my own.
I have a LOT to learn, yet.
But I do have it working, now except for some issues that bother me to no end. The old GnoMenu is long gone and it ain't comin' back. I decided to fake it.
I created an image pop up that acts as a background for the menu.

As you can see, the Border line of the Whisker Menu is very visible against the background. Is there a way to make it transparent?
The other issue is the Search bar- it blocks a large portion - is there a way to modify its size or the space it takes up?

Last edited by Aravisian (2019-08-19 18:00:37)

ToZ · 2019-08-17 12:27:12

Cool theme.

Here are some snippets you might want to try to get at the individual elements.

/* transparent windows border */
#whiskermenu-window>frame>border { border-color: transparent; }

/* transparent grip image - also makes the name transparent - they are tied together */
#whiskermenu-window { color: transparent }

/* smaller toolbar widgets and area */
#whiskermenu-window>frame>stack>box>box * { -gtk-icon-transform: scale(0.5); margin: 0px; padding: 0px; font-size: 6pt;}

/* smaller search entry box */
#whiskermenu-window>frame>stack>box>box>entry { margin: 5px; font-size: 6pt;}

BTW, welcome to the forums.

Last edited by ToZ (2019-08-17 12:31:21)

Aravisian · 2019-08-17 20:56:09

Toz, I have read so many of your posts, many going back many years, that I feel like I just got addressed by Yoda.
Yes, I do look for answers before asking... I have already seen you spend a great deal of time helping others. Thanks for that.
Which of course leads to me needing more help...

Where do I put those snippets?
I tried the usual places: ~/"me"/.gtkrc, ~/.config, whiskermenu.rc and so on. I did "xfce4-panel -r" in terminal after each trial all to no effect.
I have GtkParasite; but I am inexperienced in using it. I am learning, slowly.

Last edited by Aravisian (2019-08-17 20:57:25)

ToZ · 2019-08-17 21:32:09

Toz, I have read so many of your posts, many going back many years, that I feel like I just got addressed by Yoda.

About that, sorry I am.

The codes above are for the GTK3 version of the whiskermenu. You can check which version you have by running this command:

ldd $(locate libwhiskermenu.so) | grep gtk

If it is GTK3, then you would put those commands in ~/.config/gtk-3.0/gtk.css and restart xfce4-panel:

xfce4-panel -r

Try putting in one tweak at a time so you can see what, if any, difference it makes.

Aravisian · 2019-08-17 21:47:55

It appears not:

libgtk-x11-2.0.so.0 => /usr/lib/x86_64-linux-gnu/libgtk-x11-2.0.so.0 (0x00007f2f2f675000)

There is a .gtkrc in home folder and there is one in the .config folder. Trying them in either had no effect.

I notice the the elements displayed in the WhiskerMenu are from the gtk2 version (folder) of the Azenis theme I "made." For example, I have not yet put grips on the sliders in the gtk3 version.
Elsewhere, Misko(bunchanumbers) had posted a wlak-through on themeing background images in the Whisker Menu that I followed experimentally and they worked. It will not function as I had hoped on mine, but it Did Work which is a clue...
Ah, I will just look it up real quick.
Found it. See by your watch, I am lightning fast.
Here: https://www.linuxliteos.com/forums/scri … 9cvsqn1cg7
Those worked when placed in the ~/.gtkrc file.

Last edited by Aravisian (2019-08-17 21:51:15)

ToZ · 2019-08-17 21:49:26

Okay, you are using the gtk2 version of the plugin. Which distro are you using? I'll need to convert those over to GTK2 tweaks.

Aravisian · 2019-08-17 21:52:08

ToZ wrote:

Okay, you are using the gtk2 version of the plugin. Which distro are you using? I'll need to convert those over to GTK2 tweaks.

Zorin 12.4 Lite.

ToZ · 2019-08-17 23:27:10

Here is the developer's notes on theming the GTK2 version and here is a forum thread with some information.

Would you be willing to share the theme changes you made so far so I can look specifically at it?

Aravisian · 2019-08-18 00:13:42

ToZ wrote:

Here is the developer's notes on theming the GTK2 version and here is a forum thread with some information.
Would you be willing to share the theme changes you made so far so I can look specifically at it?

Any changes I tried making to the Whisker Menu have had no effect- aside from Misko's posts made sometime back when Dinosaurs were still smoking cigarettes. I am not using Misko's theme as it doesn't do what I would like to do- I tested it out to see if it worked, which it did.
I have tried the changes you see in Gott's walk-through- But I now realize (With a red face) that I was trying to apply the gtk3 suggestions...
In my defense, it made sense, at the time to assume it was using gtk3.
I will try the gtk2 reference you just gave in a few minutes.

If you are asking me to share what Whisker Menu theme changes I have made- the answer is none other than the settings under properties.
The Azenis and Azenis GnoMenu Style background you see in the image is coded with Python. It runs separately and pops up separately - one of the issues I am working to resolve is fine tuning the timing of each apps popping of Up.
It's ok with me since I am doing this only for myself, you see...
I doubt very many people have much interest in Azenis, anymore.
When I started theming it, I was running Zorin 12.4 Core, which was full Gnome - gtk3 heavy and no XFCE in sight. So, I started from scratch and built the gtk2 and the gtk3 aspects from the ground up and using many bits and pieces. I also had to recreate much of the Preface Icons that were used as well as converting the lot to svg and making Symbolic ones. And made new ones as well as new ones to replace old ones like the Recents folder- you can glimpse in the link below.
There are some differences... Mine is darker than Ezy's and JamesHardy's. I adjusted how the drop down menu's color differently. I can make screenshots if you want.. On Gnome, I needed to use Gnome Flashback with Compiz to get the Window manager. When I installed Zorin 12.4 Lite, which uses the XFCE desktop, I did away with Compiz and Emerald and used the XFWM. I then modified the Azenis titlebuttons because they are too close together and easy to Miss your Target and loaded them up here:
https://www.pling.com/p/1311035

You can see some screenshots. All of those changes are in the System Theme that I simply call "Azenis-Dark" on my computer. In the Whisker Menu, the Scrollbar, steppers, grips, sliders, etc. are imported from the Azenis-Dark Theme. I set the opacity on the Whisker menu to 0, which allows that background to shine through. It gives the illusion of the icons sliding out from under the inner panels of the background, visible in the image above where you see the bottom of a folder at the top of the menu.

I HAVE noticed that if I change themes, that black Border Line appears to change color sometimes, suggesting it is created by my system theme. But I have not figured out where or how. I have never seen that search bar change except in response to changing font/font size or changing the settings of Whisker Menu properties on where to position it.

Last edited by Aravisian (2019-08-18 00:17:47)

Aravisian · 2019-08-18 00:36:10

ToZ wrote:

Here is the developer's notes on theming the GTK2 version and here is a forum thread with some information.

I just tried the developers exact suggestions in the wordpress reference, changing Text Color, for example (in ~/.gtkrc ):

style "darkback"
{
	bg[NORMAL] = "#404040"
	bg[ACTIVE] = "#606060"
	bg[PRELIGHT] = "#808080"
	fg[NORMAL] = "#ccc"
	fg[ACTIVE] = "#fff"
	fg[PRELIGHT] = "#fff"
}
widget "whiskermenu-window*" style "darkback"

which has no effect, at all.
I then changed system theme to Adwaita, to test, and tried again and after restarting the panel, the text colors did not change.
I tried the same just now using only the elements of Misko's suggestions from the other thread but excluded the background Images and the text and colors did not change with his code, either.
However, in Adwaita, the Menu Border did become white instead of black.

Last edited by Aravisian (2019-08-18 00:37:29)

ToZ · 2019-08-18 01:35:32

Aravisian wrote:

I just tried the developers exact suggestions in the wordpress reference, changing Text Color, for example (in ~/.gtkrc ):

The file should be called ~/.gtkrc-2.0

Aravisian · 2019-08-18 01:44:57

ToZ wrote:

Aravisian wrote:
I just tried the developers exact suggestions in the wordpress reference, changing Text Color, for example (in ~/.gtkrc ):
The file should be called ~/.gtkrc-2.0

That is it's title; I was just typing too fast.

Last edited by Aravisian (2019-08-18 01:45:20)

ToZ · 2019-08-18 01:50:11

Can you post the full contents of your ~/.gtkrc-2.0 file? Those commands worked here for me on a GTK2 whiskermenu install.

Aravisian · 2019-08-18 02:02:18

ToZ wrote:

Can you post the full contents of your ~/.gtkrc-2.0 file? Those commands worked here for me on a GTK2 whiskermenu install.

Well... I cannot now because I blank it out after each failure. Currently (And usually) the file sits empty with nothing in it. At one point, some KDE thing I tried installing wrote some lines in there but I cleaned that out after I nuked that KDE thing off my computer (and laid curses on any children it may have, as well.)
I do this because I cannot guarantee that it won't have some wild effect later... that I don't want happening without me expressly wanting it to happen.

What I did, though, was I pasted the following to ~/.gtkrc-2.0 as per the link you gave:

style "darkback"
{
	bg[NORMAL] = "#404040"
	bg[ACTIVE] = "#606060"
	bg[PRELIGHT] = "#808080"
	fg[NORMAL] = "#ccc"
	fg[ACTIVE] = "#fff"
	fg[PRELIGHT] = "#fff"
}
widget "whiskermenu-window*" style "darkback"

That was in there at that time and nothing else.
I tried more than once, in case I mis-pasted.

On earlier days, I tried Misko's code to change background color swapping out the html color codes with...pink... because I figured that was a radical enough difference to show that the color did indeed change from anything I am using...
I repeated the process three or four times on that day, too.

Last edited by Aravisian (2019-08-18 02:03:49)

Aravisian · 2019-08-18 04:33:00

Update:
I have "solved" the black border around the Whisker Menu... In a way.
The questions Toz asked all pointed me in the right direction. The Whisker Menu, on my machine, is employing gtk2.
We also narrowed it down to that the System theme was supplying that border. So, I switched across several themes and observed the color change between them on that border.
Then, I went into the gtk2 folders in the theme folders and looked for those colors and borders. I found it in "Shadows" folders; an image called frame.png.
To test it, I simply made the image transparent using Gimp - tab called Windows, Dockable, Layers, then selected the image and reduced the Opacity to zero.
Crude, but effective, to quote Seven of Nine.

The borders on the Whisker Menu, or Frame, are now transparent and that problem is solved. More or less. Needless to say... This undoubtedly will affect other applications. I did some preliminary checking to see what else might be affected and while many windows are affected, they are not so in any harmful way because that black line border was not the only differentiation. The background colors are different, creating a natural border, anyway. Maybe in the future, I will find a problem with it in some application. Who knows. I saved a back up copy of the 100% opacity frame, just in case.
Since I only changed the frame in the gtk2 folder and the one in gtk3 folder is still solid, all gtk3 applications won't be affected.
IF I really knew the css, I could adjust it in the gtk.css file to apply only to what I want it to. But I am slowly learning .css on my own time without proper instruction (mostly trial and error), so this work-around will do for now. And again, it really doesn't have any affect on any functionality I have found and is mroe aesthetic.

Now for that Search box- that will be a lot trickier...

EDIT2: Trying out Imagur since photobucket is very annoying. Filled in the gaps. As you can see, the long search bar is a bit in the way. Not Horrible, but annoying. Hopefully, can be solved.

Last edited by Aravisian (2019-08-18 07:53:16)

ToZ · 2019-08-18 11:51:57

Aravisian wrote:

Now for that Search box- that will be a lot trickier...

Try something like this:

style "thinentry"
{
   xthickness = 0
   ythickness = 0
   font_name = "Sans 6"
}
widget "whiskermenu-window*GtkEntry*" style "thinentry"

Change the font and more importantly the font size to suit. The smaller the font size the smaller the GtkEntry.

Misko_2083 · 2019-08-18 11:57:58

This is a GtkScrolledWindow.

style "darkscrwin"
{
    xthickness = 0 # Width borders.
    ythickness = 0
}
widget "whiskermenu-window*GtkScrolledWindow*" style "darkscrwin"

I mostly used this theme for gtk2 whisker menu:

style "darkback"
{
	bg[NORMAL] = "#404040"
	bg[ACTIVE] = "#606060"
	bg[PRELIGHT] = "#808080"
	fg[NORMAL] = "#ccc"
	fg[ACTIVE] = "#fff"
	fg[PRELIGHT] = "#fff"
}
widget "whiskermenu-window*" style "darkback"

style "darktree"
{
   base[NORMAL] = "#404040"
   base[ACTIVE] = "#606060"
   text[NORMAL] = "#ccc"
   text[ACTIVE] = "#fff"
  	engine "murrine" {
		gradient_shades	= { 1.25, 1.1, 0.9, 0.95 }

	}
}
widget "whiskermenu-window*TreeView*" style "darktree"

style "darkentry"
{
base[NORMAL] = "#404040"
   base[ACTIVE] = "#606060"
   text[NORMAL] = "#ccc"
   text[ACTIVE] = "#fff"
engine "murrine" {
             gradient_shades	= { 1.25, 1.1, 0.9, 0.95 }
                                   }
}
widget "whiskermenu-window*GtkEntry*" style "darkentry"

style "darkscrwin"
{
    xthickness = 0 # Width borders.
    ythickness = 0
base[NORMAL] = "#404040"
   base[ACTIVE] = "#606060"
   text[NORMAL] = "#ccc"
   text[ACTIVE] = "#fff"
engine "murrine" {
             gradient_shades	= { 1.25, 1.1, 0.9, 0.95 }
                                   }
}
widget "whiskermenu-window*GtkScrolledWindow*" style "darkscrwin"

Requires cairo based gtk2 engine (debian package gtk2-engines-murrine)

Last edited by Misko_2083 (2019-08-18 12:04:42)

Aravisian · 2019-08-18 20:13:27

ToZ wrote:

Aravisian wrote:
Now for that Search box- that will be a lot trickier...
Try something like this:
style "thinentry"
{
   xthickness = 0
   ythickness = 0
   font_name = "Sans 6"
}
widget "whiskermenu-window*GtkEntry*" style "thinentry"
Change the font and more importantly the font size to suit. The smaller the font size the smaller the GtkEntry.

Fascinating. You guys are amazing.
First, after reading Misko's post, I checked with Murrine. I know I had ensured Pixbuf already, I took Murrine for granted since I already know that my gtk2/gtk3 version of Azenis-Dark references Murrine in the css.(The rc references pixbuff)

gtk2-engines-murrine is already the newest version (0.98.2-0ubuntu2.2

I tried Toz' suggestion, first. In that, the search bar retained the same lngth but was about a 1/4 as tall. It was very tiny. Now we know that this works, I will play around with the settings and see what takes shape.
I then wiped the gtkrc-2.0 file clean and tried Misko's contribution.
His theme worked changing my background colors and changing the scrollbars.
I will change it back to my own, but with Misko's permission, I would like to retain a reserved copy of his theme in case I'd like to switch to it later. I like the look of it, very clean and straight.

I tend to go overboard- a bit ostentations with what I set up, then tone it down, later.
Later today when I have time, I will revert the frame.png file back to 100% opacity and try out Misko's "Borders" suggestion.

In the meantime, Toz's solution for the search entry has worked like a charm. I really envy your knowledge... Someday, I might get there.
EDIT: I have a lot to learn. Toz' solution sets the Height, but not the Width and Width is the thing I am trying to change, not the height.
Using references and examining my gtkrc file in theme gtk2 folder to see if I can find out how to work it.

Last edited by Aravisian (2019-08-18 21:09:52)

Aravisian · 2019-08-18 22:48:58

Aravisian wrote:

EDIT: I have a lot to learn. Toz' solution sets the Height, but not the Width and Width is the thing I am trying to change, not the height.
Using references and examining my gtkrc file in theme gtk2 folder to see if I can find out how to work it.

I really appreciate all the help, especially as this is a frivolous and non-essential exercise.
The above got me thinking... The effect I am looking for necessitates keeping the height of the entry window, but shortening the length of the entry window. Adjusting font from "Appearance-fonts"does shorten the window, but it also shortens the Categories window, as well which is no good.
But, what if I keep the height and instead of shortening the window, make it transparent as I did the frame?

This got me thinking about Misko's Background Image tweaks discussed earlier.
First, I tried using html transparency because... well, it is easier and was worth a shot. Setting bg to color code #ffffff00, #00ffffff, #000fff and other suggestions I found. None of those worked.
Then I moved on to attempting to create a background image for it. I decided first to see if I COULD create one, without trying for transparency.

style "darkentry"
          engine "pixmap"
            {
                   
                    image
                    {
                            function                = BOX
                            recolorable             = TRUE
                            state                   = PRELIGHT
                            file                    = "Untitled.png"
                            border                  = { 1, 1, 1, 1 }
                            stretch                 = FALSE
                    }
                    image
                    {
                            function                = BOX
                            recolorable             = TRUE
                            state                   = ACTIVE
                            file                    = "Untitled.png"
                            border                  = { 1, 1, 1, 1 }
                            stretch                 = FALSE
                    }
            }
widget "whiskermenu-window*GtkEntry*" style "darkentry"

It did not work- I probably did it wrong.

Last edited by Aravisian (2019-08-18 23:03:33)

Aravisian · 2019-08-19 17:59:52

Well, every single attempt at doing this in the ~/.gtkrc-2.0 file yielded no results. I tried a lot of different things, looked up a lot of DevHelp... Checked for errors and typoes... My terminal window was one very long run on "xfce4-panel -r" for a few pages.
I finally got fed up, went into the system theme Azenis-Dark folder, and added an image of the background in the gtk2/Entry folder. I then opened the theme gtkrc file and appended the lines that said file: "Entry/entry-border-fill-plain.png" with the name of the background image I made and solved it that way.
I then changed stretch to "FALSE" for those two fields.
In short, I cheated.
I also noticed that if I change the bg color of the treeview in ~/.gtkrc-2.0, it works only as long as the treeview is unpopulated. When I move to a category that populates the treeview, it changes the background back to theme default.
I prefer to do it in the gtkrc in home folder if possible so that it only effects the menu entry instead of all search entry fields... But close enough. With stretch set to 'false' it isn't really noticeable in other fields. I will see about tweaking it to perfection, later ensuring that all pixels line up (They don't currently). The image above was first attempt at making it work. But now that we have agreed it is sound in principle, it is just a matter of haggling over price...
Thank you Toz and Misko for all your help and pointers. Your gtkrc-2.0 hacks helped a great deal as they helped me to size things correctly and isolate those font settings to just the menu instead of the whole system.
I combined the background popup image of the menu and the command to open the menu in one bash script so both open together at the same time. That discolored spot you see on the panel next to the "A" icon is the emergency Off Button I put there in case that freezes up (Though it hasn't yet). I'll probably get rid of that, soon.

Last edited by Aravisian (2019-08-19 18:08:49)

Xfce Forum

Sub domains

#1 2019-08-17 11:21:35

(SOLVED) Specific Whisker Menu modifications

#2 2019-08-17 12:27:12

Re: (SOLVED) Specific Whisker Menu modifications

#3 2019-08-17 20:56:09

Re: (SOLVED) Specific Whisker Menu modifications

#4 2019-08-17 21:32:09

Re: (SOLVED) Specific Whisker Menu modifications

#5 2019-08-17 21:47:55

Re: (SOLVED) Specific Whisker Menu modifications

#6 2019-08-17 21:49:26

Re: (SOLVED) Specific Whisker Menu modifications

#7 2019-08-17 21:52:08

Re: (SOLVED) Specific Whisker Menu modifications

#8 2019-08-17 23:27:10

Re: (SOLVED) Specific Whisker Menu modifications

#9 2019-08-18 00:13:42

Re: (SOLVED) Specific Whisker Menu modifications

#10 2019-08-18 00:36:10

Re: (SOLVED) Specific Whisker Menu modifications

#11 2019-08-18 01:35:32

Re: (SOLVED) Specific Whisker Menu modifications

#12 2019-08-18 01:44:57

Re: (SOLVED) Specific Whisker Menu modifications

#13 2019-08-18 01:50:11

Re: (SOLVED) Specific Whisker Menu modifications

#14 2019-08-18 02:02:18

Re: (SOLVED) Specific Whisker Menu modifications

#15 2019-08-18 04:33:00

Re: (SOLVED) Specific Whisker Menu modifications

#16 2019-08-18 11:51:57

Re: (SOLVED) Specific Whisker Menu modifications

#17 2019-08-18 11:57:58

Re: (SOLVED) Specific Whisker Menu modifications

#18 2019-08-18 20:13:27

Re: (SOLVED) Specific Whisker Menu modifications

#19 2019-08-18 22:48:58

Re: (SOLVED) Specific Whisker Menu modifications

#20 2019-08-19 17:59:52

Re: (SOLVED) Specific Whisker Menu modifications

Board footer