Merge branch 'feature/support-image-parameter-abbreviation'
This commit is contained in:
commit
089a19bc9e
3 changed files with 24 additions and 5 deletions
|
@ -78,9 +78,9 @@
|
||||||
{% capture _value %}{{ _attr | split: '=' | last | replace: '"', '' }}{% endcapture %}
|
{% capture _value %}{{ _attr | split: '=' | last | replace: '"', '' }}{% endcapture %}
|
||||||
|
|
||||||
{% case _key %}
|
{% case _key %}
|
||||||
{% when 'width' %}
|
{% when 'width', 'w' %}
|
||||||
{% assign _width = _value %}
|
{% assign _width = _value %}
|
||||||
{% when 'height' %}
|
{% when 'height', 'h' %}
|
||||||
{% assign _height = _value %}
|
{% assign _height = _value %}
|
||||||
{% endcase %}
|
{% endcase %}
|
||||||
|
|
||||||
|
|
|
@ -16,8 +16,18 @@ tail_includes:
|
||||||
{% endcapture %}
|
{% endcapture %}
|
||||||
<img src="{{ page.image.src }}" class="preview-img {{ bg | strip }}"
|
<img src="{{ page.image.src }}" class="preview-img {{ bg | strip }}"
|
||||||
alt="{{ page.image.alt | default: "Preview Image" }}"
|
alt="{{ page.image.alt | default: "Preview Image" }}"
|
||||||
{% if page.image.width %}width="{{ page.image.width }}"{% endif %}
|
|
||||||
{% if page.image.height %}height="{{ page.image.height }}"{% endif %}>
|
{% 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 %}
|
{% endif %}
|
||||||
|
|
||||||
<h1 data-toc-skip>{{ page.title }}</h1>
|
<h1 data-toc-skip>{{ page.title }}</h1>
|
||||||
|
|
|
@ -50,7 +50,7 @@ The author information of the post usually does not need to be filled in the _Fr
|
||||||
---
|
---
|
||||||
author:
|
author:
|
||||||
name: Full Name
|
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.
|
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
|
### Image caption
|
||||||
|
|
||||||
|
@ -134,6 +136,13 @@ In order to prevent the page content layout from shifting when the image is load
|
||||||
```
|
```
|
||||||
{: .nolineno}
|
{: .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
|
### 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:
|
By default, the image is centered, but you can specify the position by using one of the classes `normal`, `left`, and `right`. For example:
|
||||||
|
|
Loading…
Reference in a new issue