Social-gif-kodyfire NPM

Welcome to social-gif-kodyfire 👋

Generate a dynamic gif for social media sharing based on HTML templates using Kodyfire. This is just the beginning.

🏠 Homepage

Requirements

social-gif-kodyfire requires the kodyfire-cli to be installed

npm install -g kodyfire-cli

Install

npm install social-gif-kodyfire

Usage

Method 1: As a generator

In order to generate your artifacts, run the generate command. The syntax is kody generate|g [kody] [concept]. If you ommit kody and concept the assistant will prompt you to select them. As an example, run the following command from your terminal:

kody generate react component

Method 2: As a kody project

Refer to the kodyfire generate your artifact section. Once your project is initialized and ready for kody, run the following command to generate your images.

kody run -s kody-social-gif.json

Available Templates

`doodle` (credits: css-doodle)

Tempate using the doodle-css as animated background

Params

title string - title text
subtitle string - subtitle text
logo string - URL for the logo
googleFont string - (optional) Google font name
fontFamily string - css rule for font-family (required if using googleFont)
doodle enum - doodle background name seeding, strings, timeTravel
color string - Valid CSS color
watermark string - (optional) text for footer

Add the following params to your generated concepts. As an example, the final updated concepts might look like the following:

{
      "name": "image-3",
      "template": "doodle.html.template",
      "fontWeight": "medium",
      "fontSize": "80px",
      "title": "Hello World!",
      "subtitle": "Your subtitle",
      "eyebrow": "17 July 2022",
      "logo": "https://noqta.tn/_next/image?url=%2Fimages%2Flogo.svg&w=256&q=75",
      "background": "tranparent",
      "doodle": "timeTravel",
      "color": "#000",
      "includeWatermark": true,
      "watermark": "social-gif-kodyfire",
      "size": "facebook",
      "outputDir": ""
    }