X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=doc%2FTheming.html;h=6b5dac35cc04317dbace98f895adad688ce4ca88;hb=807cade64c571929dc19afe3d44787c5abe84f57;hp=a751eb98046e14990dc84e366963c71a0889218b;hpb=bb91a8c6e8649d482a552b64c6a0c8e65c6becd7;p=github%2Fshaarli%2FShaarli.git diff --git a/doc/Theming.html b/doc/Theming.html index a751eb98..6b5dac35 100644 --- a/doc/Theming.html +++ b/doc/Theming.html @@ -4,53 +4,78 @@ - Shaarli - Theming + Shaarli â Theming - +

Theming

User CSS

Foreword

There are two ways of customizing how Shaarli looks:

by using a custom CSS to override Shaarli's CSS
by using a full theme that provides its own RainTPL templates, CSS and Javascript resources

Custom CSS

Shaarli's appearance can be modified by adding CSS rules to:

Shaarli's apparence can be modified by editing CSS rules in inc/user.css. This file allows to override rules defined in the main inc/shaarli.css (only add changed rules), or define a whole new theme.
Do not edit inc/shaarli.css! Your changes would be overriden when updating Shaarli.
Some themes are available at https://github.com/shaarli/shaarli-themes.
Shaarli < v0.9.0: inc/user.css
Shaarli >= v0.9.0: data/user.css

RainTPL template

This file allows overriding rules defined in the template CSS files (only add changed rules), or define a whole new theme.

Note: Do not edit tpl/default/css/shaarli.css! Your changes would be overridden when updating Shaarli.

Themes

WARNING - This feature is currently being worked on and will be improved in the next releases. Experimental.

Installation:

Find the template you'd like to install (see the list of available templates|Theming#community-themes--templates)
Find it's git clone URL or download the zip archive for the template.
In your Shaarli tpl/ directory, run git clone https://url/of/my-template/ or unpack the zip archive. +
find a theme you'd like to install
copy or clone the theme folder under tpl/<a_sweet_theme>
enable the theme:
- There should now be a my-template/ directory under the tpl/ dir, containing directly all the template files.
- Shaarli < v0.9.0: edit data/config.json.php and set the value of raintpl_tpl to the new theme name:
  +"raintpl_tpl": "tpl\/my-template\/"
- Shaarli >= v0.9.0: select the theme through the Tools page

Edit data/config.php to have Shaarli use this template, e.g.

$GLOBALS['config'['RAINTPL_TPL'] = 'tpl/my-template/';]('RAINTPL_TPL']-=-'tpl/my-template/';.html)

Community themes & templates

Community CSS & themes

Custom CSS

mrjovanovic/serious-theme-shaarli - A serious theme for Shaarli
shaarli/shaarli-themes

Themes

AkibaTech/Shaarli Superhero Theme - A template/theme for Shaarli
alexisju/albinomouse-template - A full template for Shaarli
ArthurHoaro/shaarli-launch - Customizable Shaarli theme
dhoko/ShaarliTemplate - A template/theme for Shaarli
kalvn/shaarli-blocks - A template/theme for Shaarli
kalvn/Shaarli-Material - A theme (template) based on Google's Material Design for Shaarli, the superfast delicious clone.
kalvn/Shaarli-Material - A theme (template) based on Google's Material Design for Shaarli, the superfast delicious clone
ManufacturaInd/shaarli-2004licious-theme - A template/theme as a humble homage to the early looks of the del.icio.us site

Shaarli forks

misterair/Limonade - A fork of (legacy) Shaarli with a new template
Vinm/Blue-theme-for Shaarli - A template/theme for Shaarli (unmaintained, compatibility unknown)
vivienhaese/shaarlitheme - A Shaarli fork meant to be run in an openshift instance

Example installation: AlbinoMouse template

Example installation: AlbinoMouse theme

With the following configuration:

Apache 2 / PHP 5.6
user sites are enabled, e.g. /home/user/public_html/somedir is served as http://localhost/~user/somedir
http is the name of the Apache user

$ cd ~/public_html
+$ cd ~/public_html
 
 # clone repositories
-$ git clone https://github.com/shaarli/Shaarli.git shaarli
-$ pushd shaarli/tpl
-$ git clone https://github.com/alexisju/albinomouse-template.git
-$ popd
+$ git clone https://github.com/shaarli/Shaarli.git shaarli
+$ pushd shaarli/tpl
+$ git clone https://github.com/alexisju/albinomouse-template.git
+$ popd
 
 # set access rights for Apache
-$ chgrp -R http shaarli
-$ chmod g+rwx shaarli shaarli/cache shaarli/data shaarli/pagecache shaarli/tmp
+$ chgrp -R http shaarli
+$ chmod g+rwx shaarli shaarli/cache shaarli/data shaarli/pagecache shaarli/tmp

Get config written:

go to the freshly installed site
fill the install form
log in to Shaarli

Edit Shaarli's configuration|Shaarli configuration:

# the file should be owned by Apache, thus not writeable => sudo
-$ sudo sed -i s=tpl=tpl/albinomouse-template=g shaarli/data/config.php

Edit Shaarli's configuration|Shaarli configuration:

# the file should be owned by Apache, thus not writeable => sudo
+$ sudo sed -i s=tpl=tpl/albinomouse-template=g shaarli/data/config.php