add readtime for posts (#622)
This commit is contained in:
parent
3f4910fde1
commit
a8332c40fd
@ -4,6 +4,8 @@ This file lists all non-trivial changes to Beautiful Jekyll.
|
||||
|
||||
I often make small changes to documentation, to the demo site, or to the general look-and-feel. These changes will not be listed here. Any other minor changes will also not be listed here.
|
||||
|
||||
**2020-04-24** Adding readtime support for the post header (#622) (thanks @MutMatt and @rubyreads)
|
||||
|
||||
**2020-04-22** Add support for configuring lang attribute on <html> tag (#608) (thanks @skalee)
|
||||
|
||||
**2020-04-18** Add ability to disable round logo (thanks @gpotter2)
|
||||
|
@ -189,6 +189,7 @@ defaults:
|
||||
layout: "post"
|
||||
comments: true # add comments to all blog posts
|
||||
social-share: true # add social media sharing buttons to all blog posts
|
||||
readtime: false # add estimated reading time on all blog posts
|
||||
-
|
||||
scope:
|
||||
path: "" # all files
|
||||
|
@ -7,15 +7,15 @@
|
||||
{% if page.bigimg %}
|
||||
<div id="header-big-imgs" data-num-img={% if page.bigimg.first %}{{ page.bigimg.size }}{% else %}1{% endif %}
|
||||
{% for bigimg in page.bigimg %}
|
||||
{% assign imgnum = forloop.index %}
|
||||
{% for imginfo in bigimg %}
|
||||
{% if imginfo[0] %}
|
||||
data-img-src-{{ imgnum }}="{{ imginfo[0] | relative_url }}"
|
||||
data-img-desc-{{ imgnum }}="{{ imginfo[1] }}"
|
||||
{% else %}
|
||||
data-img-src-{{ imgnum }}="{{ imginfo | relative_url }}"
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% assign imgnum = forloop.index %}
|
||||
{% for imginfo in bigimg %}
|
||||
{% if imginfo[0] %}
|
||||
data-img-src-{{ imgnum }}="{{ imginfo[0] | relative_url }}"
|
||||
data-img-desc-{{ imgnum }}="{{ imginfo[1] }}"
|
||||
{% else %}
|
||||
data-img-src-{{ imgnum }}="{{ imginfo | relative_url }}"
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
></div>
|
||||
{% endif %}
|
||||
@ -28,18 +28,21 @@
|
||||
<div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
|
||||
<div class="{{ include.type }}-heading">
|
||||
<h1>{% if page.title %}{{ page.title }}{% else %}<br/>{% endif %}</h1>
|
||||
{% if page.subtitle %}
|
||||
{% if include.type == "page" %}
|
||||
{% if page.subtitle %}
|
||||
{% if include.type == "page" %}
|
||||
<hr class="small">
|
||||
<span class="{{ include.type }}-subheading">{{ page.subtitle }}</span>
|
||||
{% else %}
|
||||
<h2 class="{{ include.type }}-subheading">{{ page.subtitle }}</h2>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<h2 class="{{ include.type }}-subheading">{{ page.subtitle }}</h2>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
{% if include.type == "post" %}
|
||||
<span class="post-meta">Posted on {{ page.date | date: date_format }}</span>
|
||||
{% endif %}
|
||||
{% if include.type == "post" %}
|
||||
<span class="post-meta">Posted on {{ page.date | date: date_format }}</span>
|
||||
{% if page.readtime %}
|
||||
{% include readtime.html %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -53,18 +56,21 @@
|
||||
<div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
|
||||
<div class="{{ include.type }}-heading">
|
||||
<h1>{% if page.title %}{{ page.title }}{% else %}<br/>{% endif %}</h1>
|
||||
{% if page.subtitle %}
|
||||
{% if include.type == "page" %}
|
||||
{% if page.subtitle %}
|
||||
{% if include.type == "page" %}
|
||||
<hr class="small">
|
||||
<span class="{{ include.type }}-subheading">{{ page.subtitle }}</span>
|
||||
{% else %}
|
||||
<h2 class="{{ include.type }}-subheading">{{ page.subtitle }}</h2>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<h2 class="{{ include.type }}-subheading">{{ page.subtitle }}</h2>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
{% if include.type == "post" %}
|
||||
<span class="post-meta">Posted on {{ page.date | date: date_format }}</span>
|
||||
{% endif %}
|
||||
{% if include.type == "post" %}
|
||||
<span class="post-meta">Posted on {{ page.date | date: date_format }}</span>
|
||||
{% if page.readtime %}
|
||||
{% include readtime.html %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
16
_includes/readtime.html
Normal file
16
_includes/readtime.html
Normal file
@ -0,0 +1,16 @@
|
||||
<!--- "ReadTime on GitHub Jekyll" (c) 2020 Ruby Griffith Ramirez, MIT License -->
|
||||
|
||||
{% assign ReadTime = page.content | strip_html | number_of_words %}
|
||||
{% assign calcReadTime = ReadTime | float %}
|
||||
{% assign finalReadTime = calcReadTime | divided_by:200 | round: 2 %}
|
||||
{% assign number = finalReadTime | round %}
|
||||
{% if number >= 1 %}
|
||||
{% assign yesReadTime = number | append: " minute read" %}
|
||||
<span class="reader-time post-meta"><span class="hidden-xs middot">·</span> {{ yesReadTime }}</span>
|
||||
{% elsif number < 1 %}
|
||||
{% assign minReadTime = '< 1 minute read' %}
|
||||
<span class="reader-time post-meta"><span class="hidden-xs middot">·</span> {{ minReadTime }}</span>
|
||||
{% else %}
|
||||
{% assign nilReadTime = number | replace:'0',' ' %}
|
||||
{{ nilReadTime }}
|
||||
{% endif %}
|
12
css/main.css
12
css/main.css
@ -593,6 +593,18 @@ footer .theme-by {
|
||||
}
|
||||
}
|
||||
|
||||
.reader-time {
|
||||
display: inline-block;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.reader-time {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
.reader-time .middot {
|
||||
margin: 0 10px;
|
||||
}
|
||||
|
||||
/* --- Pager --- */
|
||||
|
||||
.pager li a {
|
||||
|
Loading…
Reference in New Issue
Block a user