feat: intégration plugin Kirby SEO
All checks were successful
Deploy / Deploy to Production (push) Successful in 22s
All checks were successful
Deploy / Deploy to Production (push) Successful in 22s
- Ajout de tobimori/kirby-seo via Composer
- snippet('seo/head') dans header.php (remplace les meta manuels)
- snippet('seo/schemas') dans footer.php pour JSON-LD
- Onglet SEO ajouté dans site.yml et tous les blueprints de pages
- Configuration SEO dans config.php (sitemap, robots, canonicalBase TODO)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
isUnknown
parent
baab2fb3a1
commit
58c31ea391
133 changed files with 9201 additions and 253 deletions
141
site/plugins/kirby-seo/docs/0_getting-started/0_quickstart.md
Normal file
141
site/plugins/kirby-seo/docs/0_getting-started/0_quickstart.md
Normal file
|
|
@ -0,0 +1,141 @@
|
|||
---
|
||||
title: Quickstart
|
||||
intro: "All you need to get started with Kirby SEO: Installation & initial configuration"
|
||||
---
|
||||
|
||||
## Requirements
|
||||
|
||||
Kirby SEO requires
|
||||
|
||||
- Kirby 5 or later
|
||||
- PHP 8.3, 8.4 or 8.5
|
||||
|
||||
Composer is required for full feature support (e.g. schema.org support, background queuing). [Composer](https://getcomposer.org/) is a dependency manager for PHP. If you have never used Composer before, follow the instruction on the [Composer website](https://getcomposer.org/doc/00-intro.md).
|
||||
|
||||
## Installing Kirby SEO
|
||||
|
||||
In a terminal window, navigate to the folder of your Kirby installation. Then run the following command:
|
||||
|
||||
```bash
|
||||
composer require tobimori/kirby-seo
|
||||
```
|
||||
|
||||
Some features require additional packages. Install them when you need them:
|
||||
|
||||
- [Schema.org](2_customization/08_schema-org) requires `spatie/schema-org`
|
||||
- Background Processing (coming soon)
|
||||
|
||||
<details>
|
||||
<summary>Manual Installation</summary>
|
||||
|
||||
If you prefer not to use Composer, you can manually install Kirby SEO. Go to the [GitHub releases page](https://github.com/tobimori/kirby-seo/releases) and find the latest release. Click on "Assets" to expand it and select "Source code (zip)". Extract the contents of the zip file into the `site/plugins/kirby-seo` folder of your Kirby installation.
|
||||
|
||||
</details>
|
||||
|
||||
## Add meta tags to your site
|
||||
|
||||
Kirby SEO needs two snippets in your HTML: one in the `<head>` for meta tags, and one before `</body>` for structured data.
|
||||
|
||||
Find the place in your code where you output the `<head>` tag, this is usually a shared snippet like `header.php` or a layout file. Add the `seo/head` snippet to your `<head>` and the `seo/schemas` snippet before the `</body>` closing tag:
|
||||
|
||||
```php
|
||||
<html lang="<?= $site->lang() ?>">
|
||||
<head>
|
||||
<?php snippet('seo/head'); ?>
|
||||
</head>
|
||||
<body>
|
||||
[...]
|
||||
<?php snippet('seo/schemas'); ?>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
Make sure your `<html>` tag also includes the `lang` attribute as shown above. Browsers use it for automatic hyphenation, and Google uses it to determine the language of your page.
|
||||
|
||||
Now open your site in a browser and view the page source. You should already see `<title>`, `<meta>` and Open Graph tags in your `<head>`. The plugin fills them with sensible defaults out of the box.
|
||||
|
||||
## Editing meta tags in the panel
|
||||
|
||||
Next, you want to give your editors control over the SEO fields. Add the SEO tab to your site blueprint:
|
||||
|
||||
```yaml
|
||||
# site/blueprints/site.yml
|
||||
tabs:
|
||||
content:
|
||||
fields:
|
||||
# move your existing fields here
|
||||
seo: seo # <--- add this
|
||||
```
|
||||
|
||||
This gives you global defaults for meta titles, descriptions and social images. Any page without its own SEO settings will use these.
|
||||
Learn more about how defaults work in [Your first Meta Tags](0_getting-started/1_your-first-meta-tags).
|
||||
|
||||
And now add the SEO tab to any page blueprint where editors should be able to override the defaults:
|
||||
|
||||
```yaml
|
||||
# site/blueprints/pages/default.yml
|
||||
tabs:
|
||||
content:
|
||||
fields:
|
||||
# move your existing fields here
|
||||
seo: seo # <--- add this
|
||||
```
|
||||
|
||||
Open the Panel and navigate to any page. You'll see a new SEO tab with fields for meta title, description, social images and more.
|
||||
|
||||
Try it: enter a custom meta title, save, and reload the page in your browser. View the source, your title is there.
|
||||
|
||||
Now delete the title you just entered and reload again. The plugin falls back to your page's regular title.
|
||||
|
||||
This is the **Meta Cascade**, the plugin always finds the best available value, so you only need to fill in fields when you want to override the default. [Learn more about the Meta Cascade](0_getting-started/1_your-first-meta-tags).
|
||||
|
||||
## Set your canonical URL
|
||||
|
||||
To prevent duplicate content issues (e.g. if your site is reachable with and without `www`), tell the plugin which URL is the canonical one:
|
||||
|
||||
```php
|
||||
// site/config/config.php
|
||||
return [
|
||||
// [...]
|
||||
'tobimori.seo' => [
|
||||
'canonical' => [
|
||||
'base' => 'https://www.example.com',
|
||||
],
|
||||
]
|
||||
];
|
||||
```
|
||||
|
||||
Reload your page and check the source. You'll see a `<link rel="canonical">` tag pointing to your configured domain.
|
||||
|
||||
## Single-language setup
|
||||
|
||||
If you're not using Kirby's [multi-language feature](https://getkirby.com/docs/guide/languages), set your language code so the plugin can generate the correct `og:locale` tag:
|
||||
|
||||
```php
|
||||
// site/config/config.php
|
||||
return [
|
||||
// [...]
|
||||
'tobimori.seo' => [
|
||||
'canonical' => [
|
||||
'base' => 'https://www.example.com',
|
||||
],
|
||||
'locale' => 'en_US',
|
||||
],
|
||||
];
|
||||
```
|
||||
|
||||
If you already added the canonical config above, add `lang` to the same `tobimori.seo` block.
|
||||
|
||||
If you already have multi-language set up in Kirby the plugin will pick up the language automatically.
|
||||
|
||||
## Purchase license & activate your installation
|
||||
|
||||
Once you publish your website, you need to purchase a Kirby SEO license. We will send you a unique license code for your domain. You can activate your license with the following steps:
|
||||
|
||||
1. Open the Panel at `https://example.com/panel` and log in.
|
||||
2. Click on the "Metadata & SEO" tab, and click on "Activate" in the top right.
|
||||
3. Enter your license code and your email address and press "Activate".
|
||||
|
||||
It is not required to activate your license locally.
|
||||
|
||||
## Where to go from here
|
||||
|
|
@ -0,0 +1,81 @@
|
|||
---
|
||||
title: Your First Meta Tags
|
||||
intro: Learn how Kirby SEO decides which meta data to show and how to control it at every level
|
||||
---
|
||||
|
||||
In the Quickstart, you installed Kirby SEO and saw meta tags appear in your source code. Now let's look at how to control what shows up, and where.
|
||||
|
||||
## Start with a site-wide default
|
||||
|
||||
Open the Panel, and click on "Metadata & SEO". You'll see something like this:
|
||||
|
||||
|
||||
|
||||
Quite empty, but these are your global defaults. Every page that doesn't have its own meta data will use what you set here.
|
||||
|
||||
### Meta title templates
|
||||
|
||||
You probably don't want to write a custom meta title for every page. Kirby SEO lets you define a **title template** at the site level.
|
||||
|
||||
Go to the Site SEO tab and find the title template field. Click the buttons to insert placeholders like **Page Title** or **Site Title**, and type any separator you want between them.
|
||||
|
||||
A template like `Page Title | Site Title` turns a page called "About" on a site called "My Blog" into:
|
||||
|
||||
```
|
||||
About | My Blog
|
||||
```
|
||||
|
||||
Every page that doesn't have a custom meta title will use this pattern automatically.
|
||||
|
||||
### Set a default description
|
||||
|
||||
Below that, you'll find the Page Description field. Enter a default description like "A blog about good food." and save.
|
||||
|
||||
Open any page on your site and view the source. Every page shows this description, because no page has its own yet.
|
||||
|
||||
### Override on a single page
|
||||
|
||||
Navigate to a specific page in the Panel, and open its Metadata & SEO tab. You'll find a slightly different interface than the site tab:
|
||||
|
||||
|
||||
|
||||
Enter a different description. Save and reload that page in the browser.
|
||||
|
||||
That page now shows its own description. Every other page still shows "A blog about good food."
|
||||
|
||||
### Remove the override
|
||||
|
||||
Delete the description you just entered on the page and save. Reload — the page falls back to the site-wide default again.
|
||||
|
||||
What you just experienced is the **Meta Cascade**. Kirby SEO looks for values in multiple places and uses the most specific one it finds:
|
||||
|
||||
1. **Page fields**: the Metadata & SEO tab on a specific page
|
||||
2. **Programmatic content**: values set in a Page Model via `metaDefaults()`
|
||||
3. **Parent page**: inherited from the parent page (if enabled)
|
||||
4. **Fallback fields**: Open Graph tags fall back to their Meta counterparts
|
||||
5. **Site globals**: the Metadata & SEO tab on the Site
|
||||
6. **Plugin defaults**
|
||||
|
||||
The idea is simple: you set sensible defaults once at the site level, and only override where you need something different. Most pages will never need more than a description in their Metadata & SEO tab.
|
||||
|
||||
## Inheriting settings
|
||||
|
||||
So far you've seen two levels: site defaults and page overrides. But what if you have a section of your site — like a blog — where all pages should share specific settings that are different from the rest of your site?
|
||||
|
||||
Open a page's Metadata & SEO tab and use the Inherit settings field. Select which settings should be passed down to its child pages: title templates, descriptions, Open Graph, robots directives, or all at once. Child pages can still override anything individually.
|
||||
|
||||
|
||||
|
||||
## Open Graph & Social
|
||||
|
||||
When someone shares a link to your site on Facebook, Mastodon, Slack or WhatsApp, these platforms look for Open Graph tags in your HTML to build a preview card. The [Open Graph Protocol](https://ogp.me/) is a standard originally created by Facebook that defines how a page's title, description and image appear when shared.
|
||||
|
||||
Kirby SEO generates these tags automatically. The SEO tab has separate fields for Open Graph titles, descriptions and images, but you usually don't need to fill them in. If you don't set an OG title, the plugin uses your meta title. If you don't set an OG image, it uses the default from your site settings.
|
||||
|
||||
Set a default OG image in the Site SEO tab so every shared link has a preview image, even if you don't set one per page.
|
||||
|
||||
## What's next
|
||||
|
||||
You now know how to control your meta tags, title templates and social previews. The rest of the docs cover individual features in detail:
|
||||
|
||||
// TODO: add links
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 98 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 169 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 118 KiB |
Loading…
Add table
Add a link
Reference in a new issue