Jekyll crash course: https://gist.github.com/furilo/68fb9faf5d73e98f1f0c
Clone repo and install
git clone [email protected]:PopulateTools/jekyllpopu.git cd jekyllpopu bundle install
jekyll serve -w --future
By default, an image in a post will take the full width of the column. Options:
Inline image Add the class "inline":
{% img 'articles/160404-main_article-01' class:'inline' %}
Full width image Add the class "full_width":
{% img 'articles/160404-main_article-01' class:'full_width' %}
Add classes f_right and f_left to make the image slideout of the column in either direction.
If you want to show a caption of the image, you can add an attribute title to the img, and a class caption to make it show. If you only add the title, it will function as the normal html title element. Example:
{% img 'articles/00Divorce/160403-wadus-1' class:'full_width caption' title:'Caption of the image' %}
Just include the following code (the system will include the corresponding link for the tweet) between the paragrahs where you want the tweet box to appear as the user scrolls:
{% social_share TEXT %}
Example:
{% social_share The text I want to be part of the tweet %}
Based of Magnific Popup. Two types:
- Centered image, meta data below photo: class "popup-gallery"
- Image on the left, meta data on the right: classes "popup-gallery popup-gallery-full"
The internal markup for listing photos is the same.
<div class="popup-gallery clearfix" id="gallery">
<div class="item"><a href="URL/TO/IMG"
title="Title of the photo"
subtitle="Description of the photo. ">
<img src="URL/TO/IMG" >
</a></div>
<div class="item"><a href="URL/TO/IMG"
title="Title of the photo"
subtitle="Description of the photo. ">
<img src="URL/TO/IMG" >
</a></div>
</div>