You are Here:
Linux Lite 4.6 RC1 has been released. See the Release Announcements section for more information.



Customize Whisker Menu buttons

Author (Read 6459 times)

0 Members and 1 Guest are viewing this topic.

Customize Whisker Menu buttons
« on: July 24, 2014, 04:49:20 AM »
 

misko_2083

  • Gold Level Poster
  • *******
  • 686
    Posts
  • Reputation: 188
  • Linux Lite Member

  • CPU: Dual core Pentium E5700 3GHz

  • MEMORY: 3Gb

  • VIDEO CARD: GeForce GT 430
This is really interesting, if  anyone wants to experiment.
I figured out how to customize whisker menu buttons.
First enable compositing, then edit .gtkrc-2.0 and add this:
#.gtkrc-2.0
#Whisker

    style "darkback"
    {
          engine "pixmap"
            {
                   
                    }
                    image
                    {
                            function                = BOX
                            recolorable             = TRUE
                            state                   = PRELIGHT
                            file                    = "hover.png"
                            border                  = { 1, 1, 1, 1 }
                            stretch                 = FALSE
                    }
                    image
                    {
                            function                = BOX
                            recolorable             = TRUE
                            state                   = ACTIVE
                            file                    = "hover.png"
                            border                  = { 1, 1, 1, 1 }
                            stretch                 = FALSE
                    }
            }
            bg[NORMAL] = "#404040"
            bg[ACTIVE] = "#606060"
            bg[PRELIGHT] = "#808080"
            fg[NORMAL] = "#ccc"
            fg[ACTIVE] = "#fff"
            fg[PRELIGHT] = "#fff"
    }
    widget "whiskermenu-window*" style "darkback"
#end of file

Save this image to your home folder and rename it to hover.png

log out and then back in, and see what happpens with whisker.

Next: Instead of using only one hover.png try using 2 different
For PRELIGHT use hover.png and for ACTIVE hover1.png
Adwaita gtk2 theme works great with this.
 


Re: Customize Whisker Menu buttons
« Reply #1 on: July 24, 2014, 05:22:07 AM »
 

misko_2083

  • Gold Level Poster
  • *******
  • 686
    Posts
  • Reputation: 188
  • Linux Lite Member

  • CPU: Dual core Pentium E5700 3GHz

  • MEMORY: 3Gb

  • VIDEO CARD: GeForce GT 430
Use this .gtkrc-2.0
In the previous post I had one character on the wrong place  :-\ 

#.gtkrc-2.0
#Whisker

    style "darkback"
    {
          engine "pixmap"
            {
                   
                    image
                    {
                            function                = BOX
                            recolorable             = TRUE
                            state                   = PRELIGHT
                            file                    = "hover.png"
                            border                  = { 1, 1, 1, 1 }
                            stretch                 = FALSE
                    }
                    image
                    {
                            function                = BOX
                            recolorable             = TRUE
                            state                   = ACTIVE
                            file                    = "hover.png"
                            border                  = { 1, 1, 1, 1 }
                            stretch                 = FALSE
                    }
            }
            bg[NORMAL] = "#404040"
            bg[ACTIVE] = "#606060"
            bg[PRELIGHT] = "#808080"
            fg[NORMAL] = "#ccc"
            fg[ACTIVE] = "#fff"
            fg[PRELIGHT] = "#fff"
    }
    widget "whiskermenu-window*" style "darkback"
#end of file
 

Re: Customize Whisker Menu buttons
« Reply #2 on: July 24, 2014, 07:02:06 AM »
 

Jerry

  • Linux Lite Creator
  • Administrator
  • Platinum Level Poster
  • *****
  • 6942
    Posts
  • Country: nz
  • Reputation: 643
  • Linux Lite Member
    • Linux Lite OS

  • Linux Lite: 3.8 64bit

  • CPU: Intel Xeon Dual CPU's E5645 2.4GHz 12 Cores

  • MEMORY: 16Gb

  • VIDEO CARD: nVidia GeForce GTX 960
Nice, this will come in handy for people :)
 

Re: Customize Whisker Menu buttons
« Reply #3 on: July 25, 2014, 05:12:34 AM »
 

misko_2083

  • Gold Level Poster
  • *******
  • 686
    Posts
  • Reputation: 188
  • Linux Lite Member

  • CPU: Dual core Pentium E5700 3GHz

  • MEMORY: 3Gb

  • VIDEO CARD: GeForce GT 430
There is a way to change whisker menu background as well.  :)
Save this image to /home/hover.png

and this one to /home/background.png


Then you just add this to .gtkrc-2.0 in /home directory:

#Whisker
pixmap_path "/home"
    style "darkback"
    {
          engine "pixmap"
            {
                   
                    image
                    {
                            function                = BOX
                            recolorable             = TRUE
                            state                   = PRELIGHT
                            file                    = "hover.png"
                            border                  = { 1, 1, 1, 1 }
                            stretch                 = FALSE
                    }
                    image
                    {
                            function                = BOX
                            recolorable             = TRUE
                            state                   = ACTIVE
                            file                    = "hover.png"
                            border                  = { 1, 1, 1, 1 }
                            stretch                 = FALSE
                    }
            }
       bg_pixmap[NORMAL] = "background.png"
            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"
   
}
widget "whiskermenu-window*TreeView*" style "darktree"

 

Re: Customize Whisker Menu buttons
« Reply #4 on: July 25, 2014, 04:47:09 PM »
 

gold_finger

  • Documentation Writer
  • Platinum Level Poster
  • *****
  • 1095
    Posts
  • Country: us
  • Reputation: 323
  • Linux Lite Member

  • Linux Lite: 3.2 64bit

  • CPU: Intel Core2 Duo E7500 3.0GHz

  • MEMORY: 4Gb

  • VIDEO CARD: Intel 4 Series Integrated Graphics
misko_2083,

Very cool!  Didn't know this could be done.

Question.

I tried this out in a VM and was trying to get mine to look like the screenshot you posted in other area of forum.  I basically just copied what you posted here (only changed one color), but I can't seem to get the background to show up on right side.  Mine stays white as shown in this screenshot:




Here is copy of my .gtkrc-2.0 file:

Code: [Select]
gtk-menu-popdown-delay = 0
gtk-menu-bar-popup-delay = 0
gtk-enable-animations = 0
gtk-timeout-expand = 0

#.gtkrc-2.0
#Whisker
pixmap_path "/home"
    style "darkback"
    {
          engine "pixmap"
            {
                   
                    image
                    {
                            function                = BOX
                            recolorable             = TRUE
                            state                   = PRELIGHT
                            file                    = "hover.png"
                            border                  = { 1, 1, 1, 1 }
                            stretch                 = FALSE
                    }
                    image
                    {
                            function                = BOX
                            recolorable             = TRUE
                            state                   = ACTIVE
                            file                    = "hover.png"
                            border                  = { 1, 1, 1, 1 }
                            stretch                 = FALSE
                    }
            }
bg_pixmap[NORMAL] = "background-b.png"
            bg[NORMAL] = "#404040"
            bg[ACTIVE] = "#606060"
            bg[PRELIGHT] = "#808080"
            fg[NORMAL] = "#ccc"
            fg[ACTIVE] = "#fff"
            fg[PRELIGHT] = "#b12b2b"
    }
    widget "whiskermenu-window*" style "darkback"

    style "darktree"
    {

base[NORMAL] = "#404040"
base[ACTIVE] = "606060"
text[NORMAL] = "ccc"
text[ACTIVE] = "fff"

    }
    widget "whiskermenu-window*TreeView*" style "darktree"
#end of file

Do you have any idea where I went wrong?  What I am missing to get that white area to also be covered by the background pic?

Thanks in advance.
Try Linux Beginner Search Engine for answers to Linux questions.
 

Re: Customize Whisker Menu buttons
« Reply #5 on: July 25, 2014, 05:52:27 PM »
 

misko_2083

  • Gold Level Poster
  • *******
  • 686
    Posts
  • Reputation: 188
  • Linux Lite Member

  • CPU: Dual core Pentium E5700 3GHz

  • MEMORY: 3Gb

  • VIDEO CARD: GeForce GT 430
This depends on a gtk 2 theme. I used Adwaita as my system theme. Some others will allow you to use background on the right side.
 

Re: Customize Whisker Menu buttons
« Reply #6 on: July 25, 2014, 05:58:01 PM »
 

gold_finger

  • Documentation Writer
  • Platinum Level Poster
  • *****
  • 1095
    Posts
  • Country: us
  • Reputation: 323
  • Linux Lite Member

  • Linux Lite: 3.2 64bit

  • CPU: Intel Core2 Duo E7500 3.0GHz

  • MEMORY: 4Gb

  • VIDEO CARD: Intel 4 Series Integrated Graphics
Ok, thanks -- didn't realize that.  Will play around with it some more.
Try Linux Beginner Search Engine for answers to Linux questions.
 

Re: Customize Whisker Menu buttons
« Reply #7 on: July 25, 2014, 06:05:41 PM »
 

misko_2083

  • Gold Level Poster
  • *******
  • 686
    Posts
  • Reputation: 188
  • Linux Lite Member

  • CPU: Dual core Pentium E5700 3GHz

  • MEMORY: 3Gb

  • VIDEO CARD: GeForce GT 430
No problem.
By the way     
    base[ACTIVE] = "606060"
   text[NORMAL] = "ccc"
   text[ACTIVE] = "fff"
fix it to
     base[ACTIVE] = "#606060"
    text[NORMAL] = "#ccc"
   text[ACTIVE] = "#fff"
otherwise whisker menu will use your system theme :)
 

Re: Customize Whisker Menu buttons
« Reply #8 on: July 25, 2014, 06:13:00 PM »
 

gold_finger

  • Documentation Writer
  • Platinum Level Poster
  • *****
  • 1095
    Posts
  • Country: us
  • Reputation: 323
  • Linux Lite Member

  • Linux Lite: 3.2 64bit

  • CPU: Intel Core2 Duo E7500 3.0GHz

  • MEMORY: 4Gb

  • VIDEO CARD: Intel 4 Series Integrated Graphics
DING!  DING!  DING!

YOU GOT IT!  That minor mistake you caught was indeed the culprit.  Now it works perfectly.  Thanks a lot!
Try Linux Beginner Search Engine for answers to Linux questions.
 

Re: Customize Whisker Menu buttons
« Reply #9 on: July 27, 2014, 08:07:18 AM »
 

misko_2083

  • Gold Level Poster
  • *******
  • 686
    Posts
  • Reputation: 188
  • Linux Lite Member

  • CPU: Dual core Pentium E5700 3GHz

  • MEMORY: 3Gb

  • VIDEO CARD: GeForce GT 430
I'm glad that helped.  :D
 


Tags:
 


Linux Lite 4.6 RC1 has been released. See the Release Announcements section for more information.