Prerequisits

• Ensure you have followed the instructions for installing the Obsidian Zotero integration plugin.

Example Demonstration

Article Example

A. Prévost, F. Demichel, V. Léchappé, H. Helbling, R. Delpoux, and X. Brun, "A framework for technico-environmental optimization of small wind turbines," Applied Energy, vol. 377, p. 124502, Jan. 2025, doi: 10.1016/j.apenergy.2024.124502.

Link to article

Step 1: Make notes and annotations in Zotero

1. Read the Article: Open the article in Zotero.
2. Annotate: Make notes and annotations utilizing 8 preset colors. You can also include images by using “Select area” mode.

Step 2: Import to Obsidian

• From the Command Palette (Cntrl+P), select Zotero integration with your predefined format, e.g. Zotero Import. Then, select the article to import.
  
• Zotero Integration plugin imports all notes and annotations, including metadata. This makes it easy to create personal notes on the article. See Prevost2025 for an example of imported content.

Custom Template

• Tailor Your Integration: Creating a custom template allows you to tailor the integration to your specific needs.
• Define Color Categories: In your template file (e.g. Zotero.md), define color categories and their meanings. It’s recommended to limit the number of colors to avoid confusion. Here’s an example setup.

{%- set colorCategoryToMeaning = {
"yellow": "Key",
"red": "Question",
"green": "Assumption",
"blue": "Fact",
"purple": "Reference",
"magenta": "TBD",
"orange": "TBD",
"gray": "TBD"
}-%}

Custom Callout Icons (Zotero_Calllout.css)

• Define Icons: Customize callout icons for corresponding meanings.

/* annotation */
.callout[data-callout="annotation-yellow"] {
  --callout-color: 255, 212, 0;
  --callout-icon: lucide-highlighter 
}

.callout[data-callout="annotation-red"] {
  --callout-color: 255, 102, 102;
  --callout-icon: lucide-circle-help 
}

.callout[data-callout="annotation-green"] {
  --callout-color: 95, 178, 54;
  --callout-icon: lucide-settings 
}

.callout[data-callout="annotation-blue"] {
  --callout-color: 46, 168, 255;
  --callout-icon: lucide-flag-triangle-right 
}

.callout[data-callout="annotation-purple"] {
  --callout-color: 162, 138, 229;
  --callout-icon: lucide-link 
}