PHPackages henryavila/laravel-nova-chordpro-field - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Templating & Views](/categories/templating) 4. / 5. henryavila/laravel-nova-chordpro-field ActiveLibrary[Templating & Views](/categories/templating) henryavila/laravel-nova-chordpro-field ====================================== Add a Chordpro viewer and editor into Laravel Nova. The editor is a simple TextArea. The viewer display a fully formatted song. 1.2.0(2y ago)176MITVuePHP ^8.0 Since Oct 10Pushed 2y ago1 watchersCompare [ Source](https://github.com/henryavila/laravel-nova-chordpro-field)[ Packagist](https://packagist.org/packages/henryavila/laravel-nova-chordpro-field)[ RSS](/packages/henryavila-laravel-nova-chordpro-field/feed)WikiDiscussions main Synced 3w ago READMEChangelog (3)Dependencies (1)Versions (6)Used By (0) Laravel Nova Chordpro Field =========================== [](#laravel-nova-chordpro-field) Add a [Chordpro](https://www.chordpro.org/chordpro/chordpro-introduction/) viewer and editor into Laravel Nova. The editor is a simple TextArea. The viewer display a fully formatted song. The following chordpro code ``` {title: 005 - Tua Vontade} {subtitle: Adoradores 2} {key: E} {tempo: 75} {time: 6/8} {duration: 03:57} {c: (INTRODUÇÃO)} [E]x// [F#m7]x// [D9]x// [D9]x// [E]x// [F#m7]x// [D9]x// [D9]x// [E]Norte ou Sul, [F#m7]noite ou di[E/G#]-a eu te [A]seguirei [A] [E]Mesmo que o mundo [F#m7]me abando [E/G#]- ne eu [A]serei fiel [A] [B]Onde mandares [A]irei segurando em [E]tuas mãos [E] [B/D#]Sejas meus olhos e [A/C#]guies o meu cora[E]ção {soc} [E] Que eu [B]siga a tua vonta [B]- de e que [C#m7]sempre a missão me acompa [C#m7]- nhe Que eu [B/D#]seja a estrela da noi [B/D#]- te sempre a bri[A/E]lhar por [E]Ti [E] Eu sou [B]filho do Rei do univer [B]- so, {eoc} ``` will be rendered inside Laravel Nova Field as [![image](https://private-user-images.githubusercontent.com/8429941/273905633-1e803e48-af04-4ee2-b9c9-8b67183eb070.png?jwt=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3ODIzNzk4MTQsIm5iZiI6MTc4MjM3OTUxNCwicGF0aCI6Ii84NDI5OTQxLzI3MzkwNTYzMy0xZTgwM2U0OC1hZjA0LTRlZTItYjljOS04YjY3MTgzZWIwNzAucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI2MDYyNSUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNjA2MjVUMDkyNTE0WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9NzRlOWU5ZWJlMTI1OTEwMzA0NDI0NjVjMDUzYzg1ZGQxMGEwNmMzNzUwYmM5NDkwNmRjMzcyZjY3MzA1MGFmMiZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmcmVzcG9uc2UtY29udGVudC10eXBlPWltYWdlJTJGcG5nIn0.Kq_DydNQqcXLGhEvJoxNO3j_mACLKnd4BznNYOk2zqc)](https://private-user-images.githubusercontent.com/8429941/273905633-1e803e48-af04-4ee2-b9c9-8b67183eb070.png?jwt=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3ODIzNzk4MTQsIm5iZiI6MTc4MjM3OTUxNCwicGF0aCI6Ii84NDI5OTQxLzI3MzkwNTYzMy0xZTgwM2U0OC1hZjA0LTRlZTItYjljOS04YjY3MTgzZWIwNzAucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI2MDYyNSUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNjA2MjVUMDkyNTE0WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9NzRlOWU5ZWJlMTI1OTEwMzA0NDI0NjVjMDUzYzg1ZGQxMGEwNmMzNzUwYmM5NDkwNmRjMzcyZjY3MzA1MGFmMiZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmcmVzcG9uc2UtY29udGVudC10eXBlPWltYWdlJTJGcG5nIn0.Kq_DydNQqcXLGhEvJoxNO3j_mACLKnd4BznNYOk2zqc) also, supports dark mode [![image](https://private-user-images.githubusercontent.com/8429941/273914799-44878bb4-785f-40db-857f-928d0e19c8ee.png?jwt=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3ODIzNzk4MTQsIm5iZiI6MTc4MjM3OTUxNCwicGF0aCI6Ii84NDI5OTQxLzI3MzkxNDc5OS00NDg3OGJiNC03ODVmLTQwZGItODU3Zi05MjhkMGUxOWM4ZWUucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI2MDYyNSUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNjA2MjVUMDkyNTE0WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9NWM0ZmQ5ZjNjYzQ2Njk3MzRhNjFlYTIyZTc1NDI0YjExNTZhY2UyMmRmNTg1ODg2YTI0MzU3MjczODY3YTkyYiZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmcmVzcG9uc2UtY29udGVudC10eXBlPWltYWdlJTJGcG5nIn0.Yrm-S8DvJX6JBnh5vIFiV3FY-Nw_VyfN7zr4YrnuRjs)](https://private-user-images.githubusercontent.com/8429941/273914799-44878bb4-785f-40db-857f-928d0e19c8ee.png?jwt=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3ODIzNzk4MTQsIm5iZiI6MTc4MjM3OTUxNCwicGF0aCI6Ii84NDI5OTQxLzI3MzkxNDc5OS00NDg3OGJiNC03ODVmLTQwZGItODU3Zi05MjhkMGUxOWM4ZWUucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI2MDYyNSUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNjA2MjVUMDkyNTE0WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9NWM0ZmQ5ZjNjYzQ2Njk3MzRhNjFlYTIyZTc1NDI0YjExNTZhY2UyMmRmNTg1ODg2YTI0MzU3MjczODY3YTkyYiZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmcmVzcG9uc2UtY29udGVudC10eXBlPWltYWdlJTJGcG5nIn0.Yrm-S8DvJX6JBnh5vIFiV3FY-Nw_VyfN7zr4YrnuRjs) If the Chorpro has some invalid content, it will be displayed in Detail view [![image](https://private-user-images.githubusercontent.com/8429941/274028376-ba7b8b60-8c6c-4a41-89e6-e84caae2233e.png?jwt=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3ODIzNzk4MTQsIm5iZiI6MTc4MjM3OTUxNCwicGF0aCI6Ii84NDI5OTQxLzI3NDAyODM3Ni1iYTdiOGI2MC04YzZjLTRhNDEtODllNi1lODRjYWFlMjIzM2UucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI2MDYyNSUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNjA2MjVUMDkyNTE0WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9YmJmZWIwZWJjOTc5YTE2Y2Q2MWVlZTAwZjM3NzBlYjIxNjE3N2YwZGVlY2FmYTRjNmEzNzFlNjMxMzE3MmQzOSZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmcmVzcG9uc2UtY29udGVudC10eXBlPWltYWdlJTJGcG5nIn0.WLdvb5SSr3l-qWl8vg_KfQWuWg_s4dTpseesetUz5Js)](https://private-user-images.githubusercontent.com/8429941/274028376-ba7b8b60-8c6c-4a41-89e6-e84caae2233e.png?jwt=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3ODIzNzk4MTQsIm5iZiI6MTc4MjM3OTUxNCwicGF0aCI6Ii84NDI5OTQxLzI3NDAyODM3Ni1iYTdiOGI2MC04YzZjLTRhNDEtODllNi1lODRjYWFlMjIzM2UucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI2MDYyNSUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNjA2MjVUMDkyNTE0WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9YmJmZWIwZWJjOTc5YTE2Y2Q2MWVlZTAwZjM3NzBlYjIxNjE3N2YwZGVlY2FmYTRjNmEzNzFlNjMxMzE3MmQzOSZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmcmVzcG9uc2UtY29udGVudC10eXBlPWltYWdlJTJGcG5nIn0.WLdvb5SSr3l-qWl8vg_KfQWuWg_s4dTpseesetUz5Js) This package is built with and and allows to - Edit chordpro (simple TextArea editor) - View a fully formatted song - Display chordpro parser errors - Generate a pdf with the formatted song - Translate the displayed text like "Key", "Time", etc Prerequisites ------------- [](#prerequisites) [Laravel Nova 4+](https://nova.laravel.com/) Installation ------------ [](#installation) In a Laravel nova instance, install `henryavila/laravel-nova-chordpro-field` ``` composer require henryavila/laravel-nova-chordpro-field ``` Localization ------------ [](#localization) Publish the package language files to your application's `resources/lang/vendor` directory: ``` php artisan vendor:publish --provider="Henryavila\LaravelNovaChordproField\FieldServiceProvider" ``` Usage ----- [](#usage) Assuming you have a Nova Resource with the `chordpro` content in the `chordpro` column, the following code will render the chordpro as displayed in the image above ``` // Laravel Nova Resource use \Henryavila\LaravelNovaChordproField\ChordproField; public function fields(Request $request): array { return [ ... ChordproField::make('Chordpro') ->alwaysShow() ->rules('required'), ... ]; } ``` Usage Options ------------- [](#usage-options) OptionDescriptionDefault Value`showTabs()`Display tablature`true``useSimpleChord()`Simplify the chords. Ex: `E/G#` becomes `E``false``showChords()`Display the chords. If set to false, will display just the lyrics`true``rows()`Number of rows in the edit form`20`### Usign all options with differents values [](#usign-all-options-with-differents-values) ``` // Laravel Nova Resource use \Henryavila\LaravelNovaChordproField\ChordproField; public function fields(Request $request): array { return [ ... ChordproField::make('Chordpro') ->alwaysShow() ->rows(30) ->showTabs(false) ->useSimpleChord() ->showChords(false) ->rules('required'), ... ]; } ``` ### Health Score 25 — LowBetter than 36% of packages Maintenance20 Infrequent updates — may be unmaintained Popularity11 Limited adoption so far Community7 Small or concentrated contributor base Maturity52 Maturing project, gaining track record Bus Factor1 Top contributor holds 100% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~4 days Total 3 Last Release 982d ago ### Community Maintainers ![](https://www.gravatar.com/avatar/f05a7a5057256071ec7089d62dcf7b47d5700fe1189e7fceac681f93f2894a85?d=identicon)[henryavila](/maintainers/henryavila) --- Top Contributors [![henryavila](https://avatars.githubusercontent.com/u/8429941?v=4)](https://github.com/henryavila "henryavila (14 commits)") --- Tags laravelnova ### Embed Badge ![Health badge](/badges/henryavila-laravel-nova-chordpro-field/health.svg) ``` [![Health](https://phpackages.com/badges/henryavila-laravel-nova-chordpro-field/health.svg)](https://phpackages.com/packages/henryavila-laravel-nova-chordpro-field) ``` ### Alternatives [whitecube/nova-flexible-content Flexible Content & Repeater Fields for Laravel Nova. 8053.1M27](/packages/whitecube-nova-flexible-content)[outl1ne/nova-multiselect-field A multiple select field for Laravel Nova. 3423.2M2](/packages/outl1ne-nova-multiselect-field)[emilianotisato/nova-tinymce This Nova package allow you to use TinyMCE editor for text areas.You can customize the editor options and... you can upload images to your server and put them rigth there on the text without leaving the text editor! 116921.7k4](/packages/emilianotisato-nova-tinymce)[waynestate/nova-ckeditor4-field This nova package allows you to use CKEditor 4 for text areas. 62760.2k9](/packages/waynestate-nova-ckeditor4-field)[saumini/ellipsis-textarea A Laravel Nova textarea field with ellipsis support 11152.0k](/packages/saumini-ellipsis-textarea)[joshmoreno/nova-html-field A Laravel Nova field for rendering custom html on index, detail, and forms. 13100.8k3](/packages/joshmoreno-nova-html-field) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)