DOCSEARCHbyAlgolia
Submit Docs

Obsidian Calendar Plugin

repository·master·Indexed 22 days ago

https://github.com/liamcain/obsidian-calendar-plugin

A visual calendar interface for Obsidian that allows users to navigate, create, and visualize daily and weekly notes. It features word-count and task-completion indicators (dots), customizable CSS variables for styling, and integration with Daily Notes and Periodic Notes. Version 1.5.10.

Tokens
4.8K
Snippets
10
Records
25
Agent score
74%

What's inside obsidian-calendar-plugin

  1. Understand the meaning of dots in the calendar

    master

    The calendar uses dots to provide a visual summary of your notes:

    • Solid Dots: Represent word count. Each dot represents the number of words specified in the "Words per Dot" setting (default 250). There is a maximum of 5 dots.
    • Hollow Dots: Indicate that the day contains incomplete tasks. There will only ever be a maximum of 1 hollow dot per day, regardless of how many tasks are remaining.

  2. Customize the Calendar with CSS

    master

    You can override the calendar's appearance by adding CSS to your obsidian.css file. It is highly recommended to prefix all selectors with #calendar-container to prevent styles from leaking into the rest of Obsidian.

    Available CSS Variables

    #calendar-container {
  --color-background-heading: transparent;
  --color-background-day: transparent;
  --color-background-weeknum: transparent;
  --color-background-weekend: transparent;

  --color-dot: var(--text-muted);
  --color-arrow: var(--text-muted);
  --color-button: var(--text-muted);

  --color-text-title: var(--text-normal);
  --color-text-heading: var(--text-muted);
  --color-text-day: var(--text-normal);
  --color-text-today: var(--interactive-accent);
  --color-text-weeknum: var(--text-muted);
}

    Overriding Classes

    Avoid using autogenerated Svelte classes (e.g., .task.svelte-1lgyrog). Instead, target the human-readable class names. For example, to change the year title color:

    #calendar-container .year {
  color: var(--text-normal);
}
    /* obsidian-calendar-plugin */
/* https://github.com/liamcain/obsidian-calendar-plugin */

#calendar-container {
  --color-background-heading: transparent;
  --color-background-day: transparent;
  --color-background-weeknum: transparent;
  --color-background-weekend: transparent;

  --color-dot: var(--text-muted);
  --color-arrow: var(--text-muted);
  --color-button: var(--text-muted);

  --color-text-title: var(--text-normal);
  --color-text-heading: var(--text-muted);
  --color-text-day: var(--text-normal);
  --color-text-today: var(--interactive-accent);
  --color-text-weeknum: var(--text-muted);
}

  4. Use and configure Weekly Notes

    master

    Weekly notes provide an organizational layer above daily notes. While the functionality is being moved to the Periodic Notes plugin, it remains integrated here.

    Configuration

    To use weekly notes, you must enable "Show weekly numbers" in settings to access these fields:

    • Folder: The path where weekly notes are stored (defaults to vault root).
    • Template: The template used for new weekly notes.
    • Format: The date format for the filename (default: gggg-[W]ww). Use [] to wrap literal text for moment.js (e.g., [Week] ww [of Year] gggg).

    Accessing Weekly Notes

    • Click a week number in the calendar view.
    • Use the command Calendar: Open weekly Note from the Command Palette.

    Weekly Note Template Tags

    TagDescription
    sunday, monday, tuesday, wednesday, thursday, friday, saturdayInserts the date for that specific day. Note: You must specify a format (e.g., {{sunday:gggg-MM-DD}}).
    titleInserts the title of the note (same as daily notes).
    date, timeInserts the date and time of the first day of the week (same as daily notes).

  5. Configure Calendar settings

    master

    The plugin relies on your Obsidian Daily Note settings to determine date formats, template locations, and note storage paths.

    Additional plugin-specific settings include:

    • Start week on: Set the first day of the week to Sunday, Monday, or locale (uses your Obsidian language setting).
    • Words per Dot: Determines the word count threshold for the visual dots (default: 250). Set to 0 to disable. Max 5 dots are shown.
    • Confirm before creating new note: Toggle whether a modal appears before creating a new daily note.
    • Show Week Number: Enables a column of week numbers. Clicking a week number opens that week's weekly note.

  6. Embed a week view in a weekly note template

    master

    You can create a "Week at a Glance" view inside your weekly note by adding the following snippet to your weekly note template. This uses the day-specific tags to embed the corresponding daily notes:

    ## Week at a Glance

![[{{sunday:gggg-MM-DD}}]]
![[{{monday:gggg-MM-DD}}]]
![[{{tuesday:gggg-MM-DD}}]]
![[{{wednesday:gggg-MM-DD}}]]
![[{{thursday:gggg-MM-DD}}]]
![[{{friday:gggg-MM-DD}}]]
![[{{saturday:gggg-MM-DD}}]]

  7. Configure Obsidian Calendar plugin settings

    master

    The plugin provides several configuration options categorized into General, Weekly Note, and Advanced settings. These can be adjusted via the plugin's settings tab in Obsidian.

    General Settings

    • Words per dot: Determines how many words are represented by a single dot in the calendar view.
    • Start week on: Choose the day of the week the calendar starts on. Selecting locale uses the default specified by moment.js for your current locale.
    • Confirm before creating new note: When enabled, a confirmation modal appears before a new note is created.
    • Show week number: Enables a column in the calendar displaying the week number.

    Weekly Note Settings

    Note: These settings are intended for use with the 'Periodic Notes' plugin. If 'Periodic Notes' is not installed, these settings are managed locally within the plugin.

    • Weekly note format: The date format used for weekly notes (e.g., using moment.js syntax).
    • Weekly note template: The file path to the template used for new weekly notes.
    • Weekly note folder: The folder where new weekly notes will be stored.

    Advanced Settings

    • Override locale: Allows you to force a specific locale for the calendar, overriding the system default.

  9. Calendar view commands and shortcuts

    master

    Use these commands and keyboard shortcuts to navigate and manage the calendar view:

    • Open view: If the calendar is closed, use Calendar: Open view from the Command Palette.
    • Reveal open note: If you are viewing a note from a different month, run Calendar: Reveal open note to center the calendar on that date.
    • Open weekly note: Run Calendar: Open weekly Note to open the current week's note.
    • Hover Preview: Hold Ctrl/Cmd and hover over a calendar cell to see a page preview.
    • Open in new split: Ctrl/Cmd-Click a note in the calendar to open it in a new split pane.

  10. Default week format and dot density settings

    master

    The plugin uses the following default values for week formatting and dot density (used for representing event density in the calendar view):

    • DEFAULT_WEEK_FORMAT: `

  12. Use writeOptions() to update plugin settings

    master

    The writeOptions method allows for programmatic updates to the plugin's settings. It accepts a callback function that receives the current ISettings and returns a Partial<ISettings> containing the changes. The method automatically updates the internal settings store and persists the changes to disk using saveData.

    Signature: async writeOptions(changeOpts: (settings: ISettings) => Partial<ISettings>): Promise<void>