Skip to content

Theme docs

FAQ

The questions that come up, answered plainly.


Setup

bundle install fails

Almost always Ruby. Check which ruby — if it says /usr/bin/ruby on macOS, that is the system Ruby and it is too old. Install a current one with rbenv, chruby or Homebrew.

If it fails on ffi or sass-embedded specifically, it is usually a stale build from a previous Ruby version:

rm -rf vendor/bundle Gemfile.lock
bundle install

Never use sudo. If you are hitting permissions errors, install into the project instead:

bundle config set --local path vendor/bundle

My _config.yml change did nothing

Jekyll reads _config.yml once, at boot. Restart the server.

You are probably on a project site and baseurl is not set — or is set and you are serving without it. Both have to agree:

baseurl: "/my-repo"
bundle exec jekyll serve --baseurl "/my-repo"

Links you write yourself need | relative_url; every link the theme generates already has it.


Deployment

The Actions workflow is green but the site has not changed

Settings → Pages → Source is still on “Deploy from a branch”. Switch it to “GitHub Actions”. This catches almost everyone once.

Analytics work locally but not live (or vice versa)

Analytics are gated on JEKYLL_ENV=production. The included workflow sets it. If you build another way, set it yourself.

The custom domain shows a 404

Three things to check, in order: CNAME exists in the repository root and contains exactly the hostname; DNS has propagated (dig your-domain.com); url: in _config.yml matches.

Both github.io and my domain are in Google

Confirm CNAME is present — it makes GitHub 301 the github.io URL — and that url: is set to the domain you want. See deploying.md.


Content

Pagination is not happening

jekyll-paginate only paginates a file named index.html. The blog index is blog/index.html for that reason. Renaming it to blog.md silently breaks pagination — the page still builds, it just shows every post.

My collection does not appear

Three things are needed: an entry in collections: with output: true, a folder named _thecollection/, and an index page with list_collection: thecollection. See content.md.

The table of contents is missing

It needs at least two h2/h3 headings — a TOC with one entry is furniture. It is also built by JavaScript from the rendered article, so it will not appear with scripting disabled. The headings themselves are unaffected.

Code blocks are not highlighted

Name the language on the fence:

```apex
public class Foo {}
```

Rouge does not know apex natively; it falls back to a reasonable generic lexer, which is why Apex still colours correctly. java gives slightly better results if you would rather be exact.

An emoji or symbol renders as a box

The theme does not ship an emoji font — that comes from the reader’s OS. Nothing to fix on your side.


Design

How do I change the colour?

One line in _config.yml:

theme_style:
  accent: "#7c3aed"

That regenerates the whole ramp. See customising.md.

My accent looks wrong on white

Some hues do not survive being lightened. Accent text uses the ramp’s 700 step, which needs 4.5:1 against white — a bright yellow or cyan will not get there. Pick a mid-tone.

Can I turn off dark mode?

theme_style:
  default_scheme: light
header:
  dark_toggle: false

That sets light as the default and removes the toggle. Readers who have already chosen dark keep it — their choice is in localStorage, and overriding it would be rude. To force light for everyone, add to _sass/trailblazer-overrides.scss:

:root[data-theme="dark"] { color-scheme: light; }

…and copy the light token block over it. Consider not doing this.

The dropdown menu will not close

It is a <details> element; closing on outside-click is added by theme.js. If the script has not loaded, the menu still opens and closes on click — check the console.


Accessibility

What has been done

Semantic landmarks, a skip link, aria-current on the active nav item, aria-expanded on the drawer, focus-visible rings on everything interactive, 44px minimum touch targets, prefers-reduced-motion honoured throughout, and a palette checked at AA for every text pairing.

The --tb-fg-faint token is deliberately below 4.5:1 — it is for decorative text only and must never carry information.

What is on you

Alt text on your images, honest link text (“the migration write-up”, not “click here”), and heading levels that do not skip. The theme cannot fix any of those from a template.


Licence

Can I use this for a client site?

Yes. MIT — any number of sites, commercial included.

Yes. It is appreciated, not required; the line lives in _includes/footer.html behind a comment.

Can I redistribute a modified version?

Yes, under the MIT terms: keep the licence and copyright notice, and give your fork its own name so users can tell whose work they are running.

Is this a Salesforce product?

No. Trailblazer is an independent open-source theme. Salesforce, Trailblazer, Trailhead, Apex and Lightning are trademarks of Salesforce, Inc., and this theme is not endorsed by or affiliated with them. It ships no Salesforce artwork — every mark in it was drawn for the theme.

Found something wrong on this page? The source lives in docs/ — corrections welcome, see the contribution guide.

to move to open esc to close Full search