包简介

HTML meta tags generator for Kirby 3.

README 文档

README

HTML meta tags generator for Kirby. Supports Open Graph, Twitter Cards, and JSON Linked Data out of the box.

Requirements

Kirby 3
PHP 7.1+

Installation

Download

Download and copy this repository to site/plugins/meta-tags.

Git submodule

git submodule add https://github.com/pedroborges/kirby-meta-tags.git site/plugins/meta-tags

Composer

composer require pedroborges/kirby-meta-tags

For Kirby 2, you can download v1.1.1 and copy the files to site/plugins/meta-tags.

Basic Usage

After installing the Meta Tags plugin, you need to add one line to the head element on your template, or header.php snippet:

<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
+   <?php echo $page->metaTags() ?>

By default the metaTags page method will render all tag groups at once. But you can also render only one tag at a time:

<?php echo $page->metaTags('title') ?>

Or specify which tags to render:

<?php echo $page->metaTags(['og', 'twitter', 'json-ld']) ?>

Default

The plugin ships with some default meta tags enabled for your convenience:

return [
    // other options...
    'pedroborges.meta-tags.default' => function ($page, $site) {
        return [
            'title' => $site->title(),
            'meta' => [
                'description' => $site->description()
            ],
            'link' => [
                'canonical' => $page->url()
            ],
            'og' => [
                'title' => $page->isHomePage()
                    ? $site->title()
                    : $page->title(),
                'type' => 'website',
                'site_name' => $site->title(),
                'url' => $page->url()
            ]
        ];
    }
]

The pedroborges.meta-tags.default option is applied to all pages on your Kirby site. Of course you can change the defaults. In order to do that, just copy this example to your site/config/config.php file and tweak it to fit your website needs.

Templates

Following the flexible spirit of Kirby, you also have the option to add template specific meta tags:

return [
    // other options...
    'pedroborges.meta-tags.templates' => function ($page, $site) {
        return [
            'song' => [
                'og' => [
                    'type' => 'music.song',
                    'namespace:music' => [
                        'duration' => $page->duration(),
                        'album' => $page->parent()->url(),
                        'musician' => $page->singer()->html()
                    ]
                ]
            ]
        ];
    }
]

In the example above, those settings will only be applied to pages which template is song.

For more information on all the meta, link, Open Graph and Twitter Card tags available, check out these resources:

Options

Both the pedroborges.meta-tags.default and pedroborges.meta-tags.templates accept similar values:

`pedroborges.meta-tags.default`

It accepts an array containing any or all of the following keys: title, meta, link, og, and twitter. With the exception of title, all other groups must return an array of key-value pairs. Check out the tag groups section to learn which value types are accepted by each key.

'pedroborges.meta-tags.default' => function ($page, $site) {
    return [
        'title' => 'Site Name',
        'meta' => [ /* meta tags */ ],
        'link' => [ /* link tags */ ],
        'og' => [ /* Open Graph tags */ ],
        'twitter' => [ /* Twitter Card tags */ ],
        'json-ld' => [ /* JSON-LD schema */ ],
    ];
}

`pedroborges.meta-tags.templates`

This option allows you to define a template specific set of meta tags. It must return an array where each key corresponds to the template name you are targeting.

'pedroborges.meta-tags.templates' => function ($page, $site) {
    return [
        'article' => [ /* tags groups */ ],
        'about' => [ /* tags groups */ ],
        'products' => [ /* tags groups */ ],
    ];
}

When a key matches the current page template name, it is merged and overrides any repeating properties defined on the pedroborges.meta-tags.default option so you don't have to repeat yourself.

Tag Groups

These groups accept string, closure, or array as their values. Being so flexible, the sky is the limit to what you can do with Meta Tags!

`title`

Corresponds to the HTML <title> element and accepts a string as value.

'title' => $page->isHomePage()
    ? $site->title()
    : $page->title(),

You can also pass it a closure that returns a string if the logic to generate the title is more complex.

`meta`

The right place to put any generic HTML <meta> elements. It takes an array of key-value pairs. The returned value must be a string or closure.

'meta' => [
    'description' => $site->description(),
    'robots' => 'index,follow,noodp'
],

Show HTML 👁

<meta name="description" content="Website description">
<meta name="robots" content="index,follow,noodp">

`link`

This tag group is used to render HTML <link> elements. It takes an array of key-value pairs. The returned value can be a string, array, or closure.

'link' => [
    'stylesheet' => url('assets/css/main.css'),
    'icon' => [
      ['href' => url('assets/images/icons/favicon-62.png'), 'sizes' => '62x62', 'type' =>'image/png'],
      ['href' => url('assets/images/icons/favicon-192.png'), 'sizes' => '192x192', 'type' =>'image/png']
    ],
    'canonical' => $page->url(),
    'alternate' => function ($page) {
        $locales = [];

        foreach (kirby()->languages() as $language) {
            if ($language->code() == kirby()->language()) continue;

            $locales[] = [
                'hreflang' => $language->code(),
                'href' => $page->url($language->code())
            ];
        }

        return $locales;
    }
],

Show HTML 👁

<link rel="stylesheet" href="https://pedroborg.es/assets/css/main.css">
<link rel="icon" href="https://pedroborg.es/assets/images/icons/favicon-62.png" sizes="62x62" type="image/png">
<link rel="icon" href="https://pedroborg.es/assets/images/icons/favicon-192.png" sizes="192x192" type="image/png">
<link rel="canonical" href="https://pedroborg.es">
<link rel="alternate" hreflang="pt" href="https://pt.pedroborg.es">
<link rel="alternate" hreflang="de" href="https://de.pedroborg.es">

`og`

Where you can define Open Graph <meta> elements.

'og' => [
    'title' => $page->title(),
    'type' => 'website',
    'site_name' => $site->title(),
    'url' => $page->url()
],

Show HTML 👁

<meta property="og:title" content="Passionate web developer">
<meta property="og:type" content="website">
<meta property="og:site_name" content="Pedro Borges">
<meta property="og:url" content="https://pedroborg.es">

Of course you can use Open Graph structured objects. Let's see a blog post example:

'pedroborges.meta-tags.templates' => function ($page, $site) {
    return [
        'article' => [ // template name
            'og' => [  // tags group name
                'type' => 'article', // overrides the default
                'namespace:article' => [
                    'author' => $page->author(),
                    'published_time' => $page->date('Y-m-d'),
                    'modified_time' => $page->modified('Y-m-d'),
                    'tag' => ['tech', 'web']
                ],
                'namespace:image' => function(Page $page) {
                    $image = $page->cover()->toFile();
    
                    return [
                        'image' => $image->url(),
                        'height' => $image->height(),
                        'width' => $image->width(),
                        'type' => $image->mime()
                    ];
                }
            ]
        ]
    ];
}

Show HTML 👁

<!-- merged default definition -->
<title>Pedro Borges</title>
<meta name="description" content="Passionate web developer">
<meta property="og:title" content="How to make a Kirby plugin">
<meta property="og:site_name" content="Pedro Borges">
<meta property="og:url" content="https://pedroborg.es/blog/how-to-make-a-kirby-plugin">
<!-- template definition -->
<meta property="og:type" content="article">
<meta property="og:article:author" content="Pedro Borges">
<meta property="og:article:published_time" content="2017-02-28">
<meta property="og:article:modified_time" content="2017-03-01">
<meta property="og:article:tag" content="tech">
<meta property="og:article:tag" content="web">
<meta property="og:image" content="https://pedroborg.es/content/blog/how-to-make-a-kirby-plugin/code.jpg">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:type" content="image/jpeg">

Use the namespace: prefix for structured properties:

author inside namespace:article becomes og:article:author.
image inside namespace:image becomes og:image.
width inside namespace:image becomes og:image:width.

When using Open Graph tags, you will want to add the prefix attribute to the html element as suggested on their docs: <html prefix="og: http://ogp.me/ns#">

`twitter`

This tag group works just like the previous one, but it generates <meta> tags for Twitter Cards instead.

'twitter' => [
    'card' => 'summary',
    'site' => $site->twitter(),
    'title' => $page->title(),
    'namespace:image' => function ($page) {
        $image = $page->cover()->toFile();

        return [
            'image' => $image->url(),
            'alt' => $image->alt()
        ];
    }
]

Show HTML 👁

<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="@pedroborg_es">
<meta name="twitter:title" content="My blog post title">
<meta name="twitter:image" content="https://pedroborg.es/content/blog/my-article/cover.jpg">
<meta name="twitter:image:alt" content="Article cover image">

`json-ld`

Use this tag group to add JSON Linked Data schemas to your website.

'json-ld' => [
    'Organization' => [
        'name' => $site->title()->value(),
        'url' => $site->url(),
        "contactPoint" => [
            '@type' => 'ContactPoint',
            'telephone' => $site->phoneNumber()->value(),
            'contactType' => 'customer service'
        ]
    ]
]

If you leave them out, http://schema.org will be added as @context and the array key will be added as @type.

Show HTML 👁

<script type="application/ld+json">
{
    "@context": "http://schema.org",
    "@type": "Organization",
    "name": "Example Co",
    "url": "https://example.com",
    "contactPoint": {
        "@type": "ContactPoint",
        "telephone": "+1-401-555-1212",
        "contactType": "customer service"
    }
}
</script>

Change Log

All notable changes to this project will be documented at: https://github.com/pedroborges/kirby-meta-tags/blob/master/CHANGELOG.md

License

The Meta Tags plugin is open-sourced software licensed under the MIT license.

pedroborges/kirby-meta-tags 适用场景与选型建议

pedroborges/kirby-meta-tags 是一款基于 PHP 开发的 Composer 扩展包，目前已累计 23.33k 次下载、GitHub Stars 达 96，最近一次更新时间为 2019 年 02 月 21 日，在 PHP 生态内属于活跃度较高的组件。

它主要适用于以下技术方向：「JSON-LD」「open-graph」「meta-tags」「twitter-cards」「kirby-plugin」等业务场景。在实际项目中，围绕这些方向常见需要落地的问题包括：接口对接、性能调优、并发安全、与既有框架（Laravel / ThinkPHP / Yii / Webman 等）的兼容适配，以及生产环境的日志埋点与稳定性保障。

我们在过去多个企业项目中使用过 pedroborges/kirby-meta-tags 或与其功能相近的方案，如果你在选型或落地过程中遇到问题，例如 版本兼容、二次改造、私有化封装、与内部系统对接、生产 BUG 排查，欢迎联系我们协助评估。

围绕 pedroborges/kirby-meta-tags 我们能提供哪些服务？

定制开发 / 二次开发

基于 pedroborges/kirby-meta-tags 在你已有业务上做功能扩展、字段裁剪、UI 适配、与内部账号 / 权限 / 日志系统的深度对接。

BUG 修复 & 性能优化

线上偶发问题、内存泄漏、慢查询、并发异常等排查修复；针对高流量场景做缓存、队列、索引层面的调优。

项目外包 & 长期维护

承接完整的项目从需求 → 设计 → 开发 → 上线 → 长期运维；也可按月提供技术保姆服务。

yvsm@zunyunkeji.com QQ：316430983 微信：yvsm316 西安尊云信息科技 · 专注 PHP / Go / 分布式系统研发

与 pedroborges/kirby-meta-tags 相关的其它包

同方向 / 同关键字的高下载量 PHP Composer 包推荐，方便对比选型：

netgen/open-graph-bundle 14

Netgen Open Graph Bundle is an Ibexa Platform bundle that allows simple integration with Open Graph protocol.

davmixcool/laravel-meta-manager 150

Laravel Meta Manager is an SEO tool that is used to improve SEO of a website or specific page by adding recommended meta tags to your application.

izica/phalcon-meta-tags 12

Phalcon PHP Meta tags service

wearejust/kirby-meta-tags 5

HTML meta tags generator for Kirby 3.

webnuvola/laravel-json-ld 5

Laravel wrapper for torann/json-ld

sweetrdf/json-ld 3

JSON-LD Processor for PHP

pedroborges/kirby-meta-tags

包简介

关键字：

README 文档

README

Requirements

Installation

Download

Git submodule

Composer

Basic Usage

Default

Templates

Options

`pedroborges.meta-tags.default`

`pedroborges.meta-tags.templates`

Tag Groups

`title`

`meta`

`link`

`og`

`twitter`

`json-ld`

Change Log

License

pedroborges/kirby-meta-tags 适用场景与选型建议

与 pedroborges/kirby-meta-tags 相关的其它包

统计信息

GitHub 信息

其他信息