area17/laravel-auto-head-tags

Laravel Auto Head Tags 帮助您构建应用程序的 head 元素列表

维护者

详细信息

github.com/area17/laravel-auto-head-tags

主页

源代码

问题

安装次数: 11 010

依赖项: 0

建议者: 0

安全: 0

星级: 46

关注者: 5

分支: 2

开放问题: 0

v1.1.7 2024-01-17 16:05 UTC

Requires

Requires (Dev)

MIT 2064a6602ae927d163fa27679d76c22200efabab

area17laravel-auto-head-tags

This package is auto-updated.

Last update: 2024-09-17 17:36:58 UTC

README

Latest Version on Packagist Software License Build Status Coverage Status Quality Score Total Downloads

描述

此包旨在简化创建所有 HTML head 标签：meta、链接、SEO、Open Graph、Twitter 以及您所需的其他标签。

此包将从发送到 Blade 的数据中抓取所需的所有信息

return view('welcome', [
    'seo' => [
        'title' => 'Your page title',

        'description' => 'The meta description for the page',

        'urls' => [
            'canonical' => 'https://site.com/the-article-slug'
        ],
    ],

    'twitter' => [
        'handle' => '@opticalcortex'
    ],

    'image' => [
        'url' => 'https://site.com/image.jpg'
    ]
]);

为您生成所需的这些标签

<title>Your page title</title>\n
<meta charset="utf-8" />\n
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />\n
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />\n
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1" />\n
<meta name="mobile-web-app-capable" content="yes" />\n
<meta name="apple-mobile-web-app-capable" content="yes" />\n
<meta name="apple-mobile-web-app-title" content="Your page title" />\n
<meta name="description" content="The meta description for the page" />\n
<meta name="msapplication-TileColor" content="#ffffff" />\n
<meta name="msapplication-config" content="/favicon/browserconfig.xml" />\n
<meta name="theme-color" content="#ffffff" />\n
<meta itemprop="description" content="The meta description for the page" />\n
<meta property="og:type" content="website" />\n
<meta property="og:title" content="Your page title" />\n
<meta property="og:site_name" content="Laravel" />\n
<meta property="og:description" content="The meta description for the page" />\n
<meta property="og:url" content="https://site.com/the-article-slug" />\n
<meta property="og:image:width" content="1200" />\n
<meta property="og:image:height" content="630" />\n
<meta name="twitter:title" content="Your page title" />\n
<meta name="twitter:site" content="@opticalcortex" />\n
<meta name="twitter:description" content="The meta description for the page" />\n
<meta name="twitter:url" content="https://site.com/the-article-slug" />\n
<meta name="twitter:card" content="summary_large_image" />\n
<meta name="twitter:creator" content="@opticalcortex" />\n
<link rel="manifest" href="/favicon/site.webmanifest" />\n
<link rel="icon" href="/favicon/favicon.ico" />\n
<link rel="icon" type="image/png" sizes="32x32" href="/favicon/favicon-32x32.png" />\n
<link rel="icon" type="image/png" sizes="16x16" />\n
<link rel="apple-touch-icon" sizes="180x180" href="/favicon/apple-touch-icon.png" />\n
<link rel="mask-icon" href="/favicon/safari-pinned-tab.svg" color="#1d1d1d" />\n
<link rel="shortcut icon" href="/favicon/favicon.ico" />\n
<link rel="canonical" href="https://site.com/the-article-slug" />

标签列表更长，但如果您没有提供足够的信息来创建这些标签，则不会创建。

安装

通过 Composer

composer require area17/laravel-auto-head-tags

发布配置文件

php artisan vendor:publish --provider="A17\LaravelAutoHeadTags\ServiceProvider"

使用

将其添加到您的 blade 模板

将标签 @head 添加到您的主模板

<!DOCTYPE html>
<html lang="{{ locale() }}">
    <head>
        @head

        ...
    </head>

    ...
</html>

此指令也是可配置的，只需发布配置并更改 blade.directive。

配置

所有可用的标签都在配置文件中：config/laravel-auto-head-tags.yaml，一切均可配置。以下是标签部分的示例

# TAGS
tags:
    # META

    # HEAD
    meta:
    - charset: "{head.charset}|utf-8"
    - name: viewport
      content: "{head.viewport}|width=device-width, initial-scale=1.0, minimum-scale=1"
    - name: author
      content: "{head.author}"
    - http-equiv: "X-UA-Compatible"
      content: "{head.httpEquiv}|IE=Edge"
    - name: mobile-web-app-capable
      content: "{head.mobile-web-app-capable}|yes"
    - name: apple-mobile-web-app-capable
      content: "{head.apple-mobile-web-app-capable}|yes"
    - name: apple-mobile-web-app-title
      content: "{head.apple-mobile-web-app-title}|{og.title}|{$config.app.name}"

您可以使用 {} 定义宏来访问 Blade 数据，该包可以使用数组的 "点" 表示法解析它们

content: "{head.author}"

您可以为这些宏定义任意数量的回退

title: "{title}|{head.title}|{seo.title}|{og.title}|{$config.app.name}"

您还可以访问 Laravel 配置中的数据

content: "{$config.app.name}"

如果需要为单个标签定义生成多个 URL，则存在 loop 概念

- rel: canonical
  href: "{seo.urls.canonical}"
- rel: alternate
  href: "{seo.urls.hreflang:value}"
  hreflang: "{seo.urls.hreflang:key}"

如果 seo.urls.hreflang 是一个由区域（key）和 URL（value）组成的数组，则此配置将生成这些标签

<link rel="canonical" href="http://site.com/fr/events/event-slug" />
<link rel="alternate" href="http://site.com/fr/evenements/event-slug" hreflang="fr" />
<link rel="alternate" href="http://site.com/en/events/event-slug" hreflang="en" />

变更日志

请参阅 CHANGELOG 了解最近更改的详细信息。

测试

$ composer test

贡献

请参阅 CONTRIBUTING 和 CODE_OF_CONDUCT 了解详细信息。

安全

如果您发现任何与安全相关的问题，请通过电子邮件 antonio@area17.com 联系，而不是使用问题跟踪器。

鸣谢

许可

MIT 许可证 (MIT)。有关更多信息，请参阅 许可文件。