Published 2025-07-17. Last modified 2025-07-19.
Time to read: 1 minutes.

This page is part of the jekyll_plugins collection.

jekyll_todo

This Jekyll tag plugin creates to-do notices.

Options

• alert - Apply the alert class to the generated HTML wrapper.
• block - Apply display: block to the generated HTML wrapper.
• class - Apply the given class to the generated HTML wrapper.
• id - Apply the given HTML id attribute to the generated HTML wrapper.
• mode - Only generate the notice for the given Jekyll mode. The default is to generate the notice for all Jekyll modes.
  For example:
  
  1. mode=development or mode=develop only generates the notice when in development mode.
  2. mode=production or mode=prod only generates the notice when in production mode.
• span - Apply display: inline to the generated HTML wrapper.
• style - Apply the given CSS style to the generated HTML wrapper.

Examples

Default Parameters

{% todo %}
This is line 1 of the todo content.

This is line 2.
{% endtodo %}

Renders as:

TODO

This is line 1 of the todo content.
This is line 2.

Span

<p>
  This is a paragraph with
  {% todo span %}TODO content{% endtodo %}.
</p>

Renders as:

This is a paragraph with TODO content .

todo style='background: #eee; color: green;'

{% todo style='background: #eee; color: green;' %}
TODO content
{% endtodo %}.

Renders as:

TODO

TODO content

todo mode

The Jekyll mode that was active when this page was generated was production.

todo mode=develop

Nothing should be displayed when in production mode.

.

todo mode=prod

Nothing should be displayed when in development mode.

TODO

Content for production mode only.

.

Share to X, Hacker News, LinkedIn.