Customizing gnome 3?

A day like today, I was googling, trying to find out how to customize the gnome3 interface, and i found this post: http://joneslee85.wordpress.com/2010/02/28/howto-customize-gnome-shell-theme/

Although this way doesn't work relatively to each session (whatever you modify using this way, you will see all changes in each session), I done it, ah i want to show you how I done it at my way.

This post advertises you that this way of doing is kinda difficult if you don't like to program, so I will try to explain carefully.

All the necesary files are in

• /usr/share/gnome-shell/js/
• /usr/share/gnome-shell/theme/

As you see, gnome3 is based on web technology, it uses javascript and css. inside the /theme folder you can find  images and the file gnome-shell.css, you can modify some parameters like:

• alignment
• text witdh
• text font
• text size
• padding
• etc

Exploring the folders:

Graphically (warning: doing this could be harmful to the system, please be careful when manipulating files):

sudo nautilus /usr/share/gnome-shell
OR
su -c 'nautilus /usr/share/gnome-shell' -

Terminal:

su -
cd /usr/share/gnome-shell

 At any of those ways, you can explore what is inside the /theme or /js folders. Inside the /theme folder you'll find some pictures in .svg format (that means you can modify those pictures with a vector-design program like inkscape) and the .css file as I said above. Let's open this file.

Graphically

Terminal

 

Let's modify the font size of the top panel, look for these lines:

You can change all those parameters from the panel with this css, but you'll see the changes when you re-open your session. In this example, I modified the font size, because I like small fonts XD

You can modify almost everything about gnome2 layout with css, and the behaviour with the javascript files. I'll find out later how to work with gnome3 javascript.

I hope you liked this post. :)