Gordon  Matlala

Gordon Matlala

1666703543

Lagrange: A Minimalist Jekyll Theme for Running A Personal Blog

Lagrange

Lagrange is a minimalist Jekyll theme for running a personal blog or site for free through Github Pages, or on your own server. Everything that you will ever need to know about this Jekyll theme is included in the README below, which you can also find in the demo site. For a guide on how to deploy a Jekyll site using GitHub Pages, please check out this article.

If you like my work then please consider supporting me with Ko-fi.

alt text

Notable features

Compatible with GitHub Pages.

Support for Jekyll's built-in Sass/SCSS preprocessor and data files for making customizing easier.

Google Analytics support.

Commenting support powered by Disqus.

Optimized for search engines.

LaTeX support through MathJax.

Introduction

Lagrange is a Jekyll theme that was built to be 100% compatible with GitHub Pages. If you are unfamiliar with GitHub Pages, you can check out their documentation for more information. Jonathan McGlone's guide on creating and hosting a personal site on GitHub is also a good resource.

What is Jekyll?

Jekyll is a simple, blog-aware, static site generator for personal, project, or organization sites. Basically, Jekyll takes your page content along with template files and produces a complete website. For more information, visit the official Jekyll site for their documentation. Codecademy also offers a great course on how to deploy a Jekyll site for complete beginners.

Never Used Jekyll Before?

The beauty of hosting your website on GitHub is that you don't have to actually have Jekyll installed on your computer. Everything can be done through the GitHub code editor, with minimal knowledge of how to use Jekyll or the command line. All you have to do is add your posts to the _posts directory and edit the _config.yml file to change the site settings. With some rudimentary knowledge of HTML and CSS, you can even modify the site to your liking. This can all be done through the GitHub code editor, which acts like a content management system (CMS).

Installation

GitHub Pages Installation

To start using Jekyll right away with GitHub Pages, fork the Lagrange repository on GitHub. From there, you can rename your repository to USERNAME.github.io, where USERNAME is your GitHub username, and edit the settings.yml file in the _data folder to your liking. Ensure that you have a branch named gh-pages. Your website should be ready immediately at 'http://USERNAME.github.io'. Note: if you are hosting several sites under the same GitHub username, then you will have to use Project Pages instead of User Pages - just change the repository name to something other than 'http://USERNAME.github.io'.

Head over to the _posts directory to view all the posts that are currently on the website, and to see examples of what post files generally look like. You can simply just duplicate the template post and start adding your own content.

Local Installation

For a full local installation of Lagrange, download your own copy of Lagrange and unzip it into it's own directory. From there, open up your favorite command line tool, enter bundle install, and then enter jekyll serve. Your site should be up and running locally at http://localhost:4000.

Directory Structure

If you are familiar with Jekyll, then the Lagrange directory structure shouldn't be too difficult to navigate. The following some highlights of the differences you might notice between the default directory structure. More information on what these folders and files do can be found in the Jekyll documentation site.

Lagrange/
├── _data                      # Data files
|  └── settings.yml            # Theme settings and custom text
├── _includes                  # Theme includes
├── _layouts                   # Theme layouts (see below for details)
├── _posts                     # Where all your posts will go
├── assets                     # Style sheets and images are found here
|  ├── css                     # Style sheets go here
|  |  └── main.css             # Main CSS file
|  |  └── syntax.css           # Style sheet for code syntax highlighting
|  └── img                     # Images go here
├── menu                       # Menu pages
├── _config.yml                # Site build settings
├── Gemfile                    # Ruby Gemfile for managing Jekyll plugins
├── index.md                   # Home page
├── LICENSE.md                 # License for this theme
├── README.md                  # Includes all of the documentation for this theme
└── rss-feed.xml               # Generates RSS 2.0 file which Jekyll points to

Starting From Scratch

To completely start from scratch, simply delete all the files in the _posts, assets/img, and menu folder, and add your own content. You may also replace the README.md file with your own README. Everything in the _data folder and _config.yml file can be edited to suit your needs. You may also change the favicon.ico file to your own favicon.

Configuration

Sample Posts

Visit the the demo site to find sample posts that show what different types of text formatting look like. You can find these posts in the _posts folder, which show what the best practices for setting up your own site are.

Site Variables

To change site build settings, edit the _config.yml file found in the root of your repository, which you can tweak however you like. More information on configuration settings and plugins can be found on the Jekyll documentation site. This is also where you will be able to customize the title, description, and the author/owner of your site.

If you are hosting your site on GitHub Pages, then committing a change to the _config.yml file will force a rebuild of your site with Jekyll. Any changes made should be viewable soon after. If you are hosting your site locally, then you must run jekyll serve again for the changes to take place.

In the settings.yml file found in the _data folder, you will be able to customize your site settings, such as setting Disqus comments, Google Analytics, what shows up in your menu, and social media information.

Adding Menu Pages

The menu pages are found in the menu folder in the root directory, and can be added to your menu in the settings.yml file.

Posts

You will find example posts in your _posts directory. Go ahead and edit any post and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.

To add new posts, simply add a file in the _posts directory that follows the convention of YYYY-MM-DD-name-of-post.md and includes the necessary front matter. Take a look at any sample post to get an idea about how it works. If you already have a website built with Jekyll, simply copy over your posts to migrate to Lagrange.

Layouts

There are two main layout options that are included with Lagrange: post and page. Layouts are specified through the YAML front block matter. Any file that contains a YAML front block matter will be processed by Jekyll. For example:

---
layout: post
title: "Example Post"
---

Examples of what posts looks like can be found in the _posts directory, which includes this post you are reading right now. Posts are the basic blog post layout, which includes a header image, post content, author name, date published, social media sharing links, and related posts.

Pages are essentially the post layout without any of the extra features of the posts layout. An example of what pages look like can be found at the About and Contacts.

In addition to the two main layout options above, there are also custom layouts that have been created for the home page and the archives page. These are simply just page layouts with some Liquid template code. Check out the index.html file in the root directory for what the code looks like.

YAML Front Block Matter

The recommended YAML front block is:

---
layout:
title:
author:
categories:
tags: []
image:
---

layout specifies which layout to use, title is the page or post title, categories can be used to better organize your posts, tags are used when generating related posts based on the topic of the post, and image specifies which images to use. Have a look at some posts in the _posts directory to see how these variables are set.

Features

Design Considerations

Lagrange was designed to be a minimalist theme in order for the focus to remain on your content. For example, links are signified mainly through an underline text-decoration, in order to maximize the perceived affordance of clickability (I originally just wanted to make the links a darker shade of grey).

Disqus

Lagrange supports comments at the end of posts through Disqus. In order to activate Disqus commenting, set disqus.comments to true in the _data/settings.yml file. If you do not have a Disqus account already, you will have to set one up, and create a profile for your website. You will be given a disqus_shortname that will be used to generate the appropriate comments sections for your site. More information on how to set up Disqus.

Google Analytics

It is possible to track your site statistics through Google Analytics. Similar to Disqus, you will have to create an account for Google Analytics, and enter the correct Google ID for your site under google-ID in the settings.yml file. More information on how to set up Google Analytics. Note: If you are not using Google Analytics, please change google-ID to an empty string.

RSS Feeds

Atom is supported by default through jekyll-feed. With jekyll-feed, you can set configuration variables such as 'title', 'description', and 'author', in the _config.yml file.

RSS 2.0 is also supported through RSS auto-discovery. The rss-feed.xml file (based on the template found at jekyll-rss-feeds) that the feed path points to when using RSS 2.0 is automatically generated based on the appropriate configuration variables found in _data/settings.yml.

To use RSS 2.0, ensure the following is done:

Uncomment the last two lines in the _config.yml file.

In _data/settings.yml, under 'social', comment out the rss-square that points to feed.xml, and uncomment the rss-square that points to rss-feed.xml.

In _includes/head.html, comment out {% feed_meta %} and uncomment the line under the RSS 2.0 comment.

Social Media Icons

All social media icons are courtesy of Font Awesome. You can change which icons appear, as well as the account that they link to, in the settings.yml file in the _data folder.

MathJax

Lagrange comes out of the box with MathJax, which allows you to display mathematical equations in your posts through the use of LaTeX.

Syntax Highlighting

Lagrange provides syntax highlighting through fenced code blocks. Syntax highlighting allows you to display source code in different colors and fonts depending on what programming language is being displayed. You can find the full list of supported programming languages here. Another option is to embed your code through Gist.

Markdown

As always, Jekyll offers support for GitHub Flavored Markdown, which allows you to format your posts using the Markdown syntax. Examples of these text formatting features can be seen below. You can find this post in the _posts directory as well as the README.md file.

Everything Else

Check out the Jekyll docs for more info on how to get the most out of Jekyll. File all bugs/feature requests at Jekyll's GitHub repo. If you have questions, you can ask them on Jekyll Talk.

Contributing

If you would like to make a feature request, or report a bug or typo in the documentation, then please submit a GitHub issue. If you would like to make a contribution, then feel free to submit a pull request - as a bonus, I will credit all contributors below! If this is your first pull request, it may be helpful to read up on the GitHub Flow first.

Lagrange has been designed as a base for users to customize and fit to their own unique needs. Please keep this in mind when requesting features and/or submitting pull requests. Some examples of changes that I would love to see are things that would make the site easier to use, or better ways of doing things. Please avoid changes that do not benefit the majority of users.

Questions?

This theme is completely free and open source software. You may use it however you want, as it is distributed under the MIT License. If you are having any problems, any questions or suggestions, feel free to tweet at me, or file a GitHub issue.

Credits

Creator

Paul Le

www.lenpaul.com

Twitter

GitHub

Contributors

nikolalukovic

gmemstr

lynn9388

robqiao

Mauladen

dhanus

mlewand

Hguimaraes

ilhamadun

brianclemens

leyhline

aritra24

DuckSoft

larrylawl

borting

Icons + Demo Images

Death to Stock

Font Awesome

Other

Jekyll

Free Code Camp

Khan Academy

Download Details:

Author: LeNPaul
Source Code: https://github.com/LeNPaul/Lagrange 
License: MIT license

#jekyll #blog #theme 

What is GEEK

Buddha Community

Lagrange: A Minimalist Jekyll Theme for Running A Personal Blog
Gordon  Matlala

Gordon Matlala

1666703543

Lagrange: A Minimalist Jekyll Theme for Running A Personal Blog

Lagrange

Lagrange is a minimalist Jekyll theme for running a personal blog or site for free through Github Pages, or on your own server. Everything that you will ever need to know about this Jekyll theme is included in the README below, which you can also find in the demo site. For a guide on how to deploy a Jekyll site using GitHub Pages, please check out this article.

If you like my work then please consider supporting me with Ko-fi.

alt text

Notable features

Compatible with GitHub Pages.

Support for Jekyll's built-in Sass/SCSS preprocessor and data files for making customizing easier.

Google Analytics support.

Commenting support powered by Disqus.

Optimized for search engines.

LaTeX support through MathJax.

Introduction

Lagrange is a Jekyll theme that was built to be 100% compatible with GitHub Pages. If you are unfamiliar with GitHub Pages, you can check out their documentation for more information. Jonathan McGlone's guide on creating and hosting a personal site on GitHub is also a good resource.

What is Jekyll?

Jekyll is a simple, blog-aware, static site generator for personal, project, or organization sites. Basically, Jekyll takes your page content along with template files and produces a complete website. For more information, visit the official Jekyll site for their documentation. Codecademy also offers a great course on how to deploy a Jekyll site for complete beginners.

Never Used Jekyll Before?

The beauty of hosting your website on GitHub is that you don't have to actually have Jekyll installed on your computer. Everything can be done through the GitHub code editor, with minimal knowledge of how to use Jekyll or the command line. All you have to do is add your posts to the _posts directory and edit the _config.yml file to change the site settings. With some rudimentary knowledge of HTML and CSS, you can even modify the site to your liking. This can all be done through the GitHub code editor, which acts like a content management system (CMS).

Installation

GitHub Pages Installation

To start using Jekyll right away with GitHub Pages, fork the Lagrange repository on GitHub. From there, you can rename your repository to USERNAME.github.io, where USERNAME is your GitHub username, and edit the settings.yml file in the _data folder to your liking. Ensure that you have a branch named gh-pages. Your website should be ready immediately at 'http://USERNAME.github.io'. Note: if you are hosting several sites under the same GitHub username, then you will have to use Project Pages instead of User Pages - just change the repository name to something other than 'http://USERNAME.github.io'.

Head over to the _posts directory to view all the posts that are currently on the website, and to see examples of what post files generally look like. You can simply just duplicate the template post and start adding your own content.

Local Installation

For a full local installation of Lagrange, download your own copy of Lagrange and unzip it into it's own directory. From there, open up your favorite command line tool, enter bundle install, and then enter jekyll serve. Your site should be up and running locally at http://localhost:4000.

Directory Structure

If you are familiar with Jekyll, then the Lagrange directory structure shouldn't be too difficult to navigate. The following some highlights of the differences you might notice between the default directory structure. More information on what these folders and files do can be found in the Jekyll documentation site.

Lagrange/
├── _data                      # Data files
|  └── settings.yml            # Theme settings and custom text
├── _includes                  # Theme includes
├── _layouts                   # Theme layouts (see below for details)
├── _posts                     # Where all your posts will go
├── assets                     # Style sheets and images are found here
|  ├── css                     # Style sheets go here
|  |  └── main.css             # Main CSS file
|  |  └── syntax.css           # Style sheet for code syntax highlighting
|  └── img                     # Images go here
├── menu                       # Menu pages
├── _config.yml                # Site build settings
├── Gemfile                    # Ruby Gemfile for managing Jekyll plugins
├── index.md                   # Home page
├── LICENSE.md                 # License for this theme
├── README.md                  # Includes all of the documentation for this theme
└── rss-feed.xml               # Generates RSS 2.0 file which Jekyll points to

Starting From Scratch

To completely start from scratch, simply delete all the files in the _posts, assets/img, and menu folder, and add your own content. You may also replace the README.md file with your own README. Everything in the _data folder and _config.yml file can be edited to suit your needs. You may also change the favicon.ico file to your own favicon.

Configuration

Sample Posts

Visit the the demo site to find sample posts that show what different types of text formatting look like. You can find these posts in the _posts folder, which show what the best practices for setting up your own site are.

Site Variables

To change site build settings, edit the _config.yml file found in the root of your repository, which you can tweak however you like. More information on configuration settings and plugins can be found on the Jekyll documentation site. This is also where you will be able to customize the title, description, and the author/owner of your site.

If you are hosting your site on GitHub Pages, then committing a change to the _config.yml file will force a rebuild of your site with Jekyll. Any changes made should be viewable soon after. If you are hosting your site locally, then you must run jekyll serve again for the changes to take place.

In the settings.yml file found in the _data folder, you will be able to customize your site settings, such as setting Disqus comments, Google Analytics, what shows up in your menu, and social media information.

Adding Menu Pages

The menu pages are found in the menu folder in the root directory, and can be added to your menu in the settings.yml file.

Posts

You will find example posts in your _posts directory. Go ahead and edit any post and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.

To add new posts, simply add a file in the _posts directory that follows the convention of YYYY-MM-DD-name-of-post.md and includes the necessary front matter. Take a look at any sample post to get an idea about how it works. If you already have a website built with Jekyll, simply copy over your posts to migrate to Lagrange.

Layouts

There are two main layout options that are included with Lagrange: post and page. Layouts are specified through the YAML front block matter. Any file that contains a YAML front block matter will be processed by Jekyll. For example:

---
layout: post
title: "Example Post"
---

Examples of what posts looks like can be found in the _posts directory, which includes this post you are reading right now. Posts are the basic blog post layout, which includes a header image, post content, author name, date published, social media sharing links, and related posts.

Pages are essentially the post layout without any of the extra features of the posts layout. An example of what pages look like can be found at the About and Contacts.

In addition to the two main layout options above, there are also custom layouts that have been created for the home page and the archives page. These are simply just page layouts with some Liquid template code. Check out the index.html file in the root directory for what the code looks like.

YAML Front Block Matter

The recommended YAML front block is:

---
layout:
title:
author:
categories:
tags: []
image:
---

layout specifies which layout to use, title is the page or post title, categories can be used to better organize your posts, tags are used when generating related posts based on the topic of the post, and image specifies which images to use. Have a look at some posts in the _posts directory to see how these variables are set.

Features

Design Considerations

Lagrange was designed to be a minimalist theme in order for the focus to remain on your content. For example, links are signified mainly through an underline text-decoration, in order to maximize the perceived affordance of clickability (I originally just wanted to make the links a darker shade of grey).

Disqus

Lagrange supports comments at the end of posts through Disqus. In order to activate Disqus commenting, set disqus.comments to true in the _data/settings.yml file. If you do not have a Disqus account already, you will have to set one up, and create a profile for your website. You will be given a disqus_shortname that will be used to generate the appropriate comments sections for your site. More information on how to set up Disqus.

Google Analytics

It is possible to track your site statistics through Google Analytics. Similar to Disqus, you will have to create an account for Google Analytics, and enter the correct Google ID for your site under google-ID in the settings.yml file. More information on how to set up Google Analytics. Note: If you are not using Google Analytics, please change google-ID to an empty string.

RSS Feeds

Atom is supported by default through jekyll-feed. With jekyll-feed, you can set configuration variables such as 'title', 'description', and 'author', in the _config.yml file.

RSS 2.0 is also supported through RSS auto-discovery. The rss-feed.xml file (based on the template found at jekyll-rss-feeds) that the feed path points to when using RSS 2.0 is automatically generated based on the appropriate configuration variables found in _data/settings.yml.

To use RSS 2.0, ensure the following is done:

Uncomment the last two lines in the _config.yml file.

In _data/settings.yml, under 'social', comment out the rss-square that points to feed.xml, and uncomment the rss-square that points to rss-feed.xml.

In _includes/head.html, comment out {% feed_meta %} and uncomment the line under the RSS 2.0 comment.

Social Media Icons

All social media icons are courtesy of Font Awesome. You can change which icons appear, as well as the account that they link to, in the settings.yml file in the _data folder.

MathJax

Lagrange comes out of the box with MathJax, which allows you to display mathematical equations in your posts through the use of LaTeX.

Syntax Highlighting

Lagrange provides syntax highlighting through fenced code blocks. Syntax highlighting allows you to display source code in different colors and fonts depending on what programming language is being displayed. You can find the full list of supported programming languages here. Another option is to embed your code through Gist.

Markdown

As always, Jekyll offers support for GitHub Flavored Markdown, which allows you to format your posts using the Markdown syntax. Examples of these text formatting features can be seen below. You can find this post in the _posts directory as well as the README.md file.

Everything Else

Check out the Jekyll docs for more info on how to get the most out of Jekyll. File all bugs/feature requests at Jekyll's GitHub repo. If you have questions, you can ask them on Jekyll Talk.

Contributing

If you would like to make a feature request, or report a bug or typo in the documentation, then please submit a GitHub issue. If you would like to make a contribution, then feel free to submit a pull request - as a bonus, I will credit all contributors below! If this is your first pull request, it may be helpful to read up on the GitHub Flow first.

Lagrange has been designed as a base for users to customize and fit to their own unique needs. Please keep this in mind when requesting features and/or submitting pull requests. Some examples of changes that I would love to see are things that would make the site easier to use, or better ways of doing things. Please avoid changes that do not benefit the majority of users.

Questions?

This theme is completely free and open source software. You may use it however you want, as it is distributed under the MIT License. If you are having any problems, any questions or suggestions, feel free to tweet at me, or file a GitHub issue.

Credits

Creator

Paul Le

www.lenpaul.com

Twitter

GitHub

Contributors

nikolalukovic

gmemstr

lynn9388

robqiao

Mauladen

dhanus

mlewand

Hguimaraes

ilhamadun

brianclemens

leyhline

aritra24

DuckSoft

larrylawl

borting

Icons + Demo Images

Death to Stock

Font Awesome

Other

Jekyll

Free Code Camp

Khan Academy

Download Details:

Author: LeNPaul
Source Code: https://github.com/LeNPaul/Lagrange 
License: MIT license

#jekyll #blog #theme 

Gordon  Matlala

Gordon Matlala

1666675704

Klisé: A Minimalist Jekyll Theme for Running A Personal Site Or Blog

Klisé

Klisé is minimalist Jekyll theme for running a personal site and blog running on Jekyll.
For demo klise.now.sh

Features

  •  Light & Dark Mode support :waxing_crescent_moon:
  •  Customizable (using .scss)
  •  Responsive (desktop, tab and mobile)
  •  Mobile First Design
  •  SEO Optimized
  •  Images of post Organized (jekyll-postfiles)
  •  Generate Sitemap (jekyll-sitemap)
  •  RSS Feed (jekyll-feed)
  •  Syntax Highlighter (rouge)
  •  Next & Previous Post
  •  Comment layout, enable in frontmatter if you wish
  •  Google analytics
  •  HTML Minify (jekyll-compress-html)
  •  W3C Validated
  •  Lighthouse and PageSpeed Passed

Lighthouse Result

Backlogs

  •  Intergrated with PhotoSwipe.
  •  Add schema.org meta information.
  •  Transform class selector to BEM metodology.

Installation

Run local server:

$ git clone https://github.com/piharpi/jekyll-klise.git
$ cd jekyll-klise
$ bundle install
$ bundle exec jekyll serve

Navigate to localhost:4000. You're Welcome, Fork and be Stargazer.

Limitation

Contributing

If you see any typos or formatting errors in a post, or want to helping reduce backlogs or any other issue that needs to be addressed, please do not hesitate to open a pull request and fix it!, please read contributing before PR.

Yeaaa feel free to open a pull request.

Download Details:

Author: piharpi
Source Code: https://github.com/piharpi/jekyll-klise 
License: MIT license

#jekyll #ruby #blog #theme 

Gordon  Matlala

Gordon Matlala

1667337180

Millennial: A Minimalist Jekyll Theme for Running A Blog

Millennial

Millennial is a minimalist Jekyll theme for running a simple, clean, content-focused publishing platform for your publication site or blog through Github Pages, or on your own server. Everything that you will ever need to know about this Jekyll theme is included in the README below, which you can also find in the demo site. For a guide on how to deploy a Jekyll site using GitHub Pages, please check out this article.

If you like my work then please consider supporting me with Ko-fi.

alt text

Notable features

Compatible with GitHub Pages.

Support for Jekyll's built-in Sass/SCSS preprocessor and data files for making customizing easier.

Google Analytics support.

Commenting support powered by Disqus.

Optimized for search engines.

LaTeX support through MathJax.

Introduction

Millennial is a Jekyll theme that was built to be 100% compatible with GitHub Pages. If you are unfamiliar with GitHub Pages, you can check out their documentation for more information. Jonathan McGlone's guide on creating and hosting a personal site on GitHub is also a good resource.

What is Jekyll?

Jekyll is a simple, blog-aware, static site generator for personal, project, or organization sites. Basically, Jekyll takes your page content along with template files and produces a complete website. For more information, visit the official Jekyll site for their documentation. Codecademy also offers a great course on how to deploy a Jekyll site for complete beginners.

Never Used Jekyll Before?

The beauty of hosting your website on GitHub is that you don't have to actually have Jekyll installed on your computer. Everything can be done through the GitHub code editor, with minimal knowledge of how to use Jekyll or the command line. All you have to do is add your posts to the _posts directory and edit the _config.yml file to change the site settings. With some rudimentary knowledge of HTML and CSS, you can even modify the site to your liking. This can all be done through the GitHub code editor, which acts like a content management system (CMS).

Installation

GitHub Pages Installation

To start using Jekyll right away with GitHub Pages, fork the Millennial repository on GitHub. From there, you can rename your repository to USERNAME.github.io, where USERNAME is your GitHub username, and edit the settings.yml file in the _data folder to your liking. Ensure that you have a branch named gh-pages. Your website should be ready immediately at 'http://USERNAME.github.io'. Note: if you are hosting several sites under the same GitHub username, then you will have to use Project Pages instead of User Pages - just change the repository name to something other than 'http://USERNAME.github.io'.

Head over to the _posts directory to view all the posts that are currently on the website, and to see examples of what post files generally look like. You can simply just duplicate the template post and start adding your own content.

Local Installation

For a full local installation of Millennial, download your own copy of Millennial and unzip it into it's own directory. From there, open up your favorite command line tool, enter bundle install, and then enter jekyll serve. Your site should be up and running locally at http://localhost:4000.

Directory Structure

If you are familiar with Jekyll, then the Millennial directory structure shouldn't be too difficult to navigate. The following some highlights of the differences you might notice between the default directory structure. More information on what these folders and files do can be found in the Jekyll documentation site.

Millennial/
├── _data                      # Data files
|  └── settings.yml            # Theme settings and custom text
├── _includes                  # Theme includes
├── _layouts                   # Theme layouts (see below for details)
├── _posts                     # Where all your posts will go
├── assets                     # Style sheets and images are found here
|  ├── css                     # Style sheets go here
|  |  └── _sass                # Folder containing SCSS files
|  |  └── main.scss            # Main SCSS file
|  |  └── syntax.css           # Style sheet for code syntax highlighting
|  └── img                     # Images go here
├── pages                      # Category pages
├── _config.yml                # Site build settings
├── Gemfile                    # Ruby Gemfile for managing Jekyll plugins
├── index.md                   # Home page
├── LICENSE.md                 # License for this theme
├── README.md                  # Includes all of the documentation for this theme
└── rss-feed.xml               # Generates RSS 2.0 file which Jekyll points to

Starting From Scratch

To completely start from scratch, simply delete all the files in the _posts, assets/img, and pages folder, and add your own content. You may also replace the README.md file with your own README. Everything in the _data folder and _config.yml file can be edited to suit your needs. You may also change the favicon.ico file to your own favicon.

Configuration

Sample Posts

Visit the the demo site to find sample posts that show what different types of text formatting look like. You can find these posts in the _posts folder, which show what the best practices for setting up your own site are.

Site Variables

To change site build settings, edit the _config.yml file found in the root of your repository, which you can tweak however you like. More information on configuration settings and plugins can be found on the Jekyll documentation site. This is also where you will be able to customize the title, description, and the author/owner of your site.

If you are hosting your site on GitHub Pages, then committing a change to the _config.yml file will force a rebuild of your site with Jekyll. Any changes made should be viewable soon after. If you are hosting your site locally, then you must run jekyll serve again for the changes to take place.

In the settings.yml file found in the _data folder, you will be able to customize your site settings, such as setting Disqus comments, Google Analytics, what shows up in your menu, and social media information.

Adding Menu Pages

The menu pages are found in the menu folder in the root directory, and can be added to your menu in the settings.yml file.

Posts

You will find example posts in your _posts directory. Go ahead and edit any post and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.

To add new posts, simply add a file in the _posts directory that follows the convention of YYYY-MM-DD-name-of-post.md and includes the necessary front matter. Take a look at any sample post to get an idea about how it works. If you already have a website built with Jekyll, simply copy over your posts to migrate to Millennial.

Layouts

There are two main layout options that are included with Millennial: post and page. Layouts are specified through the YAML front block matter. Any file that contains a YAML front block matter will be processed by Jekyll. For example:

---
layout: post
title: "Example Post"
---

Examples of what posts looks like can be found in the _posts directory, which includes this post you are reading right now. Posts are the basic blog post layout, which includes a header image, post content, author name, date published, social media sharing links, and related posts.

Pages are essentially the post layout without any of the extra features of the posts layout. An example of what pages look like can be found at the documentation page.

In addition to the two main layout options above, there are also custom layouts that have been created for the home page and the contacts page. These are simply just page layouts with some Liquid template code. Check out the index.html file in the root directory for what the code looks like.

YAML Front Block Matter

The recommended YAML front block is:

---
layout:
title:
author:
categories:
tags: []
image:
---

layout specifies which layout to use, title is the page or post title, categories can be used to better organize your posts, tags are used when generating related posts based on the topic of the post, and image specifies which images to use. Have a look at some posts in the _posts directory to see how these variables are set.

Features

Design Considerations

Millennial was designed to be a minimalist theme in order for the focus to remain on your content. For example, links are signified mainly through an underline text-decoration, in order to maximize the perceived affordance of clickability (I originally just wanted to make the links a darker shade of grey).

Disqus

Millennial supports comments at the end of posts through Disqus. In order to activate Disqus commenting, set disqus.comments to true in the _data/settings.yml file. If you do not have a Disqus account already, you will have to set one up, and create a profile for your website. You will be given a disqus_shortname that will be used to generate the appropriate comments sections for your site. More information on how to set up Disqus.

Google Analytics

It is possible to track your site statistics through Google Analytics. Similar to Disqus, you will have to create an account for Google Analytics, and enter the correct Google ID for your site under google-ID in the settings.yml file. More information on how to set up Google Analytics. Note: If you are not using Google Analytics, please change google-ID to an empty string.

RSS Feeds

Atom is supported by default through jekyll-feed. With jekyll-feed, you can set configuration variables such as 'title', 'description', and 'author', in the _config.yml file.

RSS 2.0 is also supported through RSS auto-discovery. The rss-feed.xml file (based on the template found at jekyll-rss-feeds) that the feed path points to when using RSS 2.0 is automatically generated based on the appropriate configuration variables found in _data/settings.yml.

To use RSS 2.0, ensure the following is done:

Uncomment the last two lines in the _config.yml file.

In _data/settings.yml, under 'social', comment out the rss-square that points to feed.xml, and uncomment the rss-square that points to rss-feed.xml.

In _includes/head.html, comment out {% feed_meta %} and uncomment the line under the RSS 2.0 comment.

Social Media Icons

All social media icons are courtesy of Font Awesome. You can change which icons appear, as well as the account that they link to, in the settings.yml file in the _data folder.

MathJax

Millennial comes out of the box with MathJax, which allows you to display mathematical equations in your posts through the use of LaTeX.

Syntax Highlighting

Millennial provides syntax highlighting through fenced code blocks. Syntax highlighting allows you to display source code in different colors and fonts depending on what programming language is being displayed. You can find the full list of supported programming languages here. Another option is to embed your code through Gist.

Markdown

As always, Jekyll offers support for GitHub Flavored Markdown, which allows you to format your posts using the Markdown syntax. Examples of these text formatting features can be seen below. You can find this post in the _posts directory as well as the README.md file.

Everything Else

Check out the Jekyll docs for more info on how to get the most out of Jekyll. File all bugs/feature requests at Jekyll's GitHub repo. If you have questions, you can ask them on Jekyll Talk.

Contributing

If you would like to make a feature request, or report a bug or typo in the documentation, then please submit a GitHub issue. If you would like to make a contribution, then feel free to submit a pull request - as a bonus, I will credit all contributors below! If this is your first pull request, it may be helpful to read up on the GitHub Flow first.

Millennial has been designed as a base for users to customize and fit to their own unique needs. Please keep this in mind when requesting features and/or submitting pull requests. Some examples of changes that I would love to see are things that would make the site easier to use, or better ways of doing things. Please avoid changes that do not benefit the majority of users.

Questions?

This theme is completely free and open source software. You may use it however you want, as it is distributed under the MIT License. If you are having any problems, any questions or suggestions, feel free to tweet at me, or file a GitHub issue.

Credits

Creator

Paul Le

www.lenpaul.com

Twitter

GitHub

Contributors

b-morawiec

JainVikas

mschaeffner

cfe316

JeremyGonzales

Icons + Demo Images

Death to Stock

Font Awesome

Other

Jekyll

Free Code Camp

Khan Academy

Download Details:

Author: LeNPaul
Source Code: https://github.com/LeNPaul/Millennial 
License: MIT license

#jekyll #blog #theme #github 

Gordon  Matlala

Gordon Matlala

1667449020

Hacker-Blog: A Minimalistic, Responsive Jekyll Theme Built for Hackers

The Hacker-Blog theme

Hacker-Blog is a minimalistic, responsive jekyll theme built for hackers. It is based on the hacker theme for project pages.

Included

  1. Pagination
  2. SEO tags
  3. Archive Page
  4. About Page
  5. RSS (https://base-url/atom)
  6. Sitemap (https://base-url/sitemap)
  7. Google Analytics (optional)

Usage

  1. Fork and Clone this repository
  2. Customize your blog
  3. Add a new post in _posts/ directory with proper name format (as shown in placeholder posts)
  4. Commit and push to master on a repository named <githubusername.github.io>.
  5. Visit <githubusername>.github.io

Local Build

If you want to see the changes before pushing the blog to Github, do a local build.

  1. gem install jekyll
  2. gem install jekyll-seo-tag
  3. gem install jekyll-paginate
  4. gem install jekyll-sitemap
  5. (cd to the blog directory, then:) jekyll serve --watch --port 8000
  6. Go to http://0.0.0.0:8000/ in your web browser.

Note: In case you have set a baseurl different than / in _config.yml, go to http://0.0.0.0:8000/BASEURL/ instead.

Local build using docker

docker run --rm -p 8000:8000 \
  --volume="LOCATION_OF_YOUR_JEKYLL_BLOG:/srv/jekyll" \
  -it tocttou/jekyll:3.5 \
  jekyll serve --watch --port 8000

Replace LOCATION_OF_YOUR_JEKYLL_BLOG with the full path of your blog repository. Visit http://localhost:8000/ to access the blog.

Note: In case you have set a baseurl different than / in _config.yml, go to http://0.0.0.0:8000/BASEURL/ instead.

Customizing

Configuration variables

Edit the _config.yml file and set the following variables:

title: [The title of your blog]
description: [A short description of your blog's purpose]
author:
  name: [Your name]
  email: [Your email address]
  url: [URL of your website]

baseurl: [The base url for this blog.]

paginate: [Number of posts in one paginated section (default: 3)]
owner: [Your name]
year: [Current Year]

Note: All links in the site are prepended with baseurl. Default baseurl is /. Any other baseurl can be setup like baseurl: /hacker-blog, which makes the site available at http://domain.name/hacker-blog.

Additionally, you may choose to set the following optional variables:

google_analytics: [Your Google Analytics tracking ID]

About Page

Edit about.md

Layout

If you would like to modify the site style:

HTML

Footer: Edit _includes/footer.html

Header: Edit _includes/header.html

Links in the header: Edit _includes/links.html

Meta tags, blog title display, and additional CSS: Edit _includes/head.html

Index page layout: Edit _layouts/default.html

Post layout: Edit _layouts/post.html

CSS

Site wide CSS: Edit _sass/base.scss

Custom CSS: Make _sass/custom.scss and use it. Then add @import "custom"; to css/main.scss

404 page

Edit 404.md

Demo: https://ashishchaudhary.in/hacker-blog

Download Details:

Author: Tocttou
Source Code: https://github.com/tocttou/hacker-blog 
License: CC0-1.0 license

#jekyll #blog #theme 

Gordon  Matlala

Gordon Matlala

1666711620

Jekyll-theme-yat: Jekyll Theme for Elegant Writers

JEKYLL YAT THEME

Jekyll theme for elegant writers.

Built with ❤︎ by jeffreytse and contributors 

Hey, nice to meet you, you found this Jekyll theme. Here the YAT (Yet Another Theme) is a modern responsive theme. It's quite clear, clean and neat for writers and posts. If you are an elegant writer and focus on content, don't miss it.

Features

  • Support beautiful Night Mode.
  • Modern responsive web design.
  • Full layouts home, post, tags, archive and about.
  • Uses font awesome 5 for icons.
  • Beautiful page banner with image and video.
  • Beautiful Syntax Highlight using highlight.js.
  • RSS support using Jekyll Feed gem.
  • Optimized for search engines using Jekyll Seo Tag gem.
  • Sitemap support using Jekyll Sitemap gem.
  • Complex and flexible table support using Jekyll Spaceship gem.
  • MathJAX and LaTeX optional support using Jekyll Spaceship gem.
  • Media (Youtube, Spotify, etc.) support using Jekyll Spaceship gem.
  • Diagram (PlantUML, Mermaid) support using Jekyll Spaceship gem.
  • Google Translation support.
  • New post tag support.

Also, visit the Live Demo site for the theme.

Installation

There are three ways to install:

Gem-based Theme Method

Add this line to your Jekyll site's Gemfile:

gem "jekyll-theme-yat"

And add this line to your Jekyll site's _config.yml:

theme: jekyll-theme-yat

And then execute:

$ bundle

Or install it yourself as:

$ gem install jekyll-theme-yat

Remote Theme Method with GitHub Pages

Remote themes are similar to Gem-based themes, but do not require Gemfile changes or whitelisting making them ideal for sites hosted with GitHub Pages.

To install:

Add this line to your Jekyll site's Gemfile:

gem "github-pages", group: :jekyll_plugins

And add this line to your Jekyll site's _config.yml:

# theme: owner/name --> Don't forget to remove/comment the gem-based theme option
remote_theme: "jeffreytse/jekyll-theme-yat"

And then execute:

$ bundle

GitHub Pages without limitation

GitHub Pages runs in safe mode and only allows a set of whitelisted plugins/themes. In other words, the third-party gems will not work normally.

To use the third-party gem in GitHub Pages without limitation:

Here is a GitHub Action named jekyll-deploy-action for Jekyll site deployment conveniently. 👍

Usage

Add or update your available layouts, includes, sass and/or assets.

Development

To set up your environment to develop this theme, run bundle install.

Your theme is setup just like a normal Jekyll site! To test your theme, run bundle exec jekyll serve and open your browser at http://localhost:4000. This starts a Jekyll server using your theme. Add pages, documents, data, etc. like normal to test your theme's contents. As you make modifications to your theme and to your content, your site will regenerate and you should see the changes in the browser after a refresh, just like normal.

When your theme is released, only the files in _data, _layouts, _includes, _sass and assets tracked with Git will be bundled. To add a custom directory to your theme-gem, please edit the regexp in jekyll-theme-yat.gemspec accordingly.

Contributing

Issues and Pull Requests are greatly appreciated. If you've never contributed to an open source project before I'm more than happy to walk you through how to create a pull request.

You can start by opening an issue describing the problem that you're looking to resolve and we'll go from there.

Screenshots

demo-screenshot

BANNER

demo-screenshot

Download Details:

Author: jeffreytse
Source Code: https://github.com/jeffreytse/jekyll-theme-yat 
License: MIT license

#jekyll #theme #blog #website