aboutsummaryrefslogtreecommitdiffhomepage
path: root/doc/html/Theming/index.html
diff options
context:
space:
mode:
authornodiscc <nodiscc@gmail.com>2017-01-26 18:52:54 +0100
committernodiscc <nodiscc@gmail.com>2017-06-18 00:19:49 +0200
commit53ed6d7d1e678d7486337ce67a2f17b30bac21ac (patch)
treef8bef0164a70bd03d2b9781951c01bdd018f1842 /doc/html/Theming/index.html
parentd5d22a6d07917865c44148ad76f43c65a929a890 (diff)
downloadShaarli-53ed6d7d1e678d7486337ce67a2f17b30bac21ac.tar.gz
Shaarli-53ed6d7d1e678d7486337ce67a2f17b30bac21ac.tar.zst
Shaarli-53ed6d7d1e678d7486337ce67a2f17b30bac21ac.zip
Generate HTML documentation using MkDocs (WIP)
MkDocs is a static site generator geared towards building project documentation. Documentation source files are written in Markdown, and configured with a single YAML file. * http://www.mkdocs.org/ * http://www.mkdocs.org/user-guide/configuration/ Ref. #312 * remove pandoc-generated HTML documentation * move markdown doc to doc/md/, * mkdocs.yml: * generate HTML doc in doc/html * add pages TOC/ordering * use index.md as index page * Makefile: remove execute permissions from generated files * Makefile: rewrite htmlpages GFM to markdown conversion using sed: awk expression aslo matched '][' which causes invalid output on complex links with images or code blocks * Add mkdocs.yml to .gitattributes, exclude this file from release archives * Makefile: rename: htmldoc -> doc_html target * run make doc: pull latest markdown documentation from wiki * run make htmlpages: update html documentation
Diffstat (limited to 'doc/html/Theming/index.html')
-rw-r--r--doc/html/Theming/index.html435
1 files changed, 435 insertions, 0 deletions
diff --git a/doc/html/Theming/index.html b/doc/html/Theming/index.html
new file mode 100644
index 00000000..70a36dd4
--- /dev/null
+++ b/doc/html/Theming/index.html
@@ -0,0 +1,435 @@
1<!DOCTYPE html>
2<!--[if IE 8]><html class="no-js lt-ie9" lang="en" > <![endif]-->
3<!--[if gt IE 8]><!--> <html class="no-js" lang="en" > <!--<![endif]-->
4<head>
5 <meta charset="utf-8">
6 <meta http-equiv="X-UA-Compatible" content="IE=edge">
7 <meta name="viewport" content="width=device-width, initial-scale=1.0">
8
9
10 <link rel="shortcut icon" href="../img/favicon.ico">
11 <title>Theming - Shaarli Documentation</title>
12 <link href='https://fonts.googleapis.com/css?family=Lato:400,700|Roboto+Slab:400,700|Inconsolata:400,700' rel='stylesheet' type='text/css'>
13
14 <link rel="stylesheet" href="../css/theme.css" type="text/css" />
15 <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
16 <link rel="stylesheet" href="../css/highlight.css">
17 <link href="../github-markdown.css" rel="stylesheet">
18
19 <script>
20 // Current page data
21 var mkdocs_page_name = "Theming";
22 var mkdocs_page_input_path = "Theming.md";
23 var mkdocs_page_url = "/Theming/";
24 </script>
25
26 <script src="../js/jquery-2.1.1.min.js"></script>
27 <script src="../js/modernizr-2.8.3.min.js"></script>
28 <script type="text/javascript" src="../js/highlight.pack.js"></script>
29
30</head>
31
32<body class="wy-body-for-nav" role="document">
33
34 <div class="wy-grid-for-nav">
35
36
37 <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
38 <div class="wy-side-nav-search">
39 <a href=".." class="icon icon-home"> Shaarli Documentation</a>
40 <div role="search">
41 <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
42 <input type="text" name="q" placeholder="Search docs" />
43 </form>
44</div>
45 </div>
46
47 <div class="wy-menu wy-menu-vertical" data-spy="affix" role="navigation" aria-label="main navigation">
48 <ul class="current">
49
50
51 <li class="toctree-l1">
52
53 <a class="" href="..">Home</a>
54 </li>
55
56 <li class="toctree-l1">
57
58 <span class="caption-text">Setup</span>
59 <ul class="subnav">
60 <li class="">
61
62 <a class="" href="../Download-and-Installation/">Download and Installation</a>
63 </li>
64 <li class="">
65
66 <a class="" href="../Upgrade-and-migration/">Upgrade and migration</a>
67 </li>
68 <li class="">
69
70 <a class="" href="../Server-requirements/">Server requirements</a>
71 </li>
72 <li class="">
73
74 <a class="" href="../Server-configuration/">Server configuration</a>
75 </li>
76 <li class="">
77
78 <a class="" href="../Server-security/">Server security</a>
79 </li>
80 <li class="">
81
82 <a class="" href="../Shaarli-configuration/">Shaarli configuration</a>
83 </li>
84 <li class="">
85
86 <a class="" href="../Plugins/">Plugins</a>
87 </li>
88 </ul>
89 </li>
90
91 <li class="toctree-l1">
92
93 <span class="caption-text">Docker</span>
94 <ul class="subnav">
95 <li class="">
96
97 <a class="" href="../Docker-101/">Docker 101</a>
98 </li>
99 <li class="">
100
101 <a class="" href="../Shaarli-images/">Shaarli images</a>
102 </li>
103 <li class="">
104
105 <a class="" href="../Reverse-proxy-configuration/">Reverse proxy configuration</a>
106 </li>
107 <li class="">
108
109 <a class="" href="../Docker-resources/">Docker resources</a>
110 </li>
111 </ul>
112 </li>
113
114 <li class="toctree-l1">
115
116 <span class="caption-text">Usage</span>
117 <ul class="subnav">
118 <li class="">
119
120 <a class="" href="../Features/">Features</a>
121 </li>
122 <li class="">
123
124 <a class="" href="../Bookmarklet/">Bookmarklet</a>
125 </li>
126 <li class="">
127
128 <a class="" href="../Browsing-and-searching/">Browsing and searching</a>
129 </li>
130 <li class="">
131
132 <a class="" href="../Firefox-share/">Firefox share</a>
133 </li>
134 <li class="">
135
136 <a class="" href="../RSS-feeds/">RSS feeds</a>
137 </li>
138 <li class="">
139
140 <a class="" href="../REST-API/">REST API</a>
141 </li>
142 </ul>
143 </li>
144
145 <li class="toctree-l1">
146
147 <span class="caption-text">How To</span>
148 <ul class="subnav">
149 <li class="">
150
151 <a class="" href="../Backup,-restore,-import-and-export/">Backup, restore, import and export</a>
152 </li>
153 <li class="">
154
155 <a class="" href="../Copy-an-existing-installation-over-SSH-and-serve-it-locally/">Copy an existing installation over SSH and serve it locally</a>
156 </li>
157 <li class="">
158
159 <a class="" href="../Create-and-serve-multiple-Shaarlis-(farm)/">Create and serve multiple Shaarlis (farm)</a>
160 </li>
161 <li class="">
162
163 <a class="" href="../Download-CSS-styles-from-an-OPML-list/">Download CSS styles from an OPML list</a>
164 </li>
165 <li class="">
166
167 <a class="" href="../Datastore-hacks/">Datastore hacks</a>
168 </li>
169 </ul>
170 </li>
171
172 <li class="toctree-l1">
173
174 <a class="" href="../Troubleshooting/">Troubleshooting</a>
175 </li>
176
177 <li class="toctree-l1">
178
179 <span class="caption-text">Development</span>
180 <ul class="subnav">
181 <li class="">
182
183 <a class="" href="../Development-guidelines/">Development guidelines</a>
184 </li>
185 <li class="">
186
187 <a class="" href="../Continuous-integration-tools/">Continuous integration tools</a>
188 </li>
189 <li class="">
190
191 <a class="" href="../GnuPG-signature/">GnuPG signature</a>
192 </li>
193 <li class="">
194
195 <a class="" href="../Coding-guidelines/">Coding guidelines</a>
196 </li>
197 <li class="">
198
199 <a class="" href="../Directory-structure/">Directory structure</a>
200 </li>
201 <li class="">
202
203 <a class="" href="../3rd-party-libraries/">3rd party libraries</a>
204 </li>
205 <li class="">
206
207 <a class="" href="../Plugin-System/">Plugin System</a>
208 </li>
209 <li class="">
210
211 <a class="" href="../Release-Shaarli/">Release Shaarli</a>
212 </li>
213 <li class="">
214
215 <a class="" href="../Versioning-and-Branches/">Versioning and Branches</a>
216 </li>
217 <li class="">
218
219 <a class="" href="../Security/">Security</a>
220 </li>
221 <li class="">
222
223 <a class="" href="../Static-analysis/">Static analysis</a>
224 </li>
225 <li class=" current">
226
227 <a class="current" href="./">Theming</a>
228 <ul class="subnav">
229
230 <li class="toctree-l3"><a href="#foreword">Foreword</a></li>
231
232
233 <li class="toctree-l3"><a href="#custom-css">Custom CSS</a></li>
234
235
236 <li class="toctree-l3"><a href="#themes">Themes</a></li>
237
238
239 <li class="toctree-l3"><a href="#community-css-themes">Community CSS &amp; themes</a></li>
240
241 <ul>
242
243 <li><a class="toctree-l4" href="#custom-css_1">Custom CSS</a></li>
244
245 <li><a class="toctree-l4" href="#themes_1">Themes</a></li>
246
247 <li><a class="toctree-l4" href="#shaarli-forks">Shaarli forks</a></li>
248
249 </ul>
250
251
252 <li class="toctree-l3"><a href="#example-installation-albinomouse-theme">Example installation: AlbinoMouse theme</a></li>
253
254
255 </ul>
256 </li>
257 <li class="">
258
259 <a class="" href="../Unit-tests/">Unit tests</a>
260 </li>
261 </ul>
262 </li>
263
264 <li class="toctree-l1">
265
266 <span class="caption-text">About</span>
267 <ul class="subnav">
268 <li class="">
269
270 <a class="" href="../FAQ/">FAQ</a>
271 </li>
272 <li class="">
273
274 <a class="" href="../Community-&-Related-software/">Community & Related software</a>
275 </li>
276 </ul>
277 </li>
278
279 </ul>
280 </div>
281 &nbsp;
282 </nav>
283
284 <section data-toggle="wy-nav-shift" class="wy-nav-content-wrap">
285
286
287 <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
288 <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
289 <a href="..">Shaarli Documentation</a>
290 </nav>
291
292
293 <div class="wy-nav-content">
294 <div class="rst-content">
295 <div role="navigation" aria-label="breadcrumbs navigation">
296 <ul class="wy-breadcrumbs">
297 <li><a href="..">Docs</a> &raquo;</li>
298
299
300
301 <li>Development &raquo;</li>
302
303
304
305 <li>Theming</li>
306 <li class="wy-breadcrumbs-aside">
307
308 <a href="https://github.com/shaarli/Shaarli/edit/master/docs/Theming.md"
309 class="icon icon-github"> Edit on GitHub</a>
310
311 </li>
312 </ul>
313 <hr/>
314</div>
315 <div role="main">
316 <div class="section">
317
318 <h2 id="foreword">Foreword</h2>
319<p>There are two ways of customizing how Shaarli looks:</p>
320<ol>
321<li>by using a custom CSS to override Shaarli's CSS</li>
322<li>by using a full theme that provides its own RainTPL templates, CSS and Javascript resources</li>
323</ol>
324<h2 id="custom-css">Custom CSS</h2>
325<p>Shaarli's appearance can be modified by adding CSS rules to:
326- Shaarli &lt; <code>v0.9.0</code>: <code>inc/user.css</code>
327- Shaarli &gt;= <code>v0.9.0</code>: <code>data/user.css</code></p>
328<p>This file allows overriding rules defined in the template CSS files (only add changed rules), or define a whole new theme.</p>
329<p><strong>Note</strong>: Do not edit <code>tpl/default/css/shaarli.css</code>! Your changes would be overridden when updating Shaarli.</p>
330<p>See also <a href="../Download CSS styles from an OPML list">Download CSS styles from an OPML list</a></p>
331<h2 id="themes">Themes</h2>
332<p><em>WARNING - This feature is currently being worked on and will be improved in the next releases. Experimental.</em></p>
333<p>Installation:
334- find a theme you'd like to install
335- copy or clone the theme folder under <code>tpl/&lt;a_sweet_theme&gt;</code>
336- enable the theme:
337 - Shaarli &lt; <code>v0.9.0</code>: edit <code>data/config.json.php</code> and set the value of <code>raintpl_tpl</code> to the new theme name:
338 <code>"raintpl_tpl": "tpl\/my-template\/"</code>
339 - Shaarli &gt;= <code>v0.9.0</code>: select the theme through the <em>Tools</em> page</p>
340<h2 id="community-css-themes">Community CSS &amp; themes</h2>
341<h3 id="custom-css_1">Custom CSS</h3>
342<ul>
343<li><a href="https://github.com/mrjovanovic/serious-theme-shaarli">mrjovanovic/serious-theme-shaarli</a> - A serious theme for Shaarli</li>
344<li><a href="https://github.com/shaarli/shaarli-themes">shaarli/shaarli-themes</a></li>
345</ul>
346<h3 id="themes_1">Themes</h3>
347<ul>
348<li><a href="https://github.com/AkibaTech/Shaarli---SuperHero-Theme">AkibaTech/Shaarli Superhero Theme</a> - A template/theme for Shaarli</li>
349<li><a href="https://github.com/alexisju/albinomouse-template">alexisju/albinomouse-template</a> - A full template for Shaarli</li>
350<li><a href="https://github.com/ArthurHoaro/shaarli-launch">ArthurHoaro/shaarli-launch</a> - Customizable Shaarli theme</li>
351<li><a href="https://github.com/dhoko/ShaarliTemplate">dhoko/ShaarliTemplate</a> - A template/theme for Shaarli</li>
352<li><a href="https://github.com/kalvn/shaarli-blocks">kalvn/shaarli-blocks</a> - A template/theme for Shaarli</li>
353<li><a href="https://github.com/kalvn/Shaarli-Material">kalvn/Shaarli-Material</a> - A theme (template) based on Google's Material Design for Shaarli, the superfast delicious clone</li>
354<li><a href="https://github.com/ManufacturaInd/shaarli-2004licious-theme">ManufacturaInd/shaarli-2004licious-theme</a> - A template/theme as a humble homage to the early looks of the del.icio.us site</li>
355</ul>
356<h3 id="shaarli-forks">Shaarli forks</h3>
357<ul>
358<li><a href="https://github.com/misterair/limonade">misterair/Limonade</a> - A fork of (legacy) Shaarli with a new template</li>
359<li><a href="https://github.com/vivienhaese/shaarlitheme">vivienhaese/shaarlitheme</a> - A Shaarli fork meant to be run in an openshift instance</li>
360</ul>
361<h2 id="example-installation-albinomouse-theme">Example installation: AlbinoMouse theme</h2>
362<p>With the following configuration:
363- Apache 2 / PHP 5.6
364- user sites are enabled, e.g. <code>/home/user/public_html/somedir</code> is served as <code>http://localhost/~user/somedir</code>
365- <code>http</code> is the name of the Apache user</p>
366<pre><code class="bash">$ cd ~/public_html
367
368# clone repositories
369$ git clone https://github.com/shaarli/Shaarli.git shaarli
370$ pushd shaarli/tpl
371$ git clone https://github.com/alexisju/albinomouse-template.git
372$ popd
373
374# set access rights for Apache
375$ chgrp -R http shaarli
376$ chmod g+rwx shaarli shaarli/cache shaarli/data shaarli/pagecache shaarli/tmp
377</code></pre>
378
379<p>Get config written:
380- go to the freshly installed site
381- fill the install form
382- log in to Shaarli</p>
383<p>Edit Shaarli's <a href="../configuration|Shaarli configuration">configuration|Shaarli configuration</a>:</p>
384<pre><code class="bash"># the file should be owned by Apache, thus not writeable =&gt; sudo
385$ sudo sed -i s=tpl=tpl/albinomouse-template=g shaarli/data/config.php
386</code></pre>
387
388 </div>
389 </div>
390 <footer>
391
392 <div class="rst-footer-buttons" role="navigation" aria-label="footer navigation">
393
394 <a href="../Unit-tests/" class="btn btn-neutral float-right" title="Unit tests">Next <span class="icon icon-circle-arrow-right"></span></a>
395
396
397 <a href="../Static-analysis/" class="btn btn-neutral" title="Static analysis"><span class="icon icon-circle-arrow-left"></span> Previous</a>
398
399 </div>
400
401
402 <hr/>
403
404 <div role="contentinfo">
405 <!-- Copyright etc -->
406
407 </div>
408
409 Built with <a href="http://www.mkdocs.org">MkDocs</a> using a <a href="https://github.com/snide/sphinx_rtd_theme">theme</a> provided by <a href="https://readthedocs.org">Read the Docs</a>.
410</footer>
411
412 </div>
413 </div>
414
415 </section>
416
417 </div>
418
419 <div class="rst-versions" role="note" style="cursor: pointer">
420 <span class="rst-current-version" data-toggle="rst-current-version">
421
422 <a href="https://github.com/shaarli/Shaarli" class="fa fa-github" style="float: left; color: #fcfcfc"> GitHub</a>
423
424
425 <span><a href="../Static-analysis/" style="color: #fcfcfc;">&laquo; Previous</a></span>
426
427
428 <span style="margin-left: 15px"><a href="../Unit-tests/" style="color: #fcfcfc">Next &raquo;</a></span>
429
430 </span>
431</div>
432 <script src="../js/theme.js"></script>
433
434</body>
435</html>
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-12 06:50:21 +0000