gormkracht10 / laravel-open-graph-image
一个用于生成动态Open Graph图像的Laravel包
Requires
- php: ^8.1
- illuminate/contracts: ^9.0|^10.0|^11.0
- spatie/browsershot: ^3.0|^4.0
- spatie/laravel-package-tools: ^1.14
Requires (Dev)
- laravel/pint: ^1.0
- nunomaduro/collision: ^7.0|^8.0
- nunomaduro/larastan: ^2.0.1
- orchestra/testbench: ^8.0|^9.0
- pestphp/pest: ^2.34
- pestphp/pest-plugin-laravel: ^2.2
- phpstan/extension-installer: ^1.1
- phpstan/phpstan: ^1.11
- phpstan/phpstan-deprecation-rules: ^1.0
- phpstan/phpstan-phpunit: ^1.0
- phpunit/phpunit: ^10.0
README
此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 node
和which 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']);
当您在任何平台上分享页面时,图像将自动生成、缓存,然后显示在您的帖子中。默认模板的图像将如下所示
此组件默认使用'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)。更多信息请参阅许可文件。