Initial version

2017-02-15 10:56:10 +01:00
commit 64c0cbe045
4 changed files with 869 additions and 0 deletions
--- a/README.markdown
+++ b/README.markdown
@ -0,0 +1,92 @@
+# pelican-css
+
+pelican-css makes it easy to embed custom CSS into individual
+Pelican articles and pages.
+
+## How
+
+`git clone https://notabug.org/jorgesumle/pelican-css` in your plugins
+folder and add the name of the plugin to your pelicanconf.py file:
+
+```python
+PLUGIN_PATHS = ['plugins']
+PLUGINS = ['pelican-css'] # You may have more plugins
+```
+
+Next, create `css` directory in your `content` directory...
+
+```
+website/
+├── content
+│   ├── css/
+│   │   ├── your_custom_style1.css
+│   │   └── your_custom_style2.css
+│   ├── article1.md
+│   └── pages
+│       └── about.md
+└── pelican.conf.py
+```
+
+And then add each resource as a comma-separated file name in the
+`CSS` tag:
+
+```
+Title: Mejor sin Wordpress
+Date: 2017-02-09 18:51
+Tags: programación, Wordpress, generador de páginas estáticas, generador de sitios web estáticos, rendimiento, eficiencia, comodidad, desventajas
+Category: Desarrollo web
+Author: jorgesumle
+Slug: mejor-sin-wordpress
+CSS: your_custom_style1.css, your_custom_style2.css
+```
+
+Finally, in your base template (likely named `base.html`), you need
+to add the following in your `<head>` tag:
+
+```
+{% if article %}
+    {% if article.styles %}
+        {% for style in article.styles %}
+{{ style }}
+        {% endfor %}
+    {% endif %}
+{% endif %}
+```
+
+So, in the template I use for my blog now looks like the following:
+
+```
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset=utf-8">
+    <title>{% block title %} {{SITENAME}} {% endblock %}</title>
+    <link rel="stylesheet" href="{{ SITEURL }}/theme/css/style.css" type="text/css">
+    {% if article %}
+        {% if article.styles %}
+            {% for style in article.styles %}
+    {{ style }}
+            {% endfor %}
+        {% endif %}
+    {% endif %}
+  </head>
+  <body>
+    <div class=container>
+        {% block header %}
+            {% include "header.html" %}
+        {% endblock %}
+
+        <div class="content">
+        {% block content %} {% endblock %}
+        </div>
+
+        {% block footer %}
+            {% include "footer.html" %}
+        {% endblock %}
+    </div>
+  </body>
+</html>
+```
+
+That's it! Run your standard `make html` or `make publish`
+commands and your CSS will be copied and ref'd in the right places.