https://github.com/bnomei/kirby3-fontselector
Kirby Plugin to select font family and font weight with two synced fields
https://github.com/bnomei/kirby3-fontselector
family fields font kirby kirby-cms kirby-plugin kirby3 kirby4 kirby5 sync watch weight
Last synced: 16 days ago
JSON representation
Kirby Plugin to select font family and font weight with two synced fields
- Host: GitHub
- URL: https://github.com/bnomei/kirby3-fontselector
- Owner: bnomei
- License: mit
- Created: 2022-05-19T14:29:45.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2025-09-17T18:18:23.000Z (about 1 month ago)
- Last Synced: 2025-09-17T20:50:07.006Z (about 1 month ago)
- Topics: family, fields, font, kirby, kirby-cms, kirby-plugin, kirby3, kirby4, kirby5, sync, watch, weight
- Language: PHP
- Homepage:
- Size: 1.01 MB
- Stars: 13
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Kirby Font Selector
[](https://getkirby.com)
[](https://discordapp.com/users/bnomei)
[](https://www.buymeacoffee.com/bnomei)
Kirby Plugin to select font family and font weight with two synced fields
## Installation
- unzip [master.zip](https://github.com/bnomei/kirby3-fontselector/archive/master.zip) as folder `site/plugins/kirby3-fontselector` or
- `git submodule add https://github.com/bnomei/kirby3-fontselector.git site/plugins/kirby3-fontselector` or
- `composer require bnomei/kirby3-fontselector`
## Screenshot
## Fonts
Set the fonts you want to use with a config value. You could use a custom JSON file or return a php array.
**assets/fonts.json**
```json
{
"fonts": [
{
"font": "Merriweather",
"weight": [
600,
700
]
},
{
"font": "Montserrat",
"weight": [
300,
400,
500
]
}
]
}
```
```php
function() {
return Json::read(kirby()->roots()->assets() . '/fonts.json');
// return ['fonts' => [...]];
},
// other options
];
```
## Usage
Add the fields to your page blueprint.
**site/blueprints/default.yml**
```yaml
fields:
headlinefont:
type: fontfamily
default: Merriweather
required: true
# reload: true # optional reload on save
headlineh1weight:
type: fontweight
watchField: headlinefont
default: 700
required: true
headlineh2weight:
type: fontweight
watchField: headlinefont
default: 600
required: true
copytextfont:
type: fontfamily
default: Montserrat
required: true
copytextweight:
type: fontweight
watchField: copytextfont
default: 400
required: true
```
> [!WARNING]
> This plugin has by default a 1 minute cache.
## Settings
| bnomei.fontselector. | Default | Description |
|----------------------|----------------------|------------------------------------|
| fonts | `function(){...}` | callback to return the fonts array |
| expire | `1` | cache will expire n-minutes |
## Disclaimer
This plugin is provided "as is" with no guarantee. Use it at your own risk and always test it yourself before using it in a production environment. If you find any issues, please [create a new issue](https://github.com/bnomei/kirby3-fontselector/issues/new).
## License
[MIT](https://opensource.org/licenses/MIT)
It is discouraged to use this plugin in any project that promotes racism, sexism, homophobia, animal abuse, violence or any other form of hate speech.