iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 9
0
自我挑戰組

架站好好玩-Wordpress架站和SEO優化之學習全記錄系列 第 9

第9天:『WordPress架站第四步』-Elementor製作About和Media頁面

WordPress架站-Elementor製作頁面

首先開始製作網站的『About 洋片』和『Media 報導』頁面,這兩個部分和作品集的版面不太一樣,都是各自獨立的版面,但其實使用的網頁元素很簡單,就只有標題、圖片和文本編輯器三種,以下頁面全部是以Elementor製作完成。

  • About 洋片
  1. 如同上一篇『第8天:Wordpress架站第三步-熟悉外掛軟體Elementor操作』中的模式,先選擇了一欄架構,再拖放了標題
    https://ithelp.ithome.com.tw/upload/images/20200924/20130379MjBb8nWpgC.png

  2. 輸入標題,尺寸使用預設值,HTML標籤使用H1
    https://ithelp.ithome.com.tw/upload/images/20200924/2013037949UwmoAltD.png

  3. 接著拖放了圖片的元素,並上傳了一張具有代表性的照片
    https://ithelp.ithome.com.tw/upload/images/20200924/20130379fLoqpCgwiq.png

  4. 圖片尺寸選擇了Medium Large – 768 x 0
    https://ithelp.ithome.com.tw/upload/images/20200924/2013037995bTEthLNW.png

  5. 在圖片下方拖放了一個文本編輯器
    https://ithelp.ithome.com.tw/upload/images/20200924/20130379bN1iLycxwb.png

  6. 針對品牌的描述和核心價值
    https://ithelp.ithome.com.tw/upload/images/20200924/201303790dZhqdmxwH.png

  7. 關於洋片整個版面製作完成
    https://ithelp.ithome.com.tw/upload/images/20200924/20130379HueBlriii8.png

  • Media 報導
  1. 選擇了一欄架構,再拖放了標題
    https://ithelp.ithome.com.tw/upload/images/20200924/20130379QsT3nKLZhY.png

  2. 輸入標題,尺寸使用預設值,HTML標籤使用H1
    https://ithelp.ithome.com.tw/upload/images/20200924/20130379xxlhrMDUgQ.png

  3. 接著選擇兩欄架構,左右欄上方放置標題,下方放置圖片
    https://ithelp.ithome.com.tw/upload/images/20200924/20130379YaeSXGurs1.png

  4. 上方的標題比較長,所以在要換行的地方加了HTML的換行標籤〈br〉,尺寸使用Medium, HTML標籤則是使用H2,對齊選擇置中
    https://ithelp.ithome.com.tw/upload/images/20200924/20130379L12uWzmlZE.png

  5. 上傳一張圖片,圖片尺寸選擇Large – 1024 x 1024,連結選擇客製URL,輸入要連結的網址,並點選連結選項,勾選在新視窗中開啟,其他專訪製作如法炮製
    https://ithelp.ithome.com.tw/upload/images/20200924/20130379nMNNZwOGC0.png

  6. 媒體報導頁面完成
    https://ithelp.ithome.com.tw/upload/images/20200924/20130379YPjYTaEx7H.png


上一篇
第8天:『WordPress架站第三步』-熟悉外掛軟體Elementor操作
下一篇
第10天:『WordPress架站第五步』-使用Elementor製作Product頁面
系列文
架站好好玩-Wordpress架站和SEO優化之學習全記錄30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言