筆記|WordPress 區塊編輯器。傳統再進化。兩小時快速認識課程重點

身邊認識的朋友都開始使用區塊編輯器了,我才發現自己還在身在WordPress恐龍時代的傳統編輯器?

認識區塊編輯器

多虧阿腸數位科技開了這堂兩小時密技讓我快速上手。聽完課之後,我覺得這是一個「圖層」的概念,尤其右上角的三條線(斜三),要常常打開來檢視,還可以方便移動,結合自己之前有學過illustrator的概念,把功能列打開,就比較習慣跟有安全感,再來用比較直覺系做「powerpoint」的一些功能,其實我覺得「區塊編輯器」相對起來就有很多易曲同工之妙,顯得比較不那麼的陌生,讓人比較容易上手。

原本前一天打開區塊編輯器當下,真的有點恐慌,心想明天要去台中上課,不知道該怎麼辦才好!多虧阿腸團隊真的很貼心,先將大架構跟傳統編輯器做一個比較,把常用的一些區塊編輯器的「功能」當場做「練習」的確讓我安心很多,尤其工程師都很有耐心教導我們這些資深的媽媽姊姊們,從基礎教學到特色排版與實用技巧,雖然還不是很熟練,至少大概功能看過一遍,重點先記下來,回家繼續慢慢練習。

  • 全文閱讀/標題/段落
  • 圖片與圖庫/並列圖庫
  • 多重欄位/橫列排列
  • 按鈕加連結
  • 群組的應用
  • 地圖連結/大中小

標題段落|空白間隔

段落與段落之間,如果想要比較清楚的讓「段落分明」可以插入空白間格。如果在行距比較小的話可以用「shift+enter 」讓段落比較近,記得如果一開始找不到功能的話,從「+」這邊的功能列,大多都可以找到。切記不要在「標題」上加粗或是加上連結,標題就是標題。

圖庫與圖片|並排欄位

我覺得這部份真的要認真學,因為可以讓圖片有更多排版的變化,尤其「並列圖庫」與「並排欄位」可以變化出比較多樣的選擇,同時也可以比較不呆版,而且減少我自己還要花很多時間把排版美美之後變成一張圖再貼上來的窘境。沒想到「並列圖庫」就可以做到。

左邊的區塊編輯列裡面,還可以針對「圖片」做「圓角」或「連結」等變化,我覺得相當的靈活說!

橫列排列

這個好處就是不會隨著手機或是電腦的螢幕去更動,圖片排列就是這樣橫列排列,不會自行改變(鎖定)。

善用群組|資訊簽名欄

這個我覺得拿來做簽名檔或是店家資訊很有用的,除此之外,「群組」後的欄位背景,還可以用漸層喔!

店家資訊| 阿富美食館

店家地址| 台中市后里區成功路227號

崁入地圖|先選好大中小

崁入地圖選「自訂HTML」直接在GOOGLE的地標中選取,特別注意選擇「地圖中的大中小」以符合你希望在網頁中排版的大小,就我本身希望他跟我的行寬不要差太多,就可以選「大」即可。

地址:阿腸數位科技

按鈕組

這個按鈕也很方便,還可以做導角,這個功能我覺得也很不錯!

多重欄位

關西仙草節
仙草一分田

圖片中加文字

在圖片或是圖庫中有一個「方框+底下有3點」的圖示,就可以加上圖片說明的文字,類似簡報中的做法,就不需要另外在跳出去外面做圖,另外「文字顏色」請選「醒目提示」這樣就可以變換所選文字的顏色。

區塊編輯器課程心得

其實在使用新版編輯器實,一開始我真的蠻擔心無法快速上手的問題,還好阿腸聽到了很多客戶的聲音開了這堂課,原本想去台北上的沒報到,就改到台中上,剛好也讓我體驗到冬天台中人中午還是穿短袖的熱情!尤其剛好旁邊坐了一個和我同為兩個孩子的媽媽,正為產文感到非常不容易,主要時間上的分配我們都留給了孩子了!也一起鼓勵彼此不要放棄紀錄跟練習,畢竟我們從無名小站時代就開始寫文分享了….


雖然這短短兩小時的課,讓我了解區塊編輯器可以快速產製出漂亮且具吸引人的編排模式,像是表格也很方便的製作,例如做價格表比價也是不會太費力,但是主要還是需要多練習!以上是我筆記的小撇步。

如果想做出美美的排版,我還要多寫文多熟能生巧才行,直覺式的寫文章,在慢慢的調整段落的排版或是移動,尤其並列圖庫的排版運用只要熟悉,用區塊編輯器寫文也不那麼困難了,加油,進化吧魚鱗姊!

相連文章

臉書留言

一般留言

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

這個網站採用 Google reCAPTCHA 保護機制,這項服務遵循 Google 隱私權政策服務條款