diff --git a/_includes/refactor-content.html b/_includes/refactor-content.html
index 7e899ff..b5b77b4 100644
--- a/_includes/refactor-content.html
+++ b/_includes/refactor-content.html
@@ -78,9 +78,9 @@
{% capture _value %}{{ _attr | split: '=' | last | replace: '"', '' }}{% endcapture %}
{% case _key %}
- {% when 'width' %}
+ {% when 'width', 'w' %}
{% assign _width = _value %}
- {% when 'height' %}
+ {% when 'height', 'h' %}
{% assign _height = _value %}
{% endcase %}
diff --git a/_layouts/post.html b/_layouts/post.html
index 222f20a..ef2450e 100644
--- a/_layouts/post.html
+++ b/_layouts/post.html
@@ -16,8 +16,18 @@ tail_includes:
{% endcapture %}
+
+ {% if page.image.width %}
+ width="{{ page.image.width }}"
+ {% elsif page.image.w %}
+ width="{{ page.image.w }}"
+ {% endif %}
+
+ {% if page.image.height %}
+ height="{{ page.image.height }}"
+ {% elsif page.image.h %}
+ height="{{ page.image.h }}"
+ {% endif %}>
{% endif %}
{{ page.title }}
diff --git a/_posts/2019-08-08-write-a-new-post.md b/_posts/2019-08-08-write-a-new-post.md
index abe698e..68f0358 100644
--- a/_posts/2019-08-08-write-a-new-post.md
+++ b/_posts/2019-08-08-write-a-new-post.md
@@ -50,7 +50,7 @@ The author information of the post usually does not need to be filled in the _Fr
---
author:
name: Full Name
- url: https://example.com
+ link: https://example.com
---
```
@@ -114,6 +114,8 @@ image:
Except for `alt`, all other options are necessary, especially the `width` and `height`, which are related to user experience and web page loading performance. Later section ["Image size"](#image-size) will also mention this.
+Starting from _Chirpy v4.4.0_, the attributes `height` and `width` support abbreviations: `height` → `h`, `width` → `w`.
+
### Image caption
@@ -134,6 +136,13 @@ In order to prevent the page content layout from shifting when the image is load
```
{: .nolineno}
+Starting from _Chirpy v4.4.0_, `height` and `width` support abbreviations (`height` → `h`, `width` → `w`). The following example has the same effect as the above:
+
+```markdown
+![Desktop View](/assets/img/sample/mockup.png){: w="700" h="400" }
+```
+{: .nolineno}
+
### Image position
By default, the image is centered, but you can specify the position by using one of the classes `normal`, `left`, and `right`. For example: