tabi/projects/tabi/index.html
2026-04-06 14:58:57 +00:00

2 lines
No EOL
21 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html><html lang=en><head><meta charset=UTF-8><meta content="default-src 'self';font-src 'self' data:;img-src 'self' https://* data:;media-src 'self' https://cdn.jsdelivr.net/;style-src 'self';frame-src player.vimeo.com https://www.youtube-nocookie.com;connect-src 'self' https://tabi-stats.osc.garden vhiweeypifbwacashxjz.supabase.co;script-src 'self' https://tabi-stats.osc.garden cdn.jsdelivr.net 'self'" http-equiv=Content-Security-Policy><meta content="width=device-width,initial-scale=1.0" name=viewport><meta content=https://welpo.github.io/tabi name=base><title>
~/tabi • tabi</title><link href=https://welpo.github.io/tabi/img/seedling.png rel=icon type=image/png><link href='data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><text y="50%" x="50%" dominant-baseline="central" text-anchor="middle" font-size="88">🌱</text></svg>' rel=icon><link title="~/tabi - Atom Feed" href=https://welpo.github.io/tabi/atom.xml rel=alternate type=application/atom+xml><link href="https://welpo.github.io/tabi/custom_subset.css?h=0b9535a28bc3d5bf2321" rel=stylesheet><link href="https://welpo.github.io/tabi/main.css?h=045c365e19a4d50a64bb" rel=stylesheet><meta content="light dark" name=color-scheme><meta content=#087e96 name=theme-color><meta content="A feature-rich modern Zola theme with first-class multi-language support." name=description><meta content="A feature-rich modern Zola theme with first-class multi-language support." property=og:description><meta content=tabi property=og:title><meta content=article property=og:type><meta content="https://welpo.github.io/tabi/projects/tabi/social_cards/projects_tabi.jpg?h=ec26a853a4525ae29a8f" property=og:image><meta content=1400 property=og:image:width><meta content=800 property=og:image:height><meta content="https://welpo.github.io/tabi/projects/tabi/social_cards/projects_tabi.jpg?h=ec26a853a4525ae29a8f" name=twitter:image><meta content=summary_large_image name=twitter:card><meta content=ca_ES property=og:locale:alternate><link href=https://welpo.github.io/tabi/ca/projects/tabi/ hreflang=ca rel=alternate><meta content=es_ES property=og:locale:alternate><link href=https://welpo.github.io/tabi/es/projects/tabi/ hreflang=es rel=alternate><meta content=en_GB property=og:locale:alternate><link href=https://welpo.github.io/tabi/projects/tabi/ hreflang=en rel=alternate><meta content=ar_SA property=og:locale:alternate><link href=https://welpo.github.io/tabi/ar/projects/tabi/ hreflang=ar rel=alternate><meta content=https://welpo.github.io/tabi/projects/tabi/ property=og:url><meta content=~/tabi property=og:site_name><noscript><link href=https://welpo.github.io/tabi/no_js.css rel=stylesheet></noscript><script src=https://welpo.github.io/tabi/js/initializeTheme.min.js></script><script defer src=https://welpo.github.io/tabi/js/themeSwitcher.min.js></script><script async data-goatcounter=https://tabi-stats.osc.garden/count src=https://tabi-stats.osc.garden/count.js></script><script src="https://welpo.github.io/tabi/js/searchElasticlunr.min.js?h=69d4be9bc2f0a8301299" defer></script><body><a href=#main-content id=skip-link>Skip to content</a><header><nav class=navbar><div class=nav-title><a class=home-title href=https://welpo.github.io/tabi/>~/tabi</a></div><div class=nav-navs><ul><li><a class="nav-links no-hover-padding" href=https://welpo.github.io/tabi/blog/>blog </a><li><a class="nav-links no-hover-padding" href=https://welpo.github.io/tabi/archive/>archive </a><li><a class="nav-links no-hover-padding" href=https://welpo.github.io/tabi/tags/>tags </a><li><a class="nav-links no-hover-padding" href=https://welpo.github.io/tabi/projects/>projects </a><li class=menu-icons-container><ul class=menu-icons-group><li class="js menu-icon"><div aria-label="Click or press $SHORTCUT to open search" class="search-icon interactive-icon" title="Click or press $SHORTCUT to open search" id=search-button role=button tabindex=0><svg viewbox="0 -960 960 960" xmlns=http://www.w3.org/2000/svg><path d="M784-120 532-372q-30 24-69 38t-83 14q-109 0-184.5-75.5T120-580q0-109 75.5-184.5T380-840q109 0 184.5 75.5T640-580q0 44-14 83t-38 69l252 252-56 56ZM380-400q75 0 127.5-52.5T560-580q0-75-52.5-127.5T380-760q-75 0-127.5 52.5T200-580q0 75 52.5 127.5T380-400Z"/></svg></div><li class=language-switcher><details class=dropdown><summary aria-label="Language selection" title="Language selection" aria-haspopup=true role=button><div class=language-switcher-icon></div></summary> <div class=dropdown-content role=menu>English<a aria-label=Català href=https://welpo.github.io/tabi/ca/projects/tabi/ lang=ca role=menuitem>Català</a><a aria-label=Español href=https://welpo.github.io/tabi/es/projects/tabi/ lang=es role=menuitem>Español</a><a aria-label=العربية href=https://welpo.github.io/tabi/ar/projects/tabi/ lang=ar role=menuitem>العربية</a></div></details><li class="theme-switcher-wrapper js"><div aria-label="Toggle dark mode" title="Toggle dark/light mode" aria-pressed=false class=theme-switcher role=button tabindex=0></div><div aria-label="Reset mode to default" class="theme-resetter arrow" title="Reset mode to default" aria-hidden=true role=button tabindex=0></div></ul></ul></div></nav></header><div class=content id=main-content><main><article class=h-entry><h1 class="p-name article-title">tabi</h1><a class="u-url u-uid" href=https://welpo.github.io/tabi/projects/tabi/></a><ul class=meta><li class=tag>Tags: <li class=tag><a class=p-category href=https://welpo.github.io/tabi/tags/web/>web</a>, <li class=tag><a class=p-category href=https://welpo.github.io/tabi/tags/javascript/>JavaScript</a></ul><p class=p-summary hidden>A feature-rich modern Zola theme with first-class multi-language support.<section class="e-content body"><p><a class=external href=https://github.com/welpo/tabi rel=external><strong>tabi</strong></a> is a modern, feature-rich theme for <a class=external href=https://www.getzola.org/ rel=external>Zola</a>, a fast static site generator.<div class=full-width><img alt="tabi light and dark mode" loading=lazy src=https://cdn.jsdelivr.net/gh/welpo/tabi@main/light_dark_screenshot.png></div><h4 class=centered-text id=view-on-github-demo-documentation><a aria-label="Anchor link for: view-on-github-demo-documentation" class="header-anchor no-hover-padding" href=#view-on-github-demo-documentation><span aria-hidden=true class=link-icon></span></a> <a class=external href=https://github.com/welpo/tabi rel=external>View on GitHub</a><a class=external href=https://welpo.github.io/tabi/ rel=external>Demo & Documentation</a></h4><h2 id=features><a aria-label="Anchor link for: features" class="header-anchor no-hover-padding" href=#features><span aria-hidden=true class=link-icon></span></a> Features</h2><ul><li><a class=external href=https://welpo.github.io/tabi/blog/faq-languages/#how-do-i-set-a-default-language-for-my-site rel=external>Set any language as default</a>. Set your base site to Chinese, Spanish, French, Hindi… or any <a class=external href=https://welpo.github.io/tabi/blog/faq-languages/#what-languages-does-tabi-support rel=external>other supported language</a>. The themes interface will be translated accordingly.<li><a class=external href=https://welpo.github.io/tabi/blog/mastering-tabi-settings/#git-repository-integration rel=external>Integration with remote repositories</a> on GitHub, GitLab, Gitea & Codeberg for commit history and showing the site source.<li><a class=external href=https://welpo.github.io/tabi/blog/series/ rel=external>Series support</a> for creating sequential content like tutorials, courses, and multi-part stories.<li>Dark and light themes. Defaults to the OS setting, with a switcher in the navigation bar.<li>Thorough documentation. See <a class=external href=https://welpo.github.io/tabi/blog/mastering-tabi-settings/ rel=external>Mastering tabi Settings: A Comprehensive Guide</a>.<li>Perfect Lighthouse score (Performance, Accessibility, Best Practices and SEO).<li><a class=external href=https://welpo.github.io/tabi/blog/faq-languages/#how-does-tabi-handle-multilingual-support rel=external>Comprehensive multi-language support</a>. Add as many languages as you wish.<li>Support for <a class=external href=https://welpo.github.io/tabi/blog/comments/ rel=external>comments using giscus, utterances, Hyvor Talk, or Isso</a>.<li><a class=external href=https://indieweb.org/ rel=external>Indieweb</a> ready with microformats, <a class=external href=https://welpo.github.io/tabi/blog/mastering-tabi-settings/#representative-h-card rel=external>hcard</a> and <a class=external href=https://welpo.github.io/tabi/blog/mastering-tabi-settings/#webmentions rel=external>webmentions</a> support.<li>Code syntax highlighting with colours based on <a class=external href=https://github.com/catppuccin/catppuccin rel=external>Catppuccin</a> Frappé.<li><a class=external href=https://iine.to/ rel=external>iine like buttons</a> for anonymous appreciation of your content.<li><a class=external href=https://welpo.github.io/tabi/blog/shortcodes/#mermaid-diagrams rel=external>Mermaid support</a> to create diagrams and charts with text.<li><a class=external href=https://welpo.github.io/tabi/blog/mastering-tabi-settings/#search rel=external>Local search</a> with an accessible, multi-lingual interface.<li><a class=external href=https://welpo.github.io/tabi/blog/mastering-tabi-settings/#social-media-cards rel=external>Custom Twitter card</a> and automatic Open Graph tags.<li><a class=external href=https://katex.org/ rel=external>KaTeX</a> support for mathematical notation.<li><a class=external href=https://welpo.github.io/tabi/atom.xml rel=external>Stylized and human readable Atom feed</a>.<li><a class=external href=https://welpo.github.io/tabi/sitemap.xml rel=external>Stylized and human readable sitemap</a>.<li><a class=external href=https://welpo.github.io/tabi/blog/mastering-tabi-settings/#encoded-email rel=external>Mail encoding</a> for spam protection.<li>All JavaScript can be <a class=external href=https://welpo.github.io/tabi/blog/javascript/ rel=external>fully disabled</a>.<li><a class=external href=https://welpo.github.io/tabi/blog/toc/ rel=external>Customizable Table of Contents</a>.<li><a class=external href=https://welpo.github.io/tabi/blog/security/ rel=external>Customizable secure headers</a>.<li><a class=external href=https://welpo.github.io/tabi/blog/mastering-tabi-settings/#copy-button-on-code-blocks rel=external>Copy button for code blocks</a>.<li><a class=external href=https://welpo.github.io/tabi/blog/mastering-tabi-settings/#quick-navigation-buttons rel=external>Quick navigation buttons</a>.<li><a class=external href=https://welpo.github.io/tabi/blog/mastering-tabi-settings/#copyright rel=external>Custom copyright notice</a>.<li><a class=external href=https://welpo.github.io/tabi/blog/mastering-tabi-settings/#canonical-url rel=external>Custom canonical URLs</a>.<li><a class=external href=https://welpo.github.io/tabi/blog/customise-tabi/ rel=external>Customizable skins</a>.<li><a class=external href=https://welpo.github.io/tabi/blog/shortcodes/ rel=external>Custom shortcodes</a>.<li><a class=external href=https://welpo.github.io/tabi/blog/mastering-tabi-settings/#social-media-cards rel=external>Social media cards</a>.<li>Responsive design.<li><a class=external href=https://welpo.github.io/tabi/projects/ rel=external>Projects page</a>.<li><a class=external href=https://welpo.github.io/tabi/archive/ rel=external>Archive page</a>.<li><a class=external href=https://welpo.github.io/tabi/blog/mastering-tabi-settings/#pinning-posts rel=external>Pinned posts</a>.<li><a class=external href=https://welpo.github.io/tabi/blog/mastering-tabi-settings/#social-media-icons rel=external>Social links</a>.<li><a class=external href=https://welpo.github.io/tabi/blog/mastering-tabi-settings/#tags rel=external>Tags</a>.</ul><h2 id=development-practices><a aria-label="Anchor link for: development-practices" class="header-anchor no-hover-padding" href=#development-practices><span aria-hidden=true class=link-icon></span></a> Development Practices</h2><ul><li><strong><a class=external href=https://www.conventionalcommits.org rel=external>Conventional Commits</a> & <a class=external href=https://gitmoji.dev/ rel=external>Gitmoji</a></strong>: Commit messages follow standardised formats to enhance readability.<li><strong>Issue Tracking</strong>: Each bug or new feature has its dedicated ticket, which is linked to any consequent code commits and related PRs or issues.<li><strong>Comprehensive Commentary</strong>: Tickets are documented with images, videos, and detailed descriptions to facilitate effective communication and problem-solving.<li><strong>Cross-Referencing</strong>: We link all tickets to the relevant code commits, pull requests, or related issues for complete traceability.</ul><h2 id=project-evolution><a aria-label="Anchor link for: project-evolution" class="header-anchor no-hover-padding" href=#project-evolution><span aria-hidden=true class=link-icon></span></a> Project Evolution</h2><p><strong>tabi</strong> was originally designed for my personal website, <a class=external href=https://osc.garden rel=external>osc.garden</a>. Despite its origins for personal use, best practices were implemented from the outset to ensure quality and maintainability. The theme has since grown to attract a vibrant community of contributors on GitHub.<h2 id=start-your-writing-journey-with-tabi><a aria-label="Anchor link for: start-your-writing-journey-with-tabi" class="header-anchor no-hover-padding" href=#start-your-writing-journey-with-tabi><span aria-hidden=true class=link-icon></span></a> Start Your Writing Journey with tabi</h2><p>You have something to say. Perhaps its about how linguists havent agreed on a <a class=external href=https://en.wikipedia.org/wiki/Word rel=external>definition of “word”</a> yet, or about your journey exploring the different <a class=external href=https://en.wikipedia.org/wiki/Palo_(flamenco) rel=external>flamenco palos</a>, or about how you managed to solve a bug in a popular open-source project.<p><strong>tabi</strong> provides the ideal foundation for your writing space, letting you focus on your words while Zola and tabi take care of the technical side. Step into the world of blogging with a system that makes each post a joy to write and to read. Your voice has value—share it with the world.</section><form action="https://vhiweeypifbwacashxjz.supabase.co/rest/v1/rpc/increment_hits?apikey=sb_publishable_EoB7MFJhCmb6PiAk-GPJ4w_PGhQ44Ru" class=iine-form method=post><input name=page_slug type=hidden value=/projects/tabi/><button aria-label="Like this post" title="Like this post" class=iine-button data-icon=🌱 data-slug=/projects/tabi/>🌱</button></form></article></main><div id=button-container><div id=toc-floating-container><input class=toggle id=toc-toggle type=checkbox><label title="Toggle Table of Contents" class=button for=toc-toggle id=toc-button><svg viewbox="0 -960 960 960" xmlns=http://www.w3.org/2000/svg><path d="M414.82-193.094q-18.044 0-30.497-12.32-12.453-12.319-12.453-30.036t12.453-30.086q12.453-12.37 30.497-12.37h392.767q17.237 0 29.927 12.487 12.69 12.486 12.69 30.203 0 17.716-12.69 29.919t-29.927 12.203H414.82Zm0-244.833q-18.044 0-30.497-12.487Q371.87-462.9 371.87-480.45t12.453-29.92q12.453-12.369 30.497-12.369h392.767q17.237 0 29.927 12.511 12.69 12.512 12.69 29.845 0 17.716-12.69 30.086-12.69 12.37-29.927 12.37H414.82Zm0-245.167q-18.044 0-30.497-12.32t-12.453-30.037q0-17.716 12.453-30.086 12.453-12.369 30.497-12.369h392.767q17.237 0 29.927 12.486 12.69 12.487 12.69 30.203 0 17.717-12.69 29.92-12.69 12.203-29.927 12.203H414.82ZM189.379-156.681q-32.652 0-55.878-22.829t-23.226-55.731q0-32.549 23.15-55.647 23.151-23.097 55.95-23.097 32.799 0 55.313 23.484 22.515 23.484 22.515 56.246 0 32.212-22.861 54.893-22.861 22.681-54.963 22.681Zm0-245.167q-32.652 0-55.878-23.134-23.226-23.135-23.226-55.623 0-32.487 23.467-55.517t56.12-23.03q32.102 0 54.721 23.288 22.62 23.288 22.62 55.775 0 32.488-22.861 55.364-22.861 22.877-54.963 22.877Zm-.82-244.833q-32.224 0-55.254-23.288-23.03-23.289-23.03-55.623 0-32.333 23.271-55.364 23.272-23.03 55.495-23.03 32.224 0 55.193 23.288 22.969 23.289 22.969 55.622 0 32.334-23.21 55.364-23.21 23.031-55.434 23.031Z"/></svg></label><div class=toc-content><div class=toc-container><ul><li><a href=https://welpo.github.io/tabi/projects/tabi/#view-on-github-demo-documentation>View on GitHub • Demo & Documentation</a><li><a href=https://welpo.github.io/tabi/projects/tabi/#features>Features</a><li><a href=https://welpo.github.io/tabi/projects/tabi/#development-practices>Development Practices</a><li><a href=https://welpo.github.io/tabi/projects/tabi/#project-evolution>Project Evolution</a><li><a href=https://welpo.github.io/tabi/projects/tabi/#start-your-writing-journey-with-tabi>Start Your Writing Journey with tabi</a></ul></div></div></div><a title="Go to the top of the page" class=no-hover-padding href=# id=top-button> <svg viewbox="0 0 20 20" fill=currentColor><path d="M3.293 9.707a1 1 0 010-1.414l6-6a1 1 0 011.414 0l6 6a1 1 0 01-1.414 1.414L11 5.414V17a1 1 0 11-2 0V5.414L4.707 9.707a1 1 0 01-1.414 0z"/></svg> </a></div><span class=hidden id=copy-success> Copied! </span><span class=hidden id=copy-init> Copy code to clipboard </span><script defer src=https://welpo.github.io/tabi/js/copyCodeToClipboard.min.js></script><script defer src=https://cdn.jsdelivr.net/gh/welpo/iine@main/iine.mini.js></script></div><footer><section><nav class="socials nav-navs"><ul><li><a class="nav-links no-hover-padding social" href=https://welpo.github.io/tabi/atom.xml> <img alt=feed loading=lazy src=https://welpo.github.io/tabi/social_icons/rss.svg title=feed> </a><li class=js><a class="nav-links no-hover-padding social" data-encoded-email=dGFiaUBvc2MuZ2FyZGVu href=#><img alt=email loading=lazy src=https://welpo.github.io/tabi/social_icons/email.svg title=email> </a><li><a class="nav-links no-hover-padding social" rel=" me" href=https://github.com/welpo/> <img alt=github loading=lazy src=https://welpo.github.io/tabi/social_icons/github.svg title=github> </a><li><a class="nav-links no-hover-padding social" rel=" me" href=https://soundcloud.com/oskerwyld> <img alt=soundcloud loading=lazy src=https://welpo.github.io/tabi/social_icons/soundcloud.svg title=soundcloud> </a><li><a class="nav-links no-hover-padding social" rel=" me" href=https://instagram.com/oskerwyld> <img alt=instagram loading=lazy src=https://welpo.github.io/tabi/social_icons/instagram.svg title=instagram> </a><li><a class="nav-links no-hover-padding social" rel=" me" href=https://youtube.com/@oskerwyld> <img alt=youtube loading=lazy src=https://welpo.github.io/tabi/social_icons/youtube.svg title=youtube> </a><li><a class="nav-links no-hover-padding social" rel=" me" href=https://open.spotify.com/artist/5Hv2bYBhMp1lUHFri06xkE> <img alt=spotify loading=lazy src=https://welpo.github.io/tabi/social_icons/spotify.svg title=spotify> </a></ul></nav><nav class=nav-navs><small> <ul><li><a class="nav-links no-hover-padding" href=https://welpo.github.io/tabi/about/> about </a><li><a class="nav-links no-hover-padding" href=https://welpo.github.io/tabi/privacy/> privacy policy </a><li><a class="nav-links no-hover-padding" href=https://tabi-stats.osc.garden/> site statistics </a><li><a class="nav-links no-hover-padding" href=https://welpo.github.io/tabi/sitemap.xml> sitemap </a></ul> </small></nav><div class=credits><small> Powered by <a href=https://www.getzola.org>Zola</a> & <a href=https://github.com/welpo/tabi>tabi</a><a href=https://github.com/welpo/tabi> Site source </a></small></div></section><script async src=https://welpo.github.io/tabi/js/decodeMail.min.js></script><div class="search-modal js" aria-labelledby=modalTitle id=searchModal role=dialog><h1 class=visually-hidden id=modalTitle>Search</h1><div id=modal-content><div id=searchBar><div aria-hidden=true class=search-icon><svg viewbox="0 -960 960 960" xmlns=http://www.w3.org/2000/svg><path d="M784-120 532-372q-30 24-69 38t-83 14q-109 0-184.5-75.5T120-580q0-109 75.5-184.5T380-840q109 0 184.5 75.5T640-580q0 44-14 83t-38 69l252 252-56 56ZM380-400q75 0 127.5-52.5T560-580q0-75-52.5-127.5T380-760q-75 0-127.5 52.5T200-580q0 75 52.5 127.5T380-400Z"/></svg></div><input aria-controls=results-container aria-expanded=false autocomplete=off id=searchInput placeholder=Search… role=combobox spellcheck=false><div class="close-icon interactive-icon" title="Clear search" id=clear-search role=button tabindex=0><svg viewbox="0 -960 960 960" xmlns=http://www.w3.org/2000/svg><path d="m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z"/></svg></div></div><div id=results-container><div id=results-info><span id=zero_results> No results</span><span id=one_results> $NUMBER result</span><span id=many_results> $NUMBER results</span><span id=two_results> $NUMBER results</span><span id=few_results> $NUMBER results</span></div><div id=results role=listbox></div></div></div></div></footer>