Theme Information

  • Name: Coderon – Super modern and unique Jekyll blog theme.
  • Coderon is a sleek and innovative Jekyll blog theme designed for developers, designers, content creators, and creative thinkers. Combining unique design with top-notch performance, this theme offers a clean and modern codebase alongside a fully responsive layout that looks flawless on any device. With intuitive features like a slider, dark and light mode toggle, copy code button, and much more, this theme empowers you to create an engaging and professional blog with ease. Whether you're blogging about tech, sharing tutorials, or documenting your creative journey, this theme has everything you need to create a standout blog.
  • Current Version: 1.1
  • Released: 01/04/2025
  • Creator: Artem Sheludko

Table of Contents


Configurations

Coderon theme comes with different customizations the _data/settings.yml and _config.yml files:

settings config

Installing Ruby & Jekyll

If this is your first time using Jekyll, please follow the Jekyll docs and make sure your local environment (including Ruby) is setup correctly.


Deployment

To run the theme locally, navigate to the theme directory and run bundle install to install the dependencies, then run bundle exec jekyll serve to start the Jekyll server.

I would recommend checking the Deployment Methods page on Jekyll website.


Posts

To create a new post, you can create a new markdown file inside the _posts directory by following the recommended file structure.

post

You can set the title, description, video_emded, tags, tags_color, featured or not, toc, and the post image.

The featured key is to mark the post as a featured post. If you feature some post those posts will be shown in featured posts section ordered by published date.

The toc (Table of Contents) key enables or disables the display of a table of contents for a post. When set to true, a TOC is generated automatically based on the headings in your post, providing an easy way for readers to navigate through longer content.

Add post images to /images/ directory.

Video Post

To create a video post, specify the url/link to the video in the video_embed: field like in the example below:

video_embed: https://www.youtube.com/embed/gghgYaYeG_M

Tags

For tags, try to not add space between two words, for example, Ruby on Rails, could be something like (ruby-on-rails, Ruby_on_Rails, or Ruby-on-Rails).


Pages

To create a new page, just create a new markdown file inside the _pages directory.

The following is the about.md file that you can find as an example included in the theme with the configurations you can set.

page

Things you can change are: title, permalink, video_embed, and image name.


Changing Colors

You can change all your website colors from the color-scheme.scss file.

Go to css > _0-settings > color-scheme.scss to change colors.

colors

To add images to your gallery on pages, use HTML markup and the include function. This allows you to insert images into your project using the img.html template, which defines the image, its alt text, and caption. For example:

gallery

By default, the gallery displays images in a three-column layout. If you'd like to adjust the number of columns, you can use the gallery-column-2 class for a two-column layout or gallery-column-4 for four columns to customize the appearance of your gallery.

Don't forget to provide the correct path for your images.


This allows you to set the links inside your menu. Add each one as a list item with a title and url. Make sure you leave a trailing / at the end of links to category pages (e.g. /archive/ or /videos/).

navigation

Disqus Comments

Coderon Theme comes with Disqus comments enabled.

Open _data/settings.yml file, and change the anvod-studio-test value on line 188 with your Disqus account shortname.

disqus

That’s all you need to setup Disqus from the theme side. If you get any issue regarding that comments are unable to load. First, make sure you have registered your website with Disqus (Step 1).

And also check Disqus troubleshooting guide if you still have issues.


Google Analytics

To integrate Google Analytics, open _data/settings.yml, and add your Google Analytics identifier.

analytics

Update favicon

You can find the current favicon (favicon.ico) inside the theme root directory, just replace it with your new favicon.


Credits

I have used the following scripts, fonts or other files as listed.


Support

If you have any questions that are not answered here, please feel free to contact me by mail.

Contact Artem

Go To Table of Contents