diff --git a/docs/sources/write/shortcodes/index.md b/docs/sources/write/shortcodes/index.md index baff3d7d6..c4a28101c 100644 --- a/docs/sources/write/shortcodes/index.md +++ b/docs/sources/write/shortcodes/index.md @@ -258,10 +258,14 @@ To add a figure, insert the `figure` shortcode with the following named paramete | `alt` | If set, `alt` specifies the alt text for the image. | no | | `animated-gif` | If set, the HTML contains a div with an image link instead of a `
` element. It's typically used for animated screenshots. Shortcode parameters other than the _caption_ and _maxWidth_ parameters are ignored. | no | | `caption` | Describes the figure using a [`
`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/figcaption) element. | no | -| `class` | Can be optionally used to override the HTML class for the `
` element. | no | +| `caption-align` | Can be used to change the alignment of the `caption` property. Accepted values are `left`, `center`, and `right`. | no | +| `class` | Can be used to override the HTML class for the `
` element. | no | +| `link-class` | Can be used to override the HTML class for the `` element. | no | | `lazy` | If set to `"false"`, an additional `lazyload` class is **not** applied to the image. The `lazyload` class lets a browser render a page before the figure image loads. Once the image loads, the placeholder box transitions to the loaded image. Defaults to `"true"`. | no | | `lightbox` | If set to `"true"`, an additional `figure-wrapper__lightbox` class is applied to the `
`. | no | | `link` | If set the value overrides the `src` shortcode parameter as the value to the `href` in the `` element in the `
`. | no | +| `height` | If set, `_height_` controls the height of the `
` using the [`height`](https://developer.mozilla.org/en-US/docs/Web/CSS/height) CSS property. When specifying a length or percentage, value should include unit of measurement, for example `"75px"` or `"25%"`. | no | +| `width` | If set, `_width_` controls the width of the `
` using the [`width`](https://developer.mozilla.org/en-US/docs/Web/CSS/width) CSS property. When specifying a length or percentage, value should include unit of measurement, for example `"75px"` or `"25%"`. | no | | `max-width` | If set, `_max-width_` controls the maximum width of the `
` using the [`max-width`](https://developer.mozilla.org/en-US/docs/Web/CSS/max-width) CSS property. When specifying a length or percentage, value should include unit of measurement, for example `"75px"` or `"25%"`. | no | | `show-caption` | If set to `"true"`, the rendered `
` includes a `
` element with the caption set in _caption_. Defaults to `"true"`. | no | | `src` | Sets the source of the image. | yes | @@ -280,6 +284,12 @@ In this example, the image's display size is changed to have a maximum width of {{}} ``` +In this example, the image's display size is changed to have a width of 500px, and the `class` and `link-class` properties are used to center the image on the page. The `width` value must have a unit of measurement, such as pixels or percentages. + +```markdown +{{}} +``` + ## Responsive-table The `responsive-table` shortcode wraps the table within the shortcode tags with a class that makes the table responsive to the browser window.