From 93fcf5013150b2ff6e43d118d489a2676b6c880a Mon Sep 17 00:00:00 2001
From: Cotes Chung <11371340+cotes2020@users.noreply.github.com>
Date: Sat, 9 Jan 2021 22:33:49 +0800
Subject: [PATCH] Add image CDN tutorial

---
 _posts/2019-08-08-write-a-new-post.md | 30 +++++++++++++++++++++++----
 1 file changed, 26 insertions(+), 4 deletions(-)

diff --git a/_posts/2019-08-08-write-a-new-post.md b/_posts/2019-08-08-write-a-new-post.md
index da55aa4..64e3a9e 100644
--- a/_posts/2019-08-08-write-a-new-post.md
+++ b/_posts/2019-08-08-write-a-new-post.md
@@ -118,22 +118,44 @@ By default, the image is centered, but you can specify the position by using one
   Image will be left aligned in below sample:
 
   ```markdown
-  ![Desktop View](/assets/img/sample/mockup.png){: width="350" .normal}
+  ![Desktop View](/assets/img/sample/mockup.png){: .normal}
   ```
 
 - **Float to the left**
 
   ```markdown
-  ![Desktop View](/assets/img/sample/mockup.png){: width="240" .left}
+  ![Desktop View](/assets/img/sample/mockup.png){: .left}
   ```
 
 - **Float to the right**
 
   ```markdown
-  ![Desktop View](/assets/img/sample/mockup.png){: width="240" .right}
+  ![Desktop View](/assets/img/sample/mockup.png){: .right}
   ```
 
-> **Limitation**: Once you specify the position of an image, it is forbidden to add the image caption.
+**Limitation**: Once you specify the position of an image, it is forbidden to add the image caption.
+
+### CDN URL
+
+If you host the images on the CDN, you can save the time of repeatedly writing the CDN url by assigning the variable `img_cdn` of `_config.yml` file:
+
+```yaml
+img_cdn: https://cdn.com
+```
+
+Once `img_cdn` is assigned, the CDN url will be added to the path of all images (images of site avatar and posts) starting with `/`.
+
+For instance, when using images:
+
+```markdown
+![The flower](/path/to/flower.png)
+```
+
+The parsing result will automatically add the CDN prefix `https://cdn.com` before the image path:
+
+```html
+<img src="https://cdn.com/path/to/flower.png" alt="The flower">
+```
 
 ## Pinned Posts