aboutsummaryrefslogtreecommitdiff
path: root/content/overview-images
diff options
context:
space:
mode:
Diffstat (limited to 'content/overview-images')
-rw-r--r--content/overview-images/ferris-gesture.pngbin0 -> 18514 bytes
-rw-r--r--content/overview-images/index.md3
2 files changed, 3 insertions, 0 deletions
diff --git a/content/overview-images/ferris-gesture.png b/content/overview-images/ferris-gesture.png
new file mode 100644
index 0000000..af30447
--- /dev/null
+++ b/content/overview-images/ferris-gesture.png
Binary files differ
diff --git a/content/overview-images/index.md b/content/overview-images/index.md
index 22e1f92..3762f9d 100644
--- a/content/overview-images/index.md
+++ b/content/overview-images/index.md
@@ -1,5 +1,6 @@
+++
title = "Image Shortcodes"
+description = "Images can be embeded directly using markdown `![Ferris](ferris.svg)`, but using a shortcode prevents CLS by explicitly setting the width and height."
date = 2021-05-19
[taxonomies]
@@ -7,6 +8,8 @@ categories = ["Features"]
tags = ["shortcodes","images"]
[extra]
toc = true
+keywords = "Image, Markdown, Shortcodes, Hover"
+thumbnail = "ferris-gesture.png"
+++
This post covers the **imghover and img shortcodes**. Images can also be embeded directly using markdown `![Ferris](ferris.svg)`, but it is better to use a shortcode so you can explicitly set the width and height, this will help prevent content layout shift which improves user experience and the google lighthouse score.