* [New] add blog example to default theme
* [New] blog, sidebar post, and full-width post layouts * [New] blog/ directory in content-sample with 2 posts demo'ing layout
This commit is contained in:
parent
a484681e38
commit
c6b86381f0
7
content-sample/blog.md
Normal file
7
content-sample/blog.md
Normal file
|
@ -0,0 +1,7 @@
|
|||
---
|
||||
Title: Blog Example
|
||||
Description: Pico is a stupidly simple, blazing fast, flat file CMS.
|
||||
Template: blog
|
||||
---
|
||||
|
||||
<!-- All posts in the 'content-sample/blog' folder will be shown here...-->
|
13
content-sample/blog/post1.md
Normal file
13
content-sample/blog/post1.md
Normal file
|
@ -0,0 +1,13 @@
|
|||
---
|
||||
Title: Post with Sidebar
|
||||
Description: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ultricies tristique nulla et mattis. Phasellus id massa eget nisl congue blandit sit amet id ligula. Praesent et nulla eu augue tempus sagittis. Mauris faucibus nibh et nibh cursus in vestibulum sapien egestas. Curabitur ut lectus tortor.
|
||||
Author: PicoCMS
|
||||
Date: Dec 31 2015 11:59:59
|
||||
Template: blog-post
|
||||
---
|
||||
|
||||
This is `post1.md` in the `blog` folder.
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ultricies tristique nulla et mattis. Phasellus id massa eget nisl congue blandit sit amet id ligula. Praesent et nulla eu augue tempus sagittis. Mauris faucibus nibh et nibh cursus in vestibulum sapien egestas. Curabitur ut lectus tortor. Sed ipsum eros, egestas ut eleifend non, elementum vitae eros. Mauris felis diam, pellentesque vel lacinia ac, dictum a nunc. Mauris mattis nunc sed mi sagittis et facilisis tortor volutpat. Etiam tincidunt urna mattis erat placerat placerat ac eu tellus. Ut nec velit id nisl tincidunt vehicula id a metus. Pellentesque erat neque, faucibus id ultricies vel, mattis in ante. Donec lobortis, mauris id congue scelerisque, diam nisl accumsan orci, condimentum porta est magna vel arcu. Curabitur varius ante dui. Vivamus sit amet ante ac diam ullamcorper sodales sed a odio.
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ultricies tristique nulla et mattis. Phasellus id massa eget nisl congue blandit sit amet id ligula. Praesent et nulla eu augue tempus sagittis. Mauris faucibus nibh et nibh cursus in vestibulum sapien egestas. Curabitur ut lectus tortor. Sed ipsum eros, egestas ut eleifend non, elementum vitae eros. Mauris felis diam, pellentesque vel lacinia ac, dictum a nunc. Mauris mattis nunc sed mi sagittis et facilisis tortor volutpat. Etiam tincidunt urna mattis erat placerat placerat ac eu tellus. Ut nec velit id nisl tincidunt vehicula id a metus. Pellentesque erat neque, faucibus id ultricies vel, mattis in ante. Donec lobortis, mauris id congue scelerisque, diam nisl accumsan orci, condimentum porta est magna vel arcu. Curabitur varius ante dui. Vivamus sit amet ante ac diam ullamcorper sodales sed a odio.
|
14
content-sample/blog/post2.md
Normal file
14
content-sample/blog/post2.md
Normal file
|
@ -0,0 +1,14 @@
|
|||
---
|
||||
Title: Post Full-Width
|
||||
Description: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ultricies tristique nulla et mattis. Phasellus id massa eget nisl congue blandit sit amet id ligula. Praesent et nulla eu augue tempus sagittis. Mauris faucibus nibh et nibh cursus in vestibulum sapien egestas. Curabitur ut lectus tortor.
|
||||
Author: PicoCMS
|
||||
Date: Jan 1 2016 12:00:00
|
||||
Image: "http://placehold.it/1200x300&text=Blog+Image"
|
||||
Template: blog-post-full
|
||||
---
|
||||
|
||||
This is `post2.md` in the `blog` folder.
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ultricies tristique nulla et mattis. Phasellus id massa eget nisl congue blandit sit amet id ligula. Praesent et nulla eu augue tempus sagittis. Mauris faucibus nibh et nibh cursus in vestibulum sapien egestas. Curabitur ut lectus tortor. Sed ipsum eros, egestas ut eleifend non, elementum vitae eros. Mauris felis diam, pellentesque vel lacinia ac, dictum a nunc. Mauris mattis nunc sed mi sagittis et facilisis tortor volutpat. Etiam tincidunt urna mattis erat placerat placerat ac eu tellus. Ut nec velit id nisl tincidunt vehicula id a metus. Pellentesque erat neque, faucibus id ultricies vel, mattis in ante. Donec lobortis, mauris id congue scelerisque, diam nisl accumsan orci, condimentum porta est magna vel arcu. Curabitur varius ante dui. Vivamus sit amet ante ac diam ullamcorper sodales sed a odio.
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ultricies tristique nulla et mattis. Phasellus id massa eget nisl congue blandit sit amet id ligula. Praesent et nulla eu augue tempus sagittis. Mauris faucibus nibh et nibh cursus in vestibulum sapien egestas. Curabitur ut lectus tortor. Sed ipsum eros, egestas ut eleifend non, elementum vitae eros. Mauris felis diam, pellentesque vel lacinia ac, dictum a nunc. Mauris mattis nunc sed mi sagittis et facilisis tortor volutpat. Etiam tincidunt urna mattis erat placerat placerat ac eu tellus. Ut nec velit id nisl tincidunt vehicula id a metus. Pellentesque erat neque, faucibus id ultricies vel, mattis in ante. Donec lobortis, mauris id congue scelerisque, diam nisl accumsan orci, condimentum porta est magna vel arcu. Curabitur varius ante dui. Vivamus sit amet ante ac diam ullamcorper sodales sed a odio.
|
31
themes/default/blog-post-full.twig
Normal file
31
themes/default/blog-post-full.twig
Normal file
|
@ -0,0 +1,31 @@
|
|||
{% include 'includes/htmlHead.twig' %}
|
||||
{% include 'includes/head.twig' %}
|
||||
<body>
|
||||
{% include 'includes/nav.twig' %}
|
||||
<!-- Main Content -->
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
{% include 'includes/breadcrumb.twig' %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<div class="blog-post">
|
||||
<h2 class="blog-post-title">{{ meta.title }}</h2>
|
||||
<p class="blog-post-meta">
|
||||
<i class="fa fa-calendar"></i> {{ meta.date }}
|
||||
by <a href="{{ meta.author|link}}">{{ meta.author }}</a>
|
||||
</p>
|
||||
<hr>
|
||||
{% if meta.image %}
|
||||
<img src="{{ meta.image }}" class="img-responsive" alt="{{ meta.image }}" /><br>
|
||||
{% endif %}
|
||||
{{content}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include 'includes/foot.twig' %}
|
||||
</body>
|
||||
{% include 'includes/htmlFoot.twig' %}
|
34
themes/default/blog-post.twig
Normal file
34
themes/default/blog-post.twig
Normal file
|
@ -0,0 +1,34 @@
|
|||
{% include 'includes/htmlHead.twig' %}
|
||||
{% include 'includes/head.twig' %}
|
||||
<body>
|
||||
{% include 'includes/nav.twig' %}
|
||||
<!-- Main Content -->
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
{% include 'includes/breadcrumb.twig' %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-8">
|
||||
<div class="blog-post">
|
||||
<h2 class="blog-post-title">{{ meta.title }}</h2>
|
||||
<p class="blog-post-meta">
|
||||
<i class="fa fa-calendar"></i> {{ meta.date }}
|
||||
by <a href="{{ meta.author|link}}">{{ meta.author }}</a>
|
||||
</p>
|
||||
<hr>
|
||||
{% if meta.image %}
|
||||
<img src="{{ meta.image }}" class="img-responsive" alt="{{ meta.image }}" /><br>
|
||||
{% endif %}
|
||||
{{content}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-3 col-sm-offset-1">
|
||||
{% include 'includes/sidebar.twig' %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include 'includes/foot.twig' %}
|
||||
</body>
|
||||
{% include 'includes/htmlFoot.twig' %}
|
30
themes/default/blog.twig
Normal file
30
themes/default/blog.twig
Normal file
|
@ -0,0 +1,30 @@
|
|||
{% include 'includes/htmlHead.twig' %}
|
||||
{% include 'includes/head.twig' %}
|
||||
<body>
|
||||
{% include 'includes/nav.twig' %}
|
||||
<!-- Main Content -->
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-sm-8">
|
||||
{% for page in pages %}
|
||||
{% if page.id starts with "blog/" %}
|
||||
<div class="blog-post">
|
||||
<h2 class="blog-post-title"><a href="{{ page.url }}">{{ page.title }}</a></h2>
|
||||
<p class="blog-post-meta">
|
||||
<i class="fa fa-calendar"></i> {{ page.date }}
|
||||
by <a href="{{ page.author|link }}">{{ page.author }}</a>
|
||||
</p>
|
||||
{{ page.description|slice(0, 500) }}
|
||||
</div>
|
||||
<hr>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div class="col-sm-3 col-sm-offset-1">
|
||||
{% include 'includes/sidebar.twig' %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include 'includes/foot.twig' %}
|
||||
</body>
|
||||
{% include 'includes/htmlFoot.twig' %}
|
5
themes/default/includes/breadcrumb.twig
Normal file
5
themes/default/includes/breadcrumb.twig
Normal file
|
@ -0,0 +1,5 @@
|
|||
<!-- Breadcrumbs -->
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="{{ "blog" | link }}">Blog</a></li>
|
||||
<li class="active">{{ meta.title }}</li>
|
||||
</ol>
|
45
themes/default/includes/sidebar.twig
Normal file
45
themes/default/includes/sidebar.twig
Normal file
|
@ -0,0 +1,45 @@
|
|||
<!-- Sidebar -->
|
||||
<div class="sidebar-module">
|
||||
<h4>Connect with {{ site_title }}</h4>
|
||||
<ol class="list-unstyled">
|
||||
{% if config.theme_config.social_media.github %}
|
||||
<li>
|
||||
<a href="https://github.com/{{config.theme_config.social_media.github}}">
|
||||
<i class="fa fa-github fa-fw fa-2x"></i><span class="lead"> GitHub</span>
|
||||
</a>
|
||||
</li>
|
||||
{% else %}
|
||||
<li>
|
||||
<a href="https://github.com/picocms/Pico.git">
|
||||
<i class="fa fa-github fa-fw fa-2x"></i><span class="lead"> GitHub</span>
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
{% if config.theme_config.social_media.facebook %}
|
||||
<li>
|
||||
<a href="https://facebook.com/{{config.theme_config.social_media.facebook}}">
|
||||
<i class="fa fa-facebook fa-fw fa-2x"></i><span class="lead"> Facebook</span>
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
{% if config.theme_config.social_media.twitter %}
|
||||
<li>
|
||||
<a href="https://twitter.com/{{config.theme_config.social_media.twitter}}">
|
||||
<i class="fa fa-twitter fa-fw fa-2x"></i><span class="lead"> Twitter</span>
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
</ol>
|
||||
</div>
|
||||
|
||||
<div class="sidebar-module sidebar-module-inset">
|
||||
<h4>About {{ site_title }}</h4>
|
||||
{% if config.theme_config.about_us %}
|
||||
<p>{{ config.theme_config.about_us }}</p>
|
||||
{% else %}
|
||||
<p>Pico is a stupidly simple, blazing fast, flat file CMS,
|
||||
this means there is no administration backend or database
|
||||
to deal with. You simply create `.md` files in the `content-sample`
|
||||
folder and that becomes a page.</p>
|
||||
{% endif %}
|
||||
</div>
|
Loading…
Reference in a new issue