Lazy load the feature image.
This commit is contained in:
parent
8484a34195
commit
f932cf0d00
1 changed files with 7 additions and 2 deletions
|
@ -62,13 +62,18 @@ layout: default
|
|||
|
||||
<div class="post-content">
|
||||
|
||||
{%- capture img_placehodler -%}
|
||||
data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7
|
||||
{% endcapture%}
|
||||
|
||||
{% if page.image %}
|
||||
<img src="{{ page.image }}" class="post-preview-img">
|
||||
<img src="{{ img_placehodler }}" data-src="{{ page.image }}" class="post-preview-img">
|
||||
{% endif %}
|
||||
|
||||
<!-- Using lozad. See: <https://github.com/ApoorvSaxena/lozad.js#usage> -->
|
||||
{% if content contains '<img src=' %}
|
||||
{{ content | replace: '<img src=', '<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src=' }}
|
||||
{% assign replacement = '<img src="' | append: img_placehodler | append: '" data-src=' %}
|
||||
{{ content | replace: '<img src=', replacement }}
|
||||
{% else %}
|
||||
{{ content }}
|
||||
{% endif %}
|
||||
|
|
Loading…
Reference in a new issue