{"id":16557549,"url":"https://github.com/nk-o/gist-simple","last_synced_at":"2025-10-28T20:31:51.748Z","repository":{"id":34900317,"uuid":"188202696","full_name":"nk-o/gist-simple","owner":"nk-o","description":"JS for Gist code blocks loading","archived":false,"fork":false,"pushed_at":"2024-09-24T00:49:05.000Z","size":304,"stargazers_count":2,"open_issues_count":2,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-02-01T18:01:39.086Z","etag":null,"topics":["block","code","gist"],"latest_commit_sha":null,"homepage":"https://codepen.io/_nK/pen/KLQZqr","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/nk-o.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}},"created_at":"2019-05-23T09:25:11.000Z","updated_at":"2024-05-07T03:18:18.000Z","dependencies_parsed_at":"2023-01-15T10:06:03.387Z","dependency_job_id":null,"html_url":"https://github.com/nk-o/gist-simple","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nk-o%2Fgist-simple","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nk-o%2Fgist-simple/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nk-o%2Fgist-simple/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nk-o%2Fgist-simple/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/nk-o","download_url":"https://codeload.github.com/nk-o/gist-simple/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":238719776,"owners_count":19519271,"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","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":["block","code","gist"],"created_at":"2024-10-11T20:07:46.803Z","updated_at":"2025-10-28T20:31:51.327Z","avatar_url":"https://github.com/nk-o.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"## Gist Simple \u003c!-- omit in toc --\u003e\nJS for Gist code block loading.\n\n## [Demo](https://codepen.io/_nK/pen/KLQZqr) \u003c!-- omit in toc --\u003e\n\n## Table of Contents \u003c!-- omit in toc --\u003e\n\n- [Import Gist Simple](#import-gist-simple)\n  - [ESM](#esm)\n  - [ESM CDN](#esm-cdn)\n  - [UMD](#umd)\n  - [UMD CDN](#umd-cdn)\n  - [CJS (Bundlers like Webpack)](#cjs-bundlers-like-webpack)\n- [Call the plugin](#call-the-plugin)\n  - [A. Data attribute way](#a-data-attribute-way)\n  - [B. JavaScript way](#b-javascript-way)\n  - [C. jQuery way](#c-jquery-way)\n- [Options](#options)\n- [For Developers](#for-developers)\n\n\n## Import Gist Simple\n\nUse one of the following examples to import Gist Simple.\n\n### ESM\n\nWe provide a version of Gist Simple built as ESM (gist-simple.esm.js and gist-simple.esm.min.js) which allows you to use Gist Simple as a module in your browser, if your [targeted browsers support it](https://caniuse.com/es6-module).\n\n```html\n\u003cscript type=\"module\"\u003e\n  import gistSimple from \"gist-simple.esm.min.js\";\n\u003c/script\u003e\n```\n\n### ESM CDN\n\n```html\n\u003cscript type=\"module\"\u003e\n  import gistSimple from \"https://cdn.jsdelivr.net/npm/gist-simple@2/+esm\";\n\u003c/script\u003e\n```\n\n### UMD\n\nGist Simple may be also used in a traditional way by including script in HTML and using library by accessing `window.gistSimple`.\n\n```html\n\u003clink type=\"text/css\" rel=\"stylesheet\" href=\"gist-simple.css\"\u003e\n\u003cscript src=\"gist-simple.min.js\"\u003e\u003c/script\u003e\n```\n\n### UMD CDN\n\n```html\n\u003clink type=\"text/css\" rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/gist-simple@2/dist/gist-simple.css\"\u003e\n\u003cscript src=\"https://cdn.jsdelivr.net/npm/gist-simple@2/dist/gist-simple.min.js\"\u003e\u003c/script\u003e\n```\n\n### CJS (Bundlers like Webpack)\n\nInstall Gist Simple as a Node.js module using npm\n\n```\nnpm install gist-simple\n```\n\nImport Gist Simple by adding this line to your app's entry point (usually `index.js` or `app.js`):\n\n```javascript\nimport gistSimple from \"gist-simple\";\n```\n\n## Call the plugin\n\n### A. Data attribute way\n```html\n\u003cdiv class=\"gist-simple\" data-id=\"b58861072e53b12430ec2f78a99dbe4d\" data-file=\"example-1.html\"\u003e\u003c/div\u003e\n```\nNote: You can use all available options as data attributes. For example: `data-id`, `data-file`, `data-show-footer`, etc...\n\n### B. JavaScript way\n```javascript\ngistSimple(document.querySelector('.gist-simple'), {\n  id: 'b58861072e53b12430ec2f78a99dbe4d',\n  file: 'example-1.html',\n});\n```\n\n### C. jQuery way\n```javascript\n$('.gist-simple').gistSimple({\n  id: 'b58861072e53b12430ec2f78a99dbe4d',\n  file: 'example-1.html',\n});\n```\n\n#### No conflict (only if you use jQuery) \u003c!-- omit in toc --\u003e\n\nSometimes to prevent existing namespace collisions you may call `.noConflict` on the script to revert the value of.\n\n```javascript\nconst gistSimplePlugin = $.fn.gistSimple.noConflict() // return $.fn.gistSimple to previously assigned value\n$.fn.newGistSimple = gistSimplePlugin // give $().newGistSimple the Gist Simple functionality\n```\n\n## Options\nName | Type | Default  | Description\n:--- | :--- |:---------| :----------\nid | string | ``       | Gist ID.\ntheme | string | `system` | Theme: `system`, `light`, `dark`.\nfile | string | ``       | Specific file name.\ncaption | string | ``       | Caption, that will be shown above code.\nlines | string | ``       | Show only specific code lines. Example: \"2\", \"1-5\", \"1,4\", \"1,4,6-8\".\nlinesExpanded | boolean | `false`  | Hidden lines may be expanded.\nhighlightLines | string | ``       | Highlight specific code lines. Example: \"2\", \"1-5\", \"1,4\", \"1,4,6-8\".\nshowFooter | boolean | `true`   | Show footer section.\nshowLineNumbers | boolean | `true`   | Show line numbers section.\nenableCache | boolean | `true`   | Enable AJAX caching.\n\n## For Developers\n\n### Installation \u003c!-- omit in toc --\u003e\n\n* Run `npm install` in the command line\n\n### Building \u003c!-- omit in toc --\u003e\n\n* `npm run dev` to run build and start local server with files watcher\n* `npm run build` to run build\n\n### Linting \u003c!-- omit in toc --\u003e\n\n* `npm run js-lint` to show eslint errors\n* `npm run js-lint-fix` to automatically fix some of the eslint errors\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnk-o%2Fgist-simple","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnk-o%2Fgist-simple","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnk-o%2Fgist-simple/lists"}