{"id":30347997,"url":"https://github.com/inoryum-ltd/ghost-dynamic-footnotes","last_synced_at":"2026-04-15T07:36:58.708Z","repository":{"id":239345571,"uuid":"799282109","full_name":"Inoryum-Ltd/ghost-dynamic-footnotes","owner":"Inoryum-Ltd","description":"A simple script for creating dynamic footnotes for Ghost CMS.","archived":false,"fork":false,"pushed_at":"2024-05-11T17:06:05.000Z","size":4,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-08-18T17:45:37.786Z","etag":null,"topics":["dynamic","footnotes","ghost","ghost-cms","javascript","script"],"latest_commit_sha":null,"homepage":"https://inoryum.com/dynamic-footnotes-for-ghost-cms/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Inoryum-Ltd.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-05-11T16:56:26.000Z","updated_at":"2024-05-11T18:27:42.000Z","dependencies_parsed_at":"2024-05-11T18:02:27.195Z","dependency_job_id":null,"html_url":"https://github.com/Inoryum-Ltd/ghost-dynamic-footnotes","commit_stats":null,"previous_names":["inoryum-ltd/ghost-dynamic-footnotes"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Inoryum-Ltd/ghost-dynamic-footnotes","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Inoryum-Ltd%2Fghost-dynamic-footnotes","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Inoryum-Ltd%2Fghost-dynamic-footnotes/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Inoryum-Ltd%2Fghost-dynamic-footnotes/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Inoryum-Ltd%2Fghost-dynamic-footnotes/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Inoryum-Ltd","download_url":"https://codeload.github.com/Inoryum-Ltd/ghost-dynamic-footnotes/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Inoryum-Ltd%2Fghost-dynamic-footnotes/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":272367940,"owners_count":24922230,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-27T02:00:09.397Z","response_time":76,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["dynamic","footnotes","ghost","ghost-cms","javascript","script"],"created_at":"2025-08-18T17:30:15.874Z","updated_at":"2026-04-15T07:36:58.661Z","avatar_url":"https://github.com/Inoryum-Ltd.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Dynamic Footnotes for Ghost CMS\n\nEnhance your Ghost CMS blog posts with dynamic footnotes using this JavaScript script. Automatically convert footnote references into interactive links and create beautifully formatted footnote sections at the end of your posts.\n\n## Features\n\n- **Automatic Footnote Creation:** Easily add footnotes to your posts using double bracket notation (e.g., `[[1]]`).\n- **Interactive Links:** Readers can effortlessly navigate between the footnote reference and its corresponding text.\n- **Customizable Styles:** Tailor the appearance of footnotes and links to match your blog's design.\n- **Tooltip Enhancement:** Hover over a footnote link to display the full footnote text as a tooltip.\n- **Customizable Back Arrow:** Change the SVG used for the \"back to reference\" link in footnotes.\n- **Multiple Post Support:** Works seamlessly with multiple posts on a single page.\n\n## Installation\n\n### Option 1: Theme Integration\n\n1. **Download the Script:**\n   - Download the `ghost-ghost-dynamic-footnotes.js` file from this repository.\n\n2. **Upload to Your Theme:**\n   - If you're using a custom Ghost theme:\n     - Upload the `ghost-ghost-dynamic-footnotes.js` file to your theme's assets directory (usually `/assets/js/`).\n   - If you're using the default Casper theme:\n     - Create a new folder named `footnotes` inside the `assets/js` directory of your theme.\n     - Upload the `ghost-dynamic-footnotes.js` file into this new `footnotes` folder.\n\n3. **Include the Script in Your Theme:**\n   - Open your Ghost theme's template file, usually `default.hbs` or `post.hbs`.\n   - Add the following `\u003cscript\u003e` tag just before the closing `\u003c/body\u003e` tag:\n\n     ```handlebars\n     \u003cscript src=\"{{asset \"js/ghost-dynamic-footnotes.js\"}}\"\u003e\u003c/script\u003e\n     ```\n     *Ensure that `asset \"js/ghost-dynamic-footnotes.js\"` points to the correct path of your uploaded `ghost-dynamic-footnotes.js` file.*\n\n4. **Call the Function:**\n   - Still in your theme's template file, add a script tag to call the `createDynamicFootnotes()` function, optionally passing your customizations:\n\n     ```html\n     \u003cscript\u003e\n         createDynamicFootnotes({\n             // Your customization options (if any)\n         });\n     \u003c/script\u003e\n     ```\n\n### Option 2: Code Injection\n\n1. **Copy the Script:**\n   - Download the `ghost-dynamic-footnotes.js` file from this repository.\n\n2. **Upload to Ghost:**\n   - Go to your Ghost admin dashboard.\n   - Navigate to **Settings** \u003e **Code Injection**.\n\n3. **Inject the Script:**\n   - In the **Site Footer** section, paste the following code:\n\n     ```html\n     \u003cscript src=\"YOUR_ASSET_URL_HERE\"\u003e\u003c/script\u003e\n     ```\n     *Replace `YOUR_ASSET_URL_HERE` with the URL of your uploaded `ghost-dynamic-footnotes.js` file. You can host this file on a service like GitHub or use a CDN.*\n\n4. **Call the Function:**\n   - Still in the **Site Footer** section, add a script tag to call the `createDynamicFootnotes()` function, optionally passing your customizations:\n\n     ```html\n     \u003cscript\u003e\n         createDynamicFootnotes({\n             // Your customization options (if any)\n         });\n     \u003c/script\u003e\n     ```\n\n## Customization\n\nYou can customize various aspects of the footnotes by passing options to the `createDynamicFootnotes()` function:\n\n| Option               | Description                                                   | Default Value | Customization                                      |\n|----------------------|---------------------------------------------------------------|---------------|----------------------------------------------------|\n| `postContentSelector`| Selector for the container of post content.                   | `.gh-content` | Change to a custom class if your theme differs.  |\n| `footnotesDiv`       | Custom class for the footnotes container.                    | `footnotes`   | Customize the class for the footnotes container.  |\n| `footnotesList`      | Custom class for the footnote list (ol).                     | None          | Specify a custom class for the footnotes list.    |\n| `footnoteItem`       | Custom class for each footnote item (li).                    | None          | Define a custom class for each footnote item.     |\n| `footnoteLink`       | Custom class for the footnote links.                         | `footnote-link` | Set a custom class for the footnote links.       |\n| `backArrowSVG`       | Custom SVG code for the \"back to reference\" link in footnotes.| Default SVG   | Replace the default SVG with your own SVG code.  |\n\n## Contributing\n\nFeel free to fork this repository and submit pull requests to improve this script. Contributions are welcome!\n\n## License\n\nThis script is open-source and available under the [MIT License](LICENSE).","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Finoryum-ltd%2Fghost-dynamic-footnotes","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Finoryum-ltd%2Fghost-dynamic-footnotes","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Finoryum-ltd%2Fghost-dynamic-footnotes/lists"}