Customizing the GNOME Shell

Transcription

Customizing the GNOME Shell
Customizing the GNOME Shell
Customizing the GNOME Shell
Finnbarr P. Murphy
([email protected])
ly
In this post I will share a modicum of what I have learned to date about customizing the new
GNOME 3 Shell. This is based on the GNOME Shell in Fedora 15 Alpha. The good news is that the
GNOME Shell is highly configurable. The bad news is that some of this information may become
out-of-date quite quickly as the GNOME Shell is still somewhat of a moving target even though it
is supposedly close to release.
Fo
r
pe
rs
o
nn
a
lu
se
on
Here is what the GNOME Shell looks like in Fedora 15 Alpha with all updates applied as of March
23rd 2011:
By the way, that is a really beautiful wallpaper! I am glad that cooler heads prevailed and the
Fedora Project has finally decided to go with its own custom wallpaper rather than use the default
upstream GNOME Shell wallpaper.
Here is what the Applications Overview looks like:
10-26-2016
Copyright 2004-2016 Finnbarr P. Murphy. All rights reserved.
1/15
lu
se
on
ly
Customizing the GNOME Shell
Fo
r
pe
rs
o
nn
a
Here is what a GNOME terminal window looks like:
This is the default theme which, by the way, is called Adwaita. This post will show you how to
make the titlebar smaller so that it does not take up so much space on the screen, add back in the
minimize and maximize buttons, color the title bars, and more.
GNOME 3 contains some major changes with respect to persistent application settings data. The
GConf CORBA-based configuration system is no longer used; it has been replaced by GSettings.
GSettings is agnostic about its backend; dconf is merely one backend. Key names are restricted to
lowercase characters, numbers and dashes (-). Names must begin with a character, must be 32
10-26-2016
Copyright 2004-2016 Finnbarr P. Murphy. All rights reserved.
2/15
Customizing the GNOME Shell
characters or less in length, must not end with a dash and must not contain consecutive dashes.
GSettings stores its schemas in a binary format, unlike GConf which uses XML files. Fedora 14
was the first Fedora release to include GSettings. See the glib-compile-schemas manpage for
further information.
A new command line utility gsettings, which replaces gconftool-2, is provided to enable you to
easily interface with GSettings.
on
se
Show this information
List installed schemas
List relocatable schemas
List keys in a schema
List children of a schema
List keys and values, recursively
Queries the range of a key
Get the value of a key
Set the value of a key
Reset the value of a key
Check if a key is writable
Watch for changes
lu
Commands:
help
list-schemas
list-relocatable-schemas
list-keys
list-children
list-recursively
range
get
set
reset
writable
monitor
ly
$ gsettings
Usage:
gsettings COMMAND [ARGS...]
Use 'gsettings help COMMAND' to get detailed help.
Fo
r
pe
rs
o
nn
a
$ gsettings list-schemas
org.gnome.nautilus.desktop
org.gnome.color-manager
org.gnome.gedit.plugins.filebrowser.nautilus
org.gnome.settings-daemon.peripherals.wacom
org.gnome.Empathy.hints
org.gnome.settings-daemon.peripherals.touchpad
org.gnome.settings-daemon.plugins.keyboard
org.gnome.Nautilus.Sendto
org.gnome.FileRoller.Dialogs.BatchAdd
org.freedesktop.Telepathy.Logger
org.gnome.yelp
....
....
org.gnome.gcalctool
org.gnome.settings-daemon.peripherals.wacom.eraser
org.gnome.FileRoller.General
org.gnome.libgnomekbd.preview
org.gnome.gnome-system-log
org.gnome.libgnomekbd.keyboard
org.webkitgtk-1.0
org.gnome.gedit.state
org.gnome.system.proxy
org.gnome.gnome-system-monitor.disktreenew
org.gnome.eog.ui
org.gnome.gnome-screenshot
org.gnome.settings-daemon.plugins
org.gnome.gedit.preferences.encodings
org.gnome.Bluetooth.nst
org.gnome.desktop.lockdown
org.gnome.crypto.cache
org.gnome.settings-daemon.peripherals.wacom.stylus
org.gnome.DejaDup
org.gnome.eog.plugins
org.gnome.gnome-system-monitor.proctree
org.gnome.eog.fullscreen
org.gnome.settings-daemon.plugins.housekeeping
10-26-2016
Copyright 2004-2016 Finnbarr P. Murphy. All rights reserved.
3/15
Customizing the GNOME Shell
org.gnome.FileRoller.Dialogs.Add
org.gnome.desktop.thumbnailers
org.gnome.Empathy.sounds
org.gnome.desktop.a11y.keyboard
$ gsettings list-schemas | grep shell
org.gnome.shell
org.gnome.shell.clock
org.gnome.shell.recorder
org.gnome.shell.calendar
on
ly
$ gsettings list-keys org.gnome.shell
command-history
development-tools
disabled-extensions
disabled-open-search-providers
enable-app-monitoring
favorite-apps
looking-glass-history
lu
$ gsettings list-keys org.gnome.shell.clock
show-date
show-seconds
se
As an example, here is how to enable the digital clock on the top panel to show the date and
seconds:
org.gnome.shell.clock show-date true
org.gnome.shell.clock show-seconds true
pe
rs
o
$ gsettings set
$ gsettings set
nn
a
# note the failure if you are root!
# gsettings set org.gnome.shell.clock show-date true
**
GLib-GIO:ERROR:gdbusconnection.c:2279:initable_init: assertion failed: (connection->initia
lization_error == NULL)
Aborted (core dumped)
Here is how to list all the settings for the GNOME Shell:
Fo
r
$ gsettings list-recursively org.gnome.shell
org.gnome.shell command-history ['r', 'lg', '?', 'ff', 'lg', 'js', '?', 're', 'r', 'comman
d-history', 'ch', 'lg', 'lgh', 'b', 'r', 'd', 'ff', 'r', 'GSettings', 'GSetting', 'r', 've
rsion', 'ver', 'v']
org.gnome.shell development-tools true
org.gnome.shell disabled-extensions @as []
org.gnome.shell disabled-open-search-providers @as []
org.gnome.shell enable-app-monitoring true
org.gnome.shell favorite-apps ['gnome-terminal.desktop', 'mozilla-firefox.desktop', 'gnome
-baobab.desktop', 'gimp.desktop', 'gnome-eog.desktop', 'gnome-screenshot.desktop']
org.gnome.shell looking-glass-history @as []
org.gnome.shell.calendar show-weekdate false
org.gnome.shell.clock show-date true
org.gnome.shell.clock show-seconds true
org.gnome.shell.recorder file-extension 'webm'
org.gnome.shell.recorder framerate 15
org.gnome.shell.recorder pipeline ''
While the gsettings utility enables you to modify certain properties of the GNOME Shell, it does
not enable you to really customize the current theme. So do not throw away gconftool-2 just yet!
There are a whole range of settings that gsettings does not have access to. For instance you can
add back the window minimize and maximize buttoms as follows:
10-26-2016
Copyright 2004-2016 Finnbarr P. Murphy. All rights reserved.
4/15
Customizing the GNOME Shell
gconftool-2 --set /desktop/gnome/shell/windows/buttom_layout --type string :minimize,maxim
ize,close
pe
rs
o
nn
a
lu
se
on
ly
You will have to log out and log back in for the change to take place. Alternatively you can use the
Configuration Editor (gconf-editor) which, if installed, is available under Applications, System
Tools.
Another method is to use dconf-editor which you may need to load on your system as it is not
installed by default. However, be warned, dconf and dconf-editor both seem to be highly unstable
as of the date of this post. Worse still, absolutely no documentation or manpages are currently
provided for dconf or dconf-editor.
Fo
r
Alternatively, you can customize a small subset of the GNOME Shell using the new Tweak Tool (
gnome-tweak-tool.)
10-26-2016
Copyright 2004-2016 Finnbarr P. Murphy. All rights reserved.
5/15
se
on
ly
Customizing the GNOME Shell
nn
a
lu
Astute readers will notice that my version of gnome-tweak-tool is different than the default OOTB
tool. That is because I edited /usr/share/gnome-tweak-tool/shell.ui and changed a few property
settings such as:
<property name="title" translatable="yes">GNOME Tweak Tool</property>
<property name="resizable">True</property>
pe
rs
o
This utility, like many others, does not show up in the Application Overview. You have to use the
Searchbar to access it.
Incidently, Tweak Tool can be used to add minimize and maximize buttons to windows. See the
above screenshot. Observe also the different theme and the dark colored titlebars. All will be
revealed! Just keep reading.
Fo
r
As stated previously, the default GNOME Shell theme is Adwaita. You can modify this theme by
editing /usr/share/themes/Adwaita/metacity-1/metacity-theme-3.xml. One of the more interesting
sections of this configuration file is:
<frame_geometry name="normal" title_scale="medium" rounded_top_left="4" rounded_top_right="
4">
<distance name="left_width" value="1" />
<distance name="right_width" value="1" />
<distance name="bottom_height" value="2" />
<distance name="left_titlebar_edge" value="0"/>
<distance name="right_titlebar_edge" value="0"/>
<distance name="title_vertical_pad" value="13"/>
<border name="title_border" left="10" right="10" top="1" bottom="1"/>
<border name="button_border" left="0" right="0" top="1" bottom="3"/>
<aspect_ratio name="button" value="1"/>
</frame_geometry>
If you are already using the GNOME Shell, you probably have noticed that it is difficult to grab the
frame of a window to stretch it. This is because the frame is only 1 pixel wide at the sides and 2
10-26-2016
Copyright 2004-2016 Finnbarr P. Murphy. All rights reserved.
6/15
Customizing the GNOME Shell
pixels in height on the bottom. To make windows easier to grab, I suggest you change each of
these values to 3, 3 and 5 respectively. If you want a less intrusive titlebar, I suggest you change
the value of title_vertical_pad to 8.
<distance
<distance
<distance
<distance
name="left_width" value="3" />
name="right_width" value="3" />
name="bottom_height" value="5" />
name="title_vertical_pad" value="8"/>
The other sections of this file that you may wish to customize are the color constants:
pe
rs
o
nn
a
lu
se
on
ly
<!-- meaningfull constants -->
<constant name="C_border_focused" value="blend/#000000/gtk:bg[NORMAL]/0.6" />
<constant name="C_border_unfocused" value="blend/#000000/gtk:bg[NORMAL]/0.8" />
<constant name="C_border_attached_focused" value="blend/#000000/gtk:bg[NORMAL]/0.4" />
<constant name="C_titlebar_focused_hilight" value="gtk:base[NORMAL]" />
<constant name="C_titlebar_unfocused" value="blend/gtk:base[NORMAL]/gtk:bg[NORMAL]/0.4" />
<constant name="C_title_focused" value="blend/gtk:fg[NORMAL]/gtk:bg[NORMAL]/0.1" />
<constant name="C_title_focused_hilight" value="gtk:base[NORMAL]" />
<constant name="C_title_unfocused" value="blend/gtk:text[NORMAL]/gtk:bg[NORMAL]/0.9" />
<!-- color of the button icons -->
<constant name="C_icons_focused" value="gtk:text[SELECTED]" />
<constant name="C_icons_focused_pressed" value="#ffffff" />
<constant name="C_icons_unfocused" value="blend/gtk:text[NORMAL]/gtk:bg[NORMAL]/0.9" />
<constant name="C_icons_unfocused_prelight" value="gtk:bg[NORMAL]" />
<constant name="C_icons_unfocused_pressed" value="blend/#000000/gtk:bg[NORMAL]/0.7" />
<constant name="D_icons_unfocused_offset" value="2" /> <!-- offset of the unfocused icons
-->
<constant name="D_icons_shrink" value="1" /> <!-- increasing this value makes the icons in
buttons smaller -->
<constant name="D_icons_grow" value="0" /> <!-- increasing this value makes the icons in b
uttons bigger -->
If you make the following changes to metacity-theme-3.xml:
Fo
r
....
<constant name="C_border_focused" value="#000064" />
<constant name="C_border_unfocused" value="#0052FF" />
<constant name="C_border_attached_focused" value="#000064" />
<constant name="C_titlebar_focused_hilight" value="#000064" />
<constant name="C_titlebar_unfocused" value="#0052FF" />
....
<draw_ops name="titlebar_fill_focused_alt">
<gradient type="vertical" x="0" y="0" width="width" height="height">
<color value="#6B6EAC"/>
<color value="#000064"/>
</gradient>
</draw_ops>
....
<draw_ops name="titlebar_fill_unfocused">
<gradient type="vertical" x="0" y="0" width="width" height="height">
<color value="#7096E3"/>
<color value="#0052FF"/>
</gradient>
</draw_ops>
....
and reload the Shell, you will have colored window titlebars and frames:.
10-26-2016
Copyright 2004-2016 Finnbarr P. Murphy. All rights reserved.
7/15
lu
se
on
ly
Customizing the GNOME Shell
nn
a
Notice the icons on the top right hand corner of your screen. These are know as status icons and
are displayed by a number of utilities that provide some sort of status including a11y, display,
keyboard, volume, bluetooth, network, battery’. The icons are known as SYMBOLIC icons. If you
want to display color icons instead of symbolic icons, edit panelMenu.js and change SYMBOLIC to
FULLCOLOR on the highlighted line shown below:
Fo
r
pe
rs
o
SystemStatusButton.prototype = {
__proto__: Button.prototype,
_init: function(iconName,tooltipText) {
Button.prototype._init.call(this, 0.0);
this._iconActor = new St.Icon({ icon_name: iconName,
icon_type: St.IconType.SYMBOLIC,
style_class: 'system-status-icon' });
this.actor.set_child(this._iconActor);
this.setTooltip(tooltipText);
},
Currently, there is no built-in mechanism for changing GNOME Shell themes. I understand that
this functionality is planned for inclusion in a future version of the GNOME Shell. However, it is
quite easy to change the theme if you are careful. As an example, I will walk you though the steps
to use the GNOME Shell Dark Glass theme designed by the English digital artist Sean Wilson
together with the refFresh 11 wallpaper (background) by the artist Salman Arif.
The number of files in the new theme is surprisingly small:
$ ls
calendar-arrow-left.svg
calendar-arrow-right.svg
calendar-today.svg
close.svg
close-window.svg
corner-ripple.png
dash-placeholder.svg
10-26-2016
scroll-button-down.png
scroll-button-up-hover.png
scroll-button-up.png
section-more-open.svg
section-more.svg
separator-white.png
toggle-off-intl.svg
Copyright 2004-2016 Finnbarr P. Murphy. All rights reserved.
8/15
Customizing the GNOME Shell
filter-selected.svg
gnome-shell.css
hover-indicator.svg
process-working.png
running-indicator.svg
scroll-button-down-hover.png
toggle-off-us.svg
toggle-on-intl.svg
toggle-on-us.svg
ws-switch-arrow-down.svg
ws-switch-arrow-up.svg
Download the theme and unzip it in a temporary directory. A subdirectory called theme will be
created and it will contain the above files. Back up the contents of the current GNOME Shell
theme directory /usr/share/gnome-shell/theme. Then copy the contents of the theme subdirectory
to /usr/share/gnome-shell/theme.
1280x1024.jpg
1280x960.jpg
1600x1200.jpg
1920x1080.jpg
2560x1600.jpg
1280x720.jpg
1280x800.jpg
1366x768.jpg
1440x900.jpg
1600x900.jpg
1680x1050.jpg
1920x1200.jpg
1920x1440.jpg
2560x1920.jpg
iPhone.jpg
se
$ ls *.jpg
1024x640.jpg
neHD.jpg
1024x768.jpg
1152x864.jpg
on
ly
Download the wallpaper (reFresh_II_by_salmanarif.rar) and unpack it. You may have to install the
rar utility! It does not ship with Fedora but is available from RPM Fusion and elsewhere. There are
a number of different wallpaper files in the archive:
Zu
lu
Each image is sized for a particular display geometry. Install the appropriate wallpaper file using
the background tool which is available in the GNOME Shell Settings panel.
nn
a
The new wallpaper is stored in ~/.cache/gnome-control-center/backgrounds:
pe
rs
o
$ gsettings list-recursively org.gnome.desktop.background
org.gnome.desktop.background color-shading-type 'solid'
org.gnome.desktop.background draw-background true
org.gnome.desktop.background picture-filename '/home/fpm/.cache/gnome-control-center/backg
rounds/6ccf207fc0f4eac6b1e5e9c9dbe93c93ffaea4c1059d6cf36219dbe7380e2d19'
org.gnome.desktop.background picture-opacity 100
org.gnome.desktop.background picture-options 'zoom'
org.gnome.desktop.background primary-color '#0a0a19192c2c'
org.gnome.desktop.background secondary-color '#351b74c1c77d'
org.gnome.desktop.background show-desktop-icons false
Fo
r
For details of standard names and colors, see /usr/share/themes/Adwaita/gtk-3.0/gtk.css. You can
overwrite such names and colors using your own custom CSS file, i.e. ~/.config/gtk-3.0/gtk.css.
When you restart the GNOME Shell, you should see the following screen:
10-26-2016
Copyright 2004-2016 Finnbarr P. Murphy. All rights reserved.
9/15
lu
se
on
ly
Customizing the GNOME Shell
Fo
r
pe
rs
o
nn
a
This is what your Applications Overview should look like:
Note that the previous customizations to metacity-theme-3.xml are still in place:
10-26-2016
Copyright 2004-2016 Finnbarr P. Murphy. All rights reserved.
10/15
lu
se
on
ly
Customizing the GNOME Shell
Fo
r
pe
rs
o
nn
a
This is actually a very nice theme and quite easy on the eyes. It has become my default theme for
now.
I particularly like how the search tool output is themed.
10-26-2016
Copyright 2004-2016 Finnbarr P. Murphy. All rights reserved.
11/15
lu
se
on
ly
Customizing the GNOME Shell
nn
a
By the way, as stated earlier, Alt-F2 r (or Alt-F2 restart) reloads (restarts) the GNOME Shell. If
you just want to load a new GNOME Shell theme, it is faster to use Alt-F2 rl. This only calls the
JavaScript function that reloads the shell theme.
pe
rs
o
Turning now to the question of icon customization. To configure the layout of the application icons
in the GNOME Shell, you have to modify /usr/share/gnome-shell/theme/gnome-shell.css. Note that
the contents of this file may vary as it is dependent on the particular theme that you are using. In
the case of the Dark Glass theme, here are the modifications necessary to reduce the size and
layout of the displayed icons by 50% in Applications Overview.
Fo
r
.icon-grid {
spacing: 18px;
-shell-grid-item-size: 35px;
}
.all-app .icon-grid {
-shell-grid-item-size: 59px;
}.
all-app .overview-icon {
icon-size: 48px;
}
/* was 36px */
/* was 70px */
/* was 118px */
/* was 96px */
Here is what Applications Overview looks like when the GNOME Shell is restarted.
10-26-2016
Copyright 2004-2016 Finnbarr P. Murphy. All rights reserved.
12/15
se
on
ly
Customizing the GNOME Shell
nn
a
lu
By the way, with this theme, running applications are indicated by a light pane around them
instead a glow behind the application name. I will leave it as an exercise for you to reduce the size
of the displayed application name.
What if I want the GNOME Shell to display a different icon for the GNOME Tweak Tool? There are
two places you need to modify. The first is /usr/share/applications/gnome-tweak-tool.desktop:
Fo
r
pe
rs
o
[Desktop Entry]
Name=Tweak Advanced Settings
Icon=preferences-system
Exec=gnome-tweak-tool
Terminal=false
Type=Application
StartupNotify=true
Categories=GNOME;GTK;Settings;
OnlyShowIn=GNOME;
I am going to change the Icon key-value pair to preferences-desktop-personal. You can see the
available icons if you look in /usr/share/icons. Which icon file is actually selected depends on the
current icon theme and the icon lookup mechanism. Icon lookup is first done in the current theme,
then recursively in each of the current theme’s parents and finally in the hicolor default theme. As
soon as an icon of any size is matched, the search stops. See the Icon Theme specification for
further information.
Icon information is also stored in a property named icon_name
/usr/share/gnome-tweak-tool/shell.ui. This also needs to be changed
preferences-desktop-personal. When you have modified these two files, you need to run
in
to
# desktop-file-validate /usr/share/applications/gnome-tweak-tool.desktop
Incidently if you change:
10-26-2016
Copyright 2004-2016 Finnbarr P. Murphy. All rights reserved.
13/15
Customizing the GNOME Shell
Categories=GNOME;GTK;Settings;
to
Categories=GNOME;GTK;Utilities;
in /usr/share/applications/gnome-tweak-tool.desktop, the GNOME Tweak Tool will be displayed in
the Application Overview. By design, applications marked Settings are not displayed in the
Application Overview.
se
nn
a
lu
#!/bin/bash
find /usr/share/icons -maxdepth 1 -type d | \
while read -r THEME; do
if [[ -f "$THEME/index.theme" ]]; then
echo "Updating $THEME cache"
gtk-update-icon-cache -f -q "$THEME"
fi
done
on
ly
You can also add your own icon for an application to one of the icon themes under /usr/share/icons.
If you do this, you need to update the icon cache using gtk-update-icon-cache before the icon is
available for use. Here is a simple shell script which updates all the icon caches for you.
pe
rs
o
Suppose you want to remove the Available and Busy menu options from the user menu (the menu
under your name.) Just edit /usr/share/gnome-shell/js/ui/statusMenu.js and comment out the
following lines in _createSubMenu:
Fo
r
item = new PopupMenu.PopupImageMenuItem(_("Available"), 'user-available');
item.connect('activate', Lang.bind(this, this._setPresenceStatus, GnomeSession.Pre
senceStatus.AVAILABLE));
this.menu.addMenuItem(item);
this._presenceItems[GnomeSession.PresenceStatus.AVAILABLE] = item;
item = new PopupMenu.PopupImageMenuItem(_("Busy"), 'user-busy');
item.connect('activate', Lang.bind(this, this._setPresenceStatus, GnomeSession.Pre
senceStatus.BUSY));
this.menu.addMenuItem(item);
this._presenceItems[GnomeSession.PresenceStatus.BUSY] = item;
item = new PopupMenu.PopupSeparatorMenuItem();
this.menu.addMenuItem(item);
and reload your GNOME Shell.
Turning to the issue of customizing fonts. The default font for GNOME 3 is Cantarell, a new
contemporary sans serif open font specially commissioned by GNOME. The current version of
Cantarell does not cover all the supported languages in GNOME. This means that, depending on
your particular locale settings, you may fallback to another font.
You can use Fontik to tweak and configure some font properties. Other ways of tweating fonts
include dconf-editor and gsettings. The GNOME Tweak Tool also enables you to easily change
some font settings.
$ gsettings get org.gnome.desktop.interface font-name
'Cantarell 11'
10-26-2016
Copyright 2004-2016 Finnbarr P. Murphy. All rights reserved.
14/15
Customizing the GNOME Shell
$
$
$
$
gsettings set org.gnome.desktop.interface font-name "Canterell 12"
gsettings set org.gnome.desktop.interface monospace-font-name "Monospace 12"
gsettings set org.gnome.desktop.interface document-font-name "Sans 12"
settings set org.gnome.desktop.interface text-scaling-factor "1.1"
Finally, you can no longer customize the screensaver in GNOME 3. When your screen is locked all
you get is a black screen with the clock, a lock symbol and your name at the top of the screen.
There are plans to remove gnome-screensaver in GNOME 3.2 and putting its functionality partially
in the GNOME Shell and the remainder in gnome-session or gnome-settings-daemon. It may then
be possible to write a themed Clutter-based screensaver extension for GNOME Shell.
on
ly
You probably have noticed that the GNOME Shell supports window tiling. By this, I mean that you
can tile a window by dragging it to either the left or right edges of the screen. Typically nearly half
the window must go over the edge before a light blue rectangle outlining the tile appears. If you
release the window at that time, the window will be automatically tiled to match the outline. If you
dislike this feature, you can turn it off using gconf-editor. Set
desktop->gnome->shell->windows->edge_tiling to FALSE.
lu
se
Well, it is time to wrap up this post. Obviously there is a lot more to the subject of customizing the
new GNOME Shell but I have tried to cover the basics. Unfortunately, at present, there is a dearth
of good accurate information on the underpinnings of the GNOME Shell out there on the Internet
so I cannot point you to any reference material on the subject. Hopefully the GNOME developers
will provide complete documentation in the future.
Fo
r
pe
rs
o
nn
a
P.S. If you have found this post via an Internet search, you might be interested to know that I have
written a number of other posts in this blog about configuring and extending the GNOME 3 Shell.
Also you can download all my GNOME Shell extensions from the GNOME Shell Extensions area of
my website.
10-26-2016
Copyright 2004-2016 Finnbarr P. Murphy. All rights reserved.
15/15