如何編輯網頁圖、文
如何編輯網頁圖、文

如何編輯網頁圖、文 /part 3:行動呼籲圖文、計數器、banner圖片

如何簡單輕鬆編輯網頁文章的內容及圖片?教你編輯 Call to action(行動呼籲) 圖文、計數器的數字、文字編輯、橫幅banner圖片修改。
目錄

Elementor教學:在這篇文章中將說明如何使用 Elementor 為網頁編輯圖、文內容,Elementor 是一套網站前端視覺編輯器,裡面具有許多已經完成程式碼建構的 widget (小工具) ,只需要在網頁模板上建立網頁區塊,再將小工具以拖曳的方式加入到網頁中,就能完成網頁編輯的動作,在網頁編輯上也較簡單易懂,可以輕鬆地完成編輯圖文的動作。

本篇教學以 demo-002 作示範,以下教學將會用圖片及文字的方式呈現。

編輯 Call to action(行動呼籲) 圖文

滑鼠移到圖片上會有文字顯現,這個要怎麼修改呢?

T demo0027
Call to action

欲編輯該項目,同樣地在它上面點選右鍵,編輯 Call to action,或是直接按左鍵。

T demo0028
此四個 Call to action 圖文是需要分開編輯的

左側的編輯區域可以看到 ImageContent

Image 區塊點選圖片可以更換圖片,Content 區塊可以更改標題描述

計數器的數字、文字編輯

在一些網站中可以看到計數器,會跑數字的小動畫,要更改數字及符號等也是很容易的。

T demo0031
圖中的三個%數區塊就是計數器

欲編輯該項目,同樣地在它上面點選右鍵,編輯計數器,或是直接按左鍵。

T demo0032
此三個計數器區塊是需要分開編輯的

左偏區域可以編輯數字及數字後欲呈現的符號,這裡是? %,開始數字1,動畫會從數字1開始跑到結束數字90。計數器的標題也可以更改。而計數器下方的台灣當地新鮮食材,可以直接點選修改。

橫幅banner圖片修改

此demo中的橫幅banner是圖文分開的,可以直接分開修改。

T demo0033
橫幅banner

更改圖片時,須在藍色框框上按右鍵,選擇編輯段

T demo0034
橫幅banner 設定

在左側編輯區域上方點選樣式,樣式下的背景就是更改圖片的地方。欲修改文字部分的話,只要在文字上按右鍵編輯就可以了。

其他教學文章

各種ChatGPT及AI工具應用、指令手冊、解決方案,每週更新。
學習最新AI工具,就上Learn AI
AI如何讓工作更輕鬆、更有效率?立刻學習!
LA廣告-1
LA廣告-2
LA廣告-3
Related Post
最新文章
google site:
網頁設計費用要多少?2026年架站報價實務與避坑指南

想知道 2026 年合理的網頁設計費用是多少?我們深度拆解網域主機、客製化開發與 WordPress 架構的價格差異。幫你避開報價黑洞,從老闆與行銷人的痛點出發,提供少踩雷的架站建議,讓網站不再只是花錢的工具,而是能持續獲客的品牌資產。

一頁式網頁好嗎?不想重花幾萬塊「砍掉重練」必看

許多創業者為了快速上線、提高廣告轉換率而選擇一頁式網頁,卻常在經營後才發現 SEO 難以操作、功能無法擴充。本文由台灣市場經驗出發,深度解析一頁式網站的優缺點、適用場景、破解詐騙地雷,並分享如何透過 WordPress 架構平衡「高轉換」與「長期品牌資產」,助你避開常見的架站踩雷坑,讓網站變成長期資產。

Selected Post
精選文章
WordPress網站架設步驟、費用整理!網頁設計與架站前先看

WordPress架站是什麼?在資訊快速發展的時代,幾乎每個品牌都有專屬品牌網站,並且多數人選擇WordPress架站,很多人最在意之一:WordPress架站費用是多少?WordPress網站架設自己做可以嗎?本文將帶你了解WordPress為什麼能成為全球最受歡迎的架站平台,分析不同架站類型的選擇方向,讓你實際了解WordPress架站與網站設計。