gatsby-remark-figure-caption

transform markdown image to figure with caption element

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
gatsby-remark-figure-caption
452.0.04 years ago4 years agoMinified + gzip package size for gatsby-remark-figure-caption in KB

Readme

gatsby-remark-figure-caption
Package Version Build Status Code Coverage MIT licensed
transforms: ![image with description](path-to-image.jpg) into:
<figure>
  <img src="path-to-image.jpg">
  <figcaption>image with description</figcaption>
</figure>

Install

npm install --save gatsby-remark-figure-caption

How to use

// In your gatsby-config.js
plugins: [
  {
    resolve: `gatsby-transformer-remark`,
    options: {
      plugins: [
        {
          resolve: `gatsby-remark-figure-caption`,
          options: {figureClassName: 'md-figure'},
        },
      ],
    },
  },
]

Options

| Name | Default | Description | | ---- | ------- | ----------- | | figureClassName | '' | class for the wrapper figure element | | imageClassName | '' | class for the wrapped img element | | captionClassName | '' | class for the wrapped figcaption element |

Disclaimers

only tested with gatsby v2, it may work on v1.
not really a good thing a11y-wise:
PRs welcome.