/CodeIT

πŸ‘©β€πŸ’» A clean, elegant but advanced blog theme for Hugo

Primary LanguageJavaScriptMIT LicenseMIT

CodeIT Theme | Hugo

GitHub release (latest by date) Hugo License CodeQL Deploy status GitHub All Contributors

CodeIT is a clean, elegant but advanced blog theme for Hugo.

It is based on the original LoveIt Theme, LeaveIt Theme, and KeepIt Theme.

Since the three themes have a similar look, if you have questions about their differences, read Why to choose CodeIT so that you can choose the one that works best for you.

Hugo Theme CodeIT

⚠️ Theme Deprecated ⚠️

This theme was deprecated. Please do a fork from this repository or from the original LoveIt theme to maintain it further.

⏳ Brief history

This theme is based on the original LoveIt theme. The original theme was loved by many users, but since May 2020 it has not been maintained.

We tried to contact the theme owner, but without success. The contributors have opened an issue and asked if the theme is still supported, but we also did not receive any response.

So we decided to create and maintain the theme with a new name, keeping the original style, but continuously improving it. Feel free to contribute to this theme 😊.

πŸ’» Demo Site

To see this theme in action, here is a live demo site that is rendered with the CodeIT theme.

❓ Why choose CodeIT

Compared to the original LeaveIt theme and the KeepIt theme, the CodeIT theme has the following modifications.

  • Custom Header
  • Custom CSS Style
  • A new home page, compatible with the latest version of Hugo
  • A lot of style detail adjustments, including color, font size, margins, code preview style
  • More readable dark mode
  • Some beautiful CSS animations
  • Easy-to-use and self-expanding table of contents
  • More social links, share sites, and comment system
  • Search supported by Lunr.js or Algolia
  • Copy code to the clipboard with one click
  • Extended Markdown syntax for Font Awesome icons
  • Extended Markdown syntax for ruby annotation
  • Extended Markdown syntax for fractions
  • Mathematical formula supported by KaTeX
  • Diagram syntax shortcode supported by mermaids
  • Interactive data visualization shortcode supported by ECharts
  • Mapbox shortcode supported by Mapbox GL JS
  • Embedded music player supported by APlayer and MetingJS
  • Bilibili player supported
  • Kinds of admonitions shortcode supported
  • Custom style shortcodes supported
  • CDN for all third-party libraries supported
  • ...

In short, if you prefer the design language and freedom of the CodeIT theme, if you want to use the extended Font Awesome icons conveniently, if you want to embed mathematical formulas, flowcharts, music, or Bilibili videos in your posts, the CodeIT theme may be more suitable for you.

I hope you will CodeIT πŸ‘©β€πŸ’»!

πŸ“– Features

⚑ Performance and SEO

πŸ–₯️ Appearance and Layout

  • Responsive layout
  • Light/Dark mode
  • Globally consistent design language
  • Pagination supported
  • Easy-to-use and self-expanding table of contents
  • Multilanguage supported and i18n ready
  • Beautiful CSS animation

πŸ’­ Social and Comment Systems

  • Gravatar supported by Gravatar
  • Local Avatar supported
  • Up to 64 social links supported
  • Up to 28 share sites supported
  • Disqus comment system supported by Disqus
  • Gitalk comment system supported by Gitalk
  • Valine comment system supported by Valine
  • Facebook comments system supported by Facebook
  • Telegram comments system supported by Telegram Comments
  • Commento comment system supported by Commento
  • Utterances comment system supported by Utterances
  • Waline comment system supported by Waline
  • Twikoo comment system supported by Twikoo

✨ Extended Features

  • Search supported by Lunr.js or algolia
  • Twemoji supported
  • Automatically highlighting code
  • Copy code to the clipboard with one click
  • Images gallery supported by lightgallery.js
  • Extended Markdown syntax for Font Awesome icons
  • Extended Markdown syntax for ruby annotation
  • Extended Markdown syntax for fractions
  • Mathematical formula supported by KaTeX
  • Diagrams shortcode supported by mermaids
  • Interactive data visualization shortcode supported by ECharts
  • Mapbox shortcode supported by Mapbox GL JS
  • Music player shortcode supported by APlayer and MetingJS
  • Bilibili player shortcode
  • Kinds of admonitions shortcode
  • Custom style shortcode
  • Custom script shortcode
  • Animated typing supported by TypeIt
  • Dynamic scroll supported by Smooth Scroll
  • Cookie consent banner supported by cookieconsent
  • ...

🎯 Add the theme to your blog

First, download the theme from GitHub and add it to your site’s themes directory:

cd your-hugo-blog-directory
git init
git submodule add https://github.com/sunt-programator/CodeIT.git themes/CodeIT

Note for non-git users:

If you do not have git installed, you can download the archive of the latest version of this theme from the release page of this repository.

Extract the .zip file to get a CodeIT-latest directory. Rename that directory to CodeIT, and move it into the themes/ directory. Then, add the theme to the site configuration:

echo 'theme = "CodeIT"' >> config.toml

You can build the theme documentation locally by using a devcontainer or by manually install the Hugo. The main advantage of the devcontainer is that you will have a preconfigured container with all tools required for developing and building the theme documentation.

hugo server --source=exampleSite

🌍 Multilingual and i18n

CodeIT supports the following languages:

  • English
  • Simplified Chinese
  • French
  • Polish
  • Brazilian Portuguese
  • Italian
  • Spanish
  • German
  • Serbian
  • Russian
  • Romanian
  • Vietnamese
  • Contribute with a new language

Languages Compatibility

❓ Questions, ideas, bugs, pull requests

All feedback is welcome! Head over to the issue tracker.

πŸ“œ License

CodeIT is licensed under the MIT license. Check the LICENSE file for details.

Thanks to the authors of the following resources included in the theme:

πŸ’° Sponsor

If you enjoy the theme, please consider buying me a coffee β˜•οΈ.

πŸŽ‰ Contributors

Thanks goes to these wonderful people (emoji key):


Victor Pogor

πŸ’» πŸ› πŸ“†

Dillon

πŸ’» πŸ› πŸ“†

Giuseppe Pignataro

πŸ’» πŸ› πŸ“†

Christopher C. Johnson

πŸ’» πŸ› πŸ“–

Akio Taniguchi

πŸ’»

Dave A-W

πŸ’»

Sangil Park

πŸ’»

youngxhui

πŸ’»

solarpowerinncr

πŸ’»

Max le Fou

πŸ’»

edte

πŸ’»

Fedomn

πŸ’»

Łukasz ZiobroΕ„

πŸ’»

δ½™ε†œεœΊδΈ»

πŸ’»

W.T. Chang

πŸ’»

Vanildo Souto Mangueira

πŸ’»

tomaja

πŸ’»

Thibault Le Reste

πŸ’»

Jake Hayes

πŸ’»

Sarath Sadasivan Pillai

πŸ’»

Rodolfo MartΓ­nez Vega

πŸ’»

quyleanh

πŸ’»

onisuly

πŸ’»

Nir Galon

πŸ’»

Mark-Daniel LΓΌthje

πŸ’»

Andrea Carratta

πŸ’»

Doğukan Erel

πŸ’»

codedge

πŸ’»

Carlos Manuel Soares

πŸ’»

Anup

πŸ’»

Silke Henderickx

πŸ’»

Ghosin

πŸ’»

Dmitry Kireev

πŸ’»

Michael Oliver

πŸ’»

Evgeny Pogrebnyak

πŸ› πŸ€”

Wen Wei Tseng

πŸ’»

sheldonhull

πŸ’» πŸ›

Madi

πŸ’» πŸ›

Thiago Mendes

πŸ’»

Yasin

πŸ›

JesΓΊs Torres

πŸ’»

Karl Webster

πŸ’» πŸ“–

OnlyFor

πŸ’» πŸ“–

Minh Tran

πŸ’» πŸ›

Aozaki

πŸ› πŸ’»

Andreas Deininger

πŸ“–

Ashpex

πŸ’»

KHannibal

πŸ€”

xMicky24GIT

πŸ“–

This project follows the all-contributors specification. Contributions of any kind welcome!