Art Direction

Table of Contents

Usage
Conditions
Classes

Create unique design for each blog posts by adding special CSS and JavaScript files.

Usage

To enable this feature, add css.data and js.data files to a folder that has the same name as the page slug and is stored in the same directory level:

.\
└── lot\
    └── page\
        ├── lorem-ipsum\
        │   ├── css.data
        │   └── js.data
        └── lorem-ipsum.page

Write custom CSS code in css.data file, and custom JavaScript code in js.data file.

Conditions

These page conditional statements are available:

$site->has('css') → Return true if current page has custom CSS.
$site->has('js') → Return true if current page has custom JS.
$site->is('art') → Return true if current page has custom CSS or JS.
$site->not('art') → Return true if current page don’t have custom CSS and JS.

Classes

These HTML classes will be added automatically if your <html> element has class attribute:

has:css → Will be added if custom CSS data of current page isn’t empty.
has:js → Will be added if custom JS data of current page isn’t empty.
is:art → Will be added if custom CSS or JS data of current page isn’t empty.
not:art → Will be added if custom CSS and JS data of current page are empty.