gormkracht10/laravel-open-graph-image

一个用于生成动态Open Graph图像的Laravel包

v0.7.6 2024-07-09 12:52 UTC

README

GitHub release (latest by date) Tests Packagist PHP Version Support Latest Version on Packagist Total Downloads

此Laravel包允许您使用单个Blade模板(包含HTML和CSS)动态地为您的网站创建Open Graph图像。在我们的示例中,我们使用了Tailwind CDN。因此,使用此包,作为开发者,动态创建Open Graph图像变得非常简单!

只需将我们的url添加到页面的head部分中的meta标签。然后包将生成图像并将其添加到页面中。您可以在资源文件夹中找到并编辑视图模板。

要求

  • PHP 8.1+

安装

您可以通过composer安装此包

composer require vormkracht10/laravel-open-graph-image

运行以下命令安装包

php artisan open-graph-image:install

然后您应该安装puppeteer

npm install puppeteer

并确保Puppeteer可以在您的计算机或服务器上找到正确的node和npm版本。当它找不到node或npm时,请使用以下.env变量添加自定义路径。您可以使用which nodewhich npm来找到这些二进制文件的正确路径

NODE_PATH="" // fill in output of `which node`
NPM_PATH="" // fill in output of `which npm`

您还应该发布视图,以更改您的Open Graph图像的设计

php artisan vendor:publish --tag="open-graph-image-views"

这是已发布配置文件的内容(在config/open-graph-image.php中发布)

return [
    'image' => [
        'extension' => 'jpg',
        'quality' => 100,
        'width' => 1200,
        'height' => 630,
    ],

    // The cache location to use.
    'storage' => [
        'disk' => 'public',
        'path' => 'social/open-graph',
    ],

    // Whether to use the browse URL instead of the HTML input.
    // This is slower, but makes fonts available.
    // Alternative: http
    'method' => 'html',

    'metatags' => [
        'og:title' => 'title',
        'og:description' => 'description',
        'og:type' => 'type',
        'og:url' => 'url',
    ],
];

使用

只需将此blade组件添加到页面的head部分。

<x-open-graph-image::metatags title="Vormkracht10" subtitle="Slimme websites" />

如果您不想使用blade组件,您也可以使用外观或辅助方法生成图像的url。

// Facade
use Vormkracht10\LaravelOpenGraphImage\Facades\OpenGraphImage;

OpenGraphImage::url(['title' => 'Vormkracht10', 'subtitle' => 'Slimme websites']);

// Helper
og(['title' => 'Vormkracht10', 'subtitle' => 'Slimme websites']);

当您在任何平台上分享页面时,图像将自动生成、缓存,然后显示在您的帖子中。默认模板的图像将如下所示

Default template

此组件默认使用'template' blade视图。您可以根据需要更改此模板。甚至可以传递比默认更多的属性。您可以在资源文件夹中找到默认模板。

传递额外属性

想添加更多自定义属性来修改按钮文本吗?只需将它们传递给blade组件、外观或辅助方法即可

<x-open-graph-image::metatags
    title="Vormkracht10"
    subtitle="Slimme websites"
    button="Lees meer"
/>
// Facade
use Vormkracht10\LaravelOpenGraphImage\Facades\OpenGraphImage;

OpenGraphImage::url(['title' => 'Vormkracht10', 'subtitle' => 'Slimme websites', 'button' => 'Lees meer']);

// Helper
og(['title' => 'Vormkracht10', 'subtitle' => 'Slimme websites', 'button' => 'Lees meer']);

您现在可以通过使用{{ $button }}变量在template.blade.php中访问该变量。

不使用blade组件生成图像

当您需要不使用blade组件生成图像时,您可以使用以下方法

OpenGraphImage::createImageFromParams(['title' => 'Vormkracht10', 'subtitle' => 'Slimme websites']);

这将返回配置存储的实际图像。您可以使用此方法在您的自定义控制器中生成图像,例如。

清除缓存的图像

默认情况下,所有生成的Open Graph图像都会被缓存。如果您想删除缓存,请使用以下命令

php artisan open-graph-image:clear-cache

变更日志

请参阅变更日志以获取有关最近更改的更多信息。

贡献

请参阅贡献指南以获取详细信息。

安全漏洞

请参阅我们的安全策略了解如何报告安全漏洞。

致谢

许可证

MIT许可(MIT)。更多信息请参阅许可文件