Code . Run . Eat . Sleep ↺

---

Features you can rip out for your own site.

• Animated title bar using mattboldt/typed.js.
• Menu sidebar toggle label color change based on background brightness for visibility using kennethcachia/background-check.
• lazysizes integration.
  • Markdown to img element for lazysizes regex substitution example below.
  • Liquid include for img element at lazysizes.html. Usage example in below sections.
• Post Archive page with posts by year.
• Post Tags page with list of all tags and list of tags with related posts.
  • Tag display in Liquid with matching CSS styling. Clicking tags in post page goes to tab list page.
• Collection Items entry.html with thumbnail image, redirect redirects and more-link-text customizable action link.

How to get updated theme from Basically Basic Jekyll Theme when using GitHub Pages

If you are using GitHub Pages, jekyll-theme-basically-basic gem is not supported so you can either fork the original mmistakes/jekyll-theme-basically-basic or clone it and add the original repository as a remote repository in Git.

git remote add upstream git@github.com:mmistakes/jekyll-theme-basically-basic.git
git pull upstream master
git mergetool #If needed

Usage of lazysizes Liquid include in a post

{% capture src %}
  {{ '/wp-content/uploads/2017/07/ford_escape_audio_chassis.jpg' | prepend:site.baseurl }}
{% endcapture %}
{% include lazysizes.html alt='test alt' data-src=src caption='a caption [test link](http://example.com)' %}

Convert Markdown images to be lazysizes compatible for posts with lots of images.

Assuming your Markdown images are in format

![titlee]({{ '/wp-content/uploads/2017/07/xxx.jpg' | prepend:site.baseurl }})

Regex

s/!\[(.*)\]\(({{.*}})\)/<img alt="\1" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" data-src="\2" class="lazyload" />

Contributing & Bugs

Bug reports and pull requests are welcome.

Credits

Basically Basic Jekyll Theme by mmistakes.

Typed.js by Matt Boldt.

Background Check by Kenneth Cachia.

zenscroll by zengabor.

lazysizes by aFarkas.

Icons made by Madebyoliver from www.flaticon.com is licensed by CC 3.0 BY

License

All original content is © 2022 Anson Liu. Permission is required if republishing any post content without attribution.