Skip to content
command

GitHub Action

AutoGen OG Image

v1.0.1 Latest version

AutoGen OG Image

command

AutoGen OG Image

Highly customizable OG Image generator for your website(specifically for minimal-mistake)

Installation

Copy and paste the following snippet into your .yml file.

              

- name: AutoGen OG Image

uses: ambersun1234/[email protected]

Learn more about this action in ambersun1234/autogen-og-image

Choose a version

autogen-og-image

autogen-og-image is a highly customizable Open Graph image generator for your blog, specifically for mmistakes/minimal-mistakes

Description

This tool will generate the Open Graph image based on the frontmatter section in your markdown article

What is a frontmatter?

---
title: Random Article Title
description: Random article description
---

For this tool, the frontmatter will take the following attributes

Required title description date
Optional author avatar

GitHub Action

Create an action file .github/workflows/ci.yaml and fill in following content

name: Build and Deploy to Github Pages

on:
  push:
    branches:
      - master # Here source code branch is `master`, it could be other branch

jobs:
  autogen_og_image:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      - uses: mujo-code/[email protected]
      # Install the corresponding font on system if needed
      - name: Install Chinese Font
        run: |
          sudo apt update
          sudo apt install -y fonts-noto
      - uses: ambersun1234/[email protected]
        # Change author and avatar to your own(optionally)
        with:
          input_dir: ${{ github.workspace }}/_posts
          output_dir: ${{ github.workspace }}/assets/img/og
          author: "Shawn Hsu"
          avatar: "https://avatars.githubusercontent.com/u/13270428?v=4"
      - name: Commit og image and Push
        # Change the user.name and user.email to your own
        run: |
          git config --local user.name 'Shawn Hsu'
          git config --local user.email '[email protected]'
          if [ -z "$(git status --porcelain)" ]; then
            echo "Working directory clean. Nothing to commit."
            exit 0
          fi
          git add .
          git commit -m "Update og image"
          git push

For more customizable options(e.g. font size, font color), please refer to action.yml

Environment Variable

This tool also support environment variable as input
You can find various config in .env.example

Just copy to a new file .env and make some changes, you're good to go

$ cp .env.example .env

Run

$ npm run build
$ node ./dist/main.js

References

License

This project is licensed under GNU General Public License v3.0 License - see the LICENSE file for detail