---
# System prepended metadata

title: Blog 文字編輯器分享
tags: [元件分享, 功能]

---

# Blog 文字編輯器分享

###### tags:  `元件分享` `功能`

## 參考ckeditor:
https://cdn.ckeditor.com/

程式碼放上以下兩行便可以顯示(如下圖範例):
```
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>CKEditor</title>
    <!-- 加入這行 -->
    <script src="https://cdn.ckeditor.com/4.15.0/standard/ckeditor.js"></script>
</head>

<body>
    <textarea name="editor1"></textarea>
    <!-- 還有這行 -->
    <script>
        CKEDITOR.replace('editor1');
    </script>
</body>

</html>
```
![](https://i.imgur.com/UgFLFfF.png)

-------------------------------我是分隔線-----------------------------

![](https://i.imgur.com/aJEkf4O.png)

-------------------------------我是分隔線2-----------------------------
## 生成畫面:
![](https://i.imgur.com/PeQOM7u.png)


### 加上bootstarp4 的表單後:

![](https://i.imgur.com/5PiHYUP.png)

