Learn about our RFC process, Open RFC meetings & more.Join in the discussion! »

eleventy-plugin-cloudinary

0.0.1 • Public • Published

{% cloudinaryImage %}

An Eleventy shortcode that allows you to add an image from your cloudinary account.

What does it do?

Turns the config like this:

  eleventyConfig.cloudinaryCloudName = 'cloud-name-here'
  eleventyConfig.addShortcode('cloudinaryImage', function (path, transforms, alt) {
    return `<img src="https://res.cloudinary.com/${eleventyConfig.cloudinaryCloudName}/${transforms}/${path}" alt="${alt}">`
  })

and shortcodes like this:

{% cloudinaryImage
  "cat-photo.jpg",
  "f_auto",
  "Picture of a cat"
%}

into an <img> tag, like this:

<img src="https://res.cloudinary.com/cloud-name-here/f_auto/cat-photo.jpg" alt="Picture of a cat">

Installation

Copy the config above and open up your Eleventy config file (probably .eleventy.js) and then set your cloudinaryCloudName

Helpful

Usage

Use the following shortcode snippet in your Markdown file:

{% cloudinaryImage "sample.jpg", "w_320,f_auto", "Cloudinary Sample Image" %}

Cloudinary Sameple Image

Todo

  • add to npmjs.org and create install instructions
  • setup fallback settings

Thanks

Install

npm i eleventy-plugin-cloudinary

DownloadsWeekly Downloads

5

Version

0.0.1

License

MIT

Unpacked Size

4.87 kB

Total Files

5

Last publish

Collaborators

  • avatar