How do I theme the xscreensaver unlock screen?

Question

How can I replace ugly screensaver unlock screen in Xubuntu 11.10?

Standard xscreensaver is very ugly.

Is there any themes for unlock screen?

Solution 1

The closest you can come to theming is to change the colours/fonts & date-time format. Anything more will probably need to recompile xscreensaver and change the source.

For example -

can be changed to -

how to

Using leafpad (leafpad ~/.Xresources) create/amend the file .Xresources located in the home folder.

Copy and paste the following for the first picture above:

xscreensaver.splash: false
 
!font settings
xscreensaver.Dialog.headingFont:        -*-dina-bold-r-*-*-12-*-*-*-*-*-*-*
xscreensaver.Dialog.bodyFont:           -*-dina-medium-r-*-*-12-*-*-*-*-*-*-*
xscreensaver.Dialog.labelFont:          -*-dina-medium-r-*-*-12-*-*-*-*-*-*-*
xscreensaver.Dialog.unameFont:          -*-dina-medium-r-*-*-12-*-*-*-*-*-*-*
xscreensaver.Dialog.buttonFont:         -*-dina-bold-r-*-*-12-*-*-*-*-*-*-*
xscreensaver.Dialog.dateFont:           -*-dina-medium-r-*-*-12-*-*-*-*-*-*-*
xscreensaver.passwd.passwdFont:         -*-dina-bold-r-*-*-12-*-*-*-*-*-*-*
 
!general dialog box (affects main hostname, username, password text)
xscreensaver.Dialog.foreground:         #ffffff
xscreensaver.Dialog.background:         #111111
xscreensaver.Dialog.topShadowColor:     #111111
xscreensaver.Dialog.bottomShadowColor:  #111111
xscreensaver.Dialog.Button.foreground:  #666666
xscreensaver.Dialog.Button.background:  #ffffff
 
!username/password input box and date text colour
xscreensaver.Dialog.text.foreground:    #666666
xscreensaver.Dialog.text.background:    #ffffff
xscreensaver.Dialog.internalBorderWidth:24
xscreensaver.Dialog.borderWidth:        20
xscreensaver.Dialog.shadowThickness:    2
 
!timeout bar (background is actually determined by Dialog.text.background)
xscreensaver.passwd.thermometer.foreground:  #ff0000
xscreensaver.passwd.thermometer.background:  #000000
xscreensaver.passwd.thermometer.width:       8
 
!datestamp format--see the strftime(3) manual page for details
xscreensaver.dateFormat:    %I:%M%P %a %b %d, %Y

Copy and paste the following for the second picture:

xscreensaver.splash: false
 
!font settings
xscreensaver.Dialog.headingFont:        -*-dina-bold-r-*-*-12-*-*-*-*-*-*-*
xscreensaver.Dialog.bodyFont:           -*-dina-medium-r-*-*-12-*-*-*-*-*-*-*
xscreensaver.Dialog.labelFont:          -*-dina-medium-r-*-*-12-*-*-*-*-*-*-*
xscreensaver.Dialog.unameFont:          -*-dina-medium-r-*-*-12-*-*-*-*-*-*-*
xscreensaver.Dialog.buttonFont:         -*-dina-bold-r-*-*-12-*-*-*-*-*-*-*
xscreensaver.Dialog.dateFont:           -*-dina-medium-r-*-*-12-*-*-*-*-*-*-*
xscreensaver.passwd.passwdFont:         -*-dina-bold-r-*-*-12-*-*-*-*-*-*-*
 
!general dialog box (affects main hostname, username, password text)
xscreensaver.Dialog.foreground:         #111111
xscreensaver.Dialog.background:         #ffffff
xscreensaver.Dialog.topShadowColor:     #111111
xscreensaver.Dialog.bottomShadowColor:  #111111
xscreensaver.Dialog.Button.foreground:  #ffffff
xscreensaver.Dialog.Button.background:  #666666
 
!username/password input box and date text colour
xscreensaver.Dialog.text.foreground:    #ffffff
xscreensaver.Dialog.text.background:    #666666
xscreensaver.Dialog.internalBorderWidth:24
xscreensaver.Dialog.borderWidth:        20
xscreensaver.Dialog.shadowThickness:    2
 
!timeout bar (background is actually determined by Dialog.text.background)
xscreensaver.passwd.thermometer.foreground:  #ff0000
xscreensaver.passwd.thermometer.background:  #000000
xscreensaver.passwd.thermometer.width:       8
 
!datestamp format--see the strftime(3) manual page for details
xscreensaver.dateFormat:    %I:%M%P %b %d

The run through the following steps to enable your changes:

xrdb -merge ~/.Xresources
killall xscreensaver
xscreensaver -no-splash &

_source

Solution 2

If you are familiar with svg image programmes (like Inkscape), you also could modify the logo to suit your own wishes. The logo is located in usr/share/pixmaps and is called xscreensaver.svg and xscreensaver.xpm.

However, there is a remark on changing the logo. See this thread for more info

Also, there are various important restrictions regarding the xpm file. I neglected those, resulting in a complete crash of my system. I will give it a try in the future, but so far i will stick to the flaming computer logo. See here for the restrictions, which I found only afterwards: http://www.improbability.net/xss/

And here is the process you have to follow to properly hard-code the images: http://www.inductiveload.com/posts/change-the-xscreensaver-icon/ or http://web.archive.org/web/20130309211615/http://www.inductiveload.com/posts/change-the-xscreensaver-icon

By the way, I suggest to change the font to something else, as not everyone has the "dina" font. It will then revert back to its original, failsafe font. Replacing "dina" with "arial" works for example, but the Ubuntu font doesn't seem to work.

Solution 3

Following fossfreedom's example, I chose the following settings in a a newly created ~/.Xresources file, and I found the result quite attractive (a dark-background theme with gentle blues):

xscreensaver.splash: false

!font settings
xscreensaver.Dialog.headingFont:        -*-georgia-bold-r-*-*-18-*-*-*-*-*-*-*
xscreensaver.Dialog.bodyFont:           -*-georgia-medium-r-*-*-18-*-*-*-*-*-*-*
xscreensaver.Dialog.labelFont:          -*-georgia-medium-r-*-*-18-*-*-*-*-*-*-*
xscreensaver.Dialog.unameFont:          -*-georgia-medium-r-*-*-18-*-*-*-*-*-*-*
xscreensaver.Dialog.buttonFont:         -*-georgia-bold-r-*-*-18-*-*-*-*-*-*-*
xscreensaver.Dialog.dateFont:           -*-georgia-medium-r-*-*-18-*-*-*-*-*-*-*
xscreensaver.passwd.passwdFont:         -*-georgia-bold-r-*-*-18-*-*-*-*-*-*-*

!general dialog box (affects main hostname, username, password text)
xscreensaver.Dialog.foreground:         #00efef
xscreensaver.Dialog.background:         #111111
xscreensaver.Dialog.topShadowColor:     #111111
xscreensaver.Dialog.bottomShadowColor:  #111111
xscreensaver.Dialog.Button.foreground:  #111111
xscreensaver.Dialog.Button.background:  #2040e0

!username/password input box and date text colour
xscreensaver.Dialog.text.foreground:    #2040e0
xscreensaver.Dialog.text.background:    #efefef
xscreensaver.Dialog.internalBorderWidth:36
xscreensaver.Dialog.borderWidth:        0
xscreensaver.Dialog.shadowThickness:    2

!timeout bar (background is actually determined by Dialog.text.background)
xscreensaver.passwd.thermometer.foreground:  #2040e0
xscreensaver.passwd.thermometer.background:  #2040e0
xscreensaver.passwd.thermometer.width:       0

!datestamp format--see the strftime(3) manual page for details
xscreensaver.dateFormat:    %I:%M%p - %a %b %d, %Y

Also with the changes loaded with:

xrdb -merge ~/.Xresources; killall xscreensaver; xscreensaver -no-splash &

Solution 4

Solution with Xresources is a good one, I use it myself, but you may as well try these:

XScreenSaver Lock Window Theming

View more solutions

Comments

[Peachy]

Welcome to Ask Ubuntu! Whilst this may theoretically answer the question, it would be preferable to include the essential parts of the answer here, and provide the link for reference.

[meawoppl]

Yuck, mostly dead links sadly.

[Murphy]

An excellent hint, but not supported for xscreensaver >= 5.0.

[user230910]

Please would you share a screenshot?