{"id":13583026,"url":"https://github.com/davfive/obsidian-jtab","last_synced_at":"2026-01-17T03:08:56.964Z","repository":{"id":39641584,"uuid":"475300280","full_name":"davfive/obsidian-jtab","owner":"davfive","description":"jTab Guitar Codeblocks for Obsidian adds the ability to show guitar chords and tabs directly in your notes.","archived":false,"fork":false,"pushed_at":"2024-03-10T22:48:56.000Z","size":1013,"stargazers_count":71,"open_issues_count":7,"forks_count":1,"subscribers_count":3,"default_branch":"main","last_synced_at":"2024-11-05T23:41:26.179Z","etag":null,"topics":["obsidian-md"],"latest_commit_sha":null,"homepage":"","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/davfive.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}},"created_at":"2022-03-29T05:56:03.000Z","updated_at":"2024-10-31T20:03:25.000Z","dependencies_parsed_at":"2024-04-08T16:03:00.415Z","dependency_job_id":"b610d256-63ee-45bb-a7c8-2d7ceb1759a0","html_url":"https://github.com/davfive/obsidian-jtab","commit_stats":null,"previous_names":[],"tags_count":11,"template":false,"template_full_name":"obsidianmd/obsidian-sample-plugin","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/davfive%2Fobsidian-jtab","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/davfive%2Fobsidian-jtab/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/davfive%2Fobsidian-jtab/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/davfive%2Fobsidian-jtab/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/davfive","download_url":"https://codeload.github.com/davfive/obsidian-jtab/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247531012,"owners_count":20953884,"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":["obsidian-md"],"created_at":"2024-08-01T15:03:12.174Z","updated_at":"2026-01-17T03:08:56.915Z","avatar_url":"https://github.com/davfive.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"### Guide for jTab Guitar Codeblocks\n\njTab Guitar Codeblocks adds the ability to show guitar chords and tabs directly in your notes.\n\nIt uses the [jTab](https://jtab.tardate.com/) library to render the chords/tabs.\n\n#### jTab codeblocks\n\n* ```` ```jtab````  \n  jTab lines will be rendered. jTab auto-detects if chords, tabs, or both are present.\n  \n* ```` ```jtab-examples````  \n  Type an empty codeblock to see all of the [jTab examples](https://jtab.tardate.com/examples.htm)\n\n* ```` ```jtab-chords````  \n  Type an empty codeblock to see all available chords (names only). Cut/paste anything off the list into a normal jtab codeblock to see the chord charts.\n\n#### Enhancements specific to jTab Guitar Codeblocks\n1. _Supports multiple jTab lines per codeblock_  \n   Each jTab line in a codeblock will be individually rendered. Blank lines will be ignored.\n\n2. _Supports markdown in codeblocks_  \n   Lines starting with \\`#\u0026lt;space\u0026gt;\\` (\\`# \\`) are rendered as markdown inside the rendered codeblock\n\n3. _Fully customizable colors in settings_  \n   Choose from Normal (black on white), Themed (follows your theme's colors), or set your own custom colors for background, lines, text, chord dots, and chord dot text. Try it out in settings.\n\n4. _Quick access to jtab-examples_  \n   Change any jtab codeblock language to jtab-examples (with your jTab still inside) and it will render the examples AND preserve your jTab when you go to edit it again.\n\n5. _Quick access to jtab-chords chord list_  \n   Change any jtab codeblock language to jtab-chords (with your jTab still inside) and it will render a list of available named chords you can use AND preserve your jTab when you go to edit again.\n\n\n#### jTab Color Schemes\njTab colors are now fully customizable with a Live Preview available in settings. Classic for the old-school black on white look, Themed will follow your theme colors. Start with one of those and change one color or go crazy and mix 'em up yourself with Custom.\n\n![Color Settings Panel](https://raw.githubusercontent.com/davfive/obsidian-jtab/main/docs/images/settings-colors-panel.jpg)\n\n#### Learning jTab\nThe [jTab Home Page](https://jtab.tardate.com/) has a [notation guide](https://jtab.tardate.com/index.htm#notation) and plenty of [examples](https://jtab.tardate.com/examples.htm).\n\nYou can put all of the examples from the jTab website directly into your notes by simply adding this:\n~~~~\n```jtab-examples\n```\n~~~~\n\n#### jTab rendering caveats\n* _Is it \"responsive\"?_  \n  The underlying jTab library isn't responsive (i.e., auto-resizing based on mobile, broswer widths) so your mileage may vary on mobile devices.\n\n* _Rendering too wide?_  \n  The width of jTab renderings are as long as you make the jTab. It's up to you to break long jTab across multiple lines.\n\n* _What about chordonly and tabonly classes mentioned on the jTab site?_  \n  The jTab library auto-detects if there are chords and/or tabs when rendering jTab. The chordonly and tabonly classes mentioned on the examples page do not affect the rendered image. They are a legacy helper classes when the rendered image's enclosing div/parent couldn't properly auto-adjust for the height of the image. With modern broswers these classes no longer needed.\n\n#### Rendered jTab Examples\n\n__jTab with only chords__\n~~~~\n```jtab\nE / / / A7 / B7 /\n```\n~~~~\n![codeblock jtab chords](https://raw.githubusercontent.com/davfive/obsidian-jtab/main/docs/images/codeblock-jtab-chords-only.jpg)\n\n__jTab with only tabs__ (haha)\n~~~~\n```jtab\n$4.7 $3.5 $2.5 $1.5 $1.7.$4.6 $2.5 $3.5 $1.7 | $1.8.$4.5 $2.5 $3.5 $1.8 $1.2.$4.4 $2.3 $3.2 $1.2 | $1.0.$4.3 $2.1 $3.2 $2.1 . $1.0 $2.1 $3.2 | $2.0.$3.0.$5.2 $2.1.$3.2.$5.0 $2.1.$3.2.$5.0 . $3.2.$5.0\n```\n~~~~\n![codeblock jtab tabs](https://raw.githubusercontent.com/davfive/obsidian-jtab/main/docs/images/codeblock-jtab-tab-only.jpg)\n\n__jTab with chords and tabs__\n~~~~\n```jtab\nBm $3 4 4h5p3h4 5 $2 3 5 7 7h8p7 5/7 ||\n```\n~~~~\n![codeblock jtab](https://raw.githubusercontent.com/davfive/obsidian-jtab/main/docs/images/codeblock-jtab-chords-and-tabs.jpg)\n\n__jTab examples codeblock__\n~~~~\n```jtab-examples\n```\n~~~~\n![codeblock jtab-examples](https://raw.githubusercontent.com/davfive/obsidian-jtab/main/docs/images/codeblock-jtab-examples.jpg)\n\t\n#### Attributions\n\n_Community Support_\n* Thanks for @RobColes for suggesting #5 (customizing colors) and being a beta tester.\n\n_Used by jTab Guitar Codeblocks_\n* [jTab](https://jtab.tardate.com/)\n  * License LGPL v2.1 (it's in it's [js file](https://github.com/tardate/jtab/blob/master/javascripts/jtab.js), not in a normal GitHub license file\n  \tPer LGPL rules, jTab is used unmodified *execpt*I do not modify the jTab source code other than to\n\t* Disable jtab.renderimplicit() from running oninit. (it searches page for jtab elements and auto-renders them)\n\t* Wrap library in ES6 to be allow use with node/ts\n\n_Used by jTab library_\n* [Raphael](https://github.com/DmitryBaranovskiy/raphael)\n  * [MIT License](https://github.com/DmitryBaranovskiy/raphael/blob/master/license.txt)\n* [jQuery](https://jquery.com/) - required by jTab - not used in my code\n  * [MIT License](https://github.com/jquery/jquery/blob/main/LICENSE.txt)\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdavfive%2Fobsidian-jtab","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdavfive%2Fobsidian-jtab","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdavfive%2Fobsidian-jtab/lists"}