網站後台教學:如何修改網站首頁文字與圖片內容

發布 2024-10-15|更新 2026-10-17

這支影片示範如何修改網站首頁的內容:登入網站後台,選擇「頁面編輯」功能,進入要修改的首頁,再用前端編輯工具直接點擊文字或圖片區塊進行編輯。標題、內容文字、按鈕連結都能在同一個畫面修改,完成後點擊「儲存」,並切換桌面、平板和手機視角確認顯示效果。

要改的內容點哪裡改完要做的事
橫幅(Banner)文字、內文文字直接點擊文字區塊輸入新文字,按「儲存」(Save)
圖片點擊圖片區塊上傳新圖像,按「儲存」
按鈕文字與連結點擊按鈕進入編輯修改文字及連結頁面,按「儲存」
手機、平板顯示上方的裝置切換逐一預覽確認,再按「儲存」

1進入網站後台

先登入網站後台。

登入後找到頁面管理的功能,通常在左側工具列有一個名為「SP PAGE Builder」的選項。

選擇「頁面編輯」(Pages),進入後會看到網站的頁面列表,例如網站首頁,點選要修改的頁面。

2使用網頁前端編輯

滑鼠移到首頁那一列,會看到「前端編輯」選項,點擊進入後便會模擬前端編輯頁面。

要修改橫幅 (Banner) 的文字或圖像,只要點擊對應的區塊。

前端編輯是什麼

依 SP Page Builder 官方文件 說明,SP Page Builder 的前端編輯器採所見即所得的拖曳編輯,所有修改會直接顯示在頁面上;從 SP Page Builder 的頁面列表點擊編輯圖示,就會進入編輯介面。

3修改文字與圖片

要修改文字,直接點擊文字區塊,會彈出編輯介面,輸入新的文字後按下「儲存」(Save)。

修改圖片的方式相同,點擊圖片後即可上傳新的圖像,記得儲存變更。

4修改按鈕與連結

要修改按鈕的文字或連結,點擊按鈕進入編輯,就能變更按鈕上的文字及對應的頁面連結。

完成後同樣按下「儲存」。

5預覽與儲存

最後在頁面中預覽桌面、平板和手機的樣式。SP Page Builder 編輯器上方提供桌機、筆電、平板橫向、平板直向、手機橫向、手機共 6 種檢視尺寸(來源:SP Page Builder 官方文件)。

確認修改完成後,記得按下儲存。

儲存前檢查

  • 手機版文字是否斷行過長或被圖片蓋住
  • 按鈕連結點下去是否開到正確頁面
  • 新上傳的圖片是否清楚、尺寸是否合適

需要更進一步的後台教學

益盛科技的全後台模組化形象官網,首頁文字、圖片、按鈕都能自行在後台修改;操作上有問題可透過 LINE 安排教學。

相關文章

網頁設計 問與答

推薦閱讀:omo跨境品牌電子商務購物網站 全後台模組化形象官網

簡易電子書下載:一頁式網頁設計電子書

益盛科技 des13.com - 客製化軟體開發 × AI 系統整合方案

益盛科技|客製化開發 × AI
 
13 年軟體開發經驗,1000+ 專案實戰
 
核心服務:客製化軟體、網站開發、SEO 等
 
專注重點:重視架構、設計品質與商業價值
 
技術方向:導入AI 應用與自動化流程

聯絡資訊

LINE @igodos 加 LINE 好友
406台中市北屯區文心路四段955號11樓之2
(需預約諮詢)
social line social fb social ig
LINE