舍子美學設計

網站使用說明

進到控制台

入口連結: 控制台 ‹ 舍子美學設計

在登入畫面輸入寄到你信箱的帳號密碼(請妥善保存),建議可讓瀏覽器幫你記憶帳號密碼,方便快速。

因為我們是使用 WordPress 的內建編輯器 Gutenberg ,如果需要完整的說明可以用這兩個關鍵字上網搜尋,有很多詳細的教學文章,經過一點點的學習時間應該就可以讓你做出不錯的文章排版。

至於這邊只做相關的簡易教學。

基礎編輯器操作

先進行通用的操作說明,在我們的網站後台有兩處可以進行上傳內容到前台:

  1. 點選 “文章” -> “新增文章”
  2. 點選 “設計案例” -> “新增案例” ,然後開始進行編輯。

三個需要先填入的地方: 標題分類精選圖片

上傳圖片

點 “設定精選圖片” ,就會跳出 “媒體庫” 的視窗(如下圖),只要把圖片檔由你電腦的資料夾用拖拉的方式丟進媒體庫再勾選即可,最後記得按下 “設定精選圖片” 。

非常建議在將圖片檔丟進媒體庫之前,先進行裁剪大小檔案壓縮的步驟,因為圖片檔過大通常是拖累網站速度最大的主因,而網站速度是影響客戶瀏覽網站時決定去留超級非常重要的一項因素。

你可以使用此網頁來進行圖檔無損壓縮: TinyJPG ,非常容易,只要將欲壓縮的圖檔拖拉到頁面上即可(一次可 20 張)。

三個基本的編輯器功能

基本上只要三個功能即可完成基本的文章:標題、段落、圖片

首先按畫面左上角有個藍色 + 的小圖示,按下去之後會變黑色,並打開所有小功能按鈕,接著往下滑找到如圖右的三個按鈕(排列不一定如圖),之後就按自己想要的順序加入即可。

1. 標題

  1. 標題可選 H1 ~ H6 的階層,階層是跟文章架構有關,不是指字的大小,所以請盡量構思好再使用。通常整篇文章的主標題是 H1 ,所以文章內的段落標題可從 H2 開始使用,段落內若還需分子標題再用 H3 以此類推,一般的文章頂多用到 H4 就差不多了。
  2. 旁邊的按鈕為文字對齊功能。

1. 標題階層
2. 文字對齊方向

2. 段落

基本上就把內容 key 或複製進去就可以了,不過複製貼上的話要注意一下是不是連文字的樣式也一起複製了。

3. 圖片

新增圖片區塊後,有三個選項: 上傳、媒體庫、從網址插入媒體 ,基本上我們都用中間的媒體庫就可以了;點選後跳出媒體庫的視窗,就跟前面說的精選圖片一樣做法,拖拉圖檔後再勾選起來即可。

使用預設模板

在編輯 “設計案例” 時,可以使用已經預先儲存的模板來加快編輯流程。

點左上的 + 打開小功能面板,可以看到有三個頁籤,點選右邊的 “可重複使用” ,再點選 “案例版型” ,即可插入模板。

將模板轉換成一般區塊

插入模板後,可看到區塊上方有一小排功能按鈕,記得先點選中間的按鈕,將模板轉換成一般區塊,否則每次儲存都會連動改變模板內容。

如何找尋區塊位置(階層)?

承上,進行編輯時,要點選到區塊才會出現那一小排功能按鈕,但有時候區塊間是階層重疊的狀態,會難以點選;這時候可按下如右圖所示的三條線按鈕,便會呈現一目了然的區塊間的階層關係,再從裡面點選即可。

發布文章

文章都編輯完成後,別忘記要發布文章,點選右上角藍色的 "發佈" 按鈕,將文章正式推送到前台。

如果覺得文章尚未編輯完畢,可先點 “儲存草稿” ,暫存文章。

回到網站