Jekyll One

Fulltext Search

Rouge is a code highlighter built into the J1 Template. Code highlighting adds colors to source code so it is easier to read. Different parts of the code — such as keywords, text strings, comments, or numbers — get different colors.

Rouge supports more than 100 programming languages and produces colored HTML output that works in every modern browser. You can also choose between many different color themes to match the look of your site. Below you can preview a few sample languages with the default Rouge themes and try out other themes from the menu.

3 Minutes to read.

Select a Theme

The J1 Template uses two default Rouge themes — one for light mode and one for dark mode:

  • Light mode uses the IgorPro theme igorpro.

  • Dark mode uses the Sublime version of Monokai monokai.sublime.

You can change the default Rouge themes in the global template configuration file ~/_data/j1_config.yml:

# ------------------------------------------------------------------------------
# HIGHLIGHTERs
#
rouge:
  theme_light:                          uno.light
  theme_dark:                           uno.dark

To preview all themes supported by J1 Template, click the button AVAILABLE THEMES below and pick one from the list.

Liquid code

Hello 2026 Aug

Javascript code

// helper functions
//
function styleSheetLoaded(styleSheet) {
  var sheets     = document.styleSheets,
      stylesheet = sheets[(sheets.length - 1)];
  // find CSS file 'styleSheetName' in document
  for(var i in document.styleSheets) {
    if(sheets[i].href && sheets[i].href.indexOf(styleSheet) > -1) {
      return true;;
    }
  }
}

Ruby code

require 'asciidoctor/extensions' unless RUBY_ENGINE == 'opal'
include Asciidoctor (1)
Asciidoctor::Extensions.register do
  class J1BlockMacro < Extensions::BlockMacroProcessor
    use_dsl
    named :banner
    name_positional_attributes 'role'
    def process parent, target, attrs
      html = %(<div id="#{target}" class="#{attrs['role']}"></div>)
      create_pass_block parent, html, attrs, subs: nil
    end
  end
  block_macro J1BlockMacro
end
1 don’t miss to load the Asciidoctor ruby

What next

The J1 Template includes a built-in site search feature, allowing visitors to find pages and posts by entering keywords in a search box. This search operates within the browser, so there is no need for external search engines like Google or Bing. The search engine, Lunr, is a small and fast JavaScript solution developed by Oliver Nightingale. J1 automatically creates a search index for your entire site, enabling search functionality immediately.

An effective search box enhances user experience by helping visitors quickly find what they need, encouraging them to return. For more information on searching a J1-based website, visit the Search Engine page.