Table of Contents

Use custom stylesheets

Description

This is a simple script that enables the use of custom stylesheets (similar to the Stylish extension for Firefox).

@on_event   LOAD_COMMIT    spawn @scripts_dir/change_style.sh
@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("webaddress.com") {

and the tailing

 } 
* {
background: #262626 !important;
}

Script

#/bin/bash
 
# Author: Jurica Bradaric <jbradaric at gmail.com> 
# A simple script to use custom stylesheets for websites.
# Similar to the Stylish extension for Firefox.
# I hope someone finds it useful. All comments and suggestions
# are welcome.
 
XDG_DATA_HOME=${XDG_DATA_HOME:-"$HOME/.local/share/"}
 
# Set the path to the .css files
# Every custom css style must be in a file named web_address.css
# e.g. reddit.com.css
STYLE_PATH=$XDG_DATA_HOME/uzbl/userstyles
 
STYLESHEET_SET=0
 
for i in $STYLE_PATH/*.css; do
    stylesheet=$(basename $i '.css')
    if [[ "$UZBL_URI" =~ "${stylesheet}" ]]; then
        echo "set stylesheet_uri = file://${STYLE_PATH}/${stylesheet}.css" > "$UZBL_FIFO"
        STYLESHEET_SET=1
        break
    fi
done
 
if [ $STYLESHEET_SET -eq 0 ]; then
    echo "set stylesheet_uri = file://${STYLE_PATH}/default.css" > "$UZBL_FIFO"
fi
 
exit 0

Alternative method

Instead of extenal script one can use setting in uzbl config file, e.g.:

set conf.d = $XDG_CONFIG_HOME/uzbl
@on_event LOAD_COMMIT set stylesheet_uri = file://@conf.d/css/\@(s=\@<location.host>\@.css; [ -e @conf.d/css/$s ] || s=default.css; echo $s)\@

in this example styles are located in ./css under uzbl config path