{% block title %} {{SITENAME}} {% endblock %}

# 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 `` tag: ``` {% if article %} {% if article.styles %} {% for style in article.styles %} {{ style|format(SITEURL) }} {% endfor %} {% endif %} {% endif %} ``` So, in the template I use for my blog now looks like the following: ``` {% block title %} {{SITENAME}} {% endblock %} {% if article %} {% if article.styles %} {% for style in article.styles %} {{ style|format(SITEURL) }} {% endfor %} {% endif %} {% endif %}

{% block header %} {% include "header.html" %} {% endblock %}

{% block content %} {% endblock %}

{% block footer %} {% include "footer.html" %} {% endblock %}

``` 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.