flowframe/og-image-client

This package is abandoned and no longer maintained. No replacement package was suggested.

This Laravel package allows you to easily create Open Graph images for your application or website.

v0.0.2 2021-06-19 10:07 UTC

This package is auto-updated.

Last update: 2023-02-19 14:04:55 UTC


README

This Laravel package allows you to easily create Open Graph images for your application or website. Please go here if you're looking for the back-end repo.

Support us

68747470733a2f2f666c6f776672612e6d652f6769746875622d61642e706e67

Like our work? You can support us by sponsoring or purchasing one of our products and services.

Installation

You can install the package via composer:

composer require flowframe/og-image-client

You can easily publish the config like so:

php artisan og-image-client:install

Usage

Once you have setup up the server you can start using the client side package.

First, setup your .env:

OG_IMAGE_URL=<your_server_url> // https://your-app-on.vercel.com/api

OG_IMAGE_TEMPLATE_PATH=<your_template_path> // default _og-image, we recommend to keep this

OG_IMAGE_SECRET_TOKEN=<your_secret_token_from_server>

Don't forget to add the /api suffix.

And then generate your image:

// helper function, you can also use the Facade: `OgImageClient::generate(...)`
$image = og()->generate([
    'template' => '_og-images/example', // resources/views/_og-images/example.blade.php

    // Attributes which will be used in the template view
    'title' => 'Hello Flowframe',
    'subtitle' => 'How are you doing?',

    // Array are also supported
    'options' => [
        'Wow',
        'Much',
        'Cool',
    ],
]);

When developing locally you can also preview your image by doing:

return og()->preview([
    'template' => '_og-images/example',
    'title' => 'Hello Flowframe',
    'subtitle' => 'How are you doing?',
    'options' => [
        'Wow',
        'Much',
        'Cool',
    ],
]);

This will render the template with data.

Templates

The templates get served from the website itself. Alternatively, you can override the url inside the payload to point to another site.

You're free in where you place the template, we suggest to place it in resources/views/_og-images.

Here's an example of a template:

<!-- HTML scaffolding... -->

<body>
    <div>
        <h1>{{ $payload['title] }}</h1>

        <p>{{ $payload['subtitle] }}</p>

        <ul>
            @foreach($payload['options'] as $option)
                <li>{{ $option }}</li>
            @endforeach
        </ul>
    </div>
</body>

Be aware that nullable values could raise an error. You can easily avoid it by creating classes which require you to implement certain fields or simple do: {{ $payload['title] ?? '' }}.

Security Vulnerabilities

Please review our security policy on how to report security vulnerabilities.

Credits

License

The MIT License (MIT). Please see License File for more information.