搜尋
Close this search box.

[細論]四種圖片輪播工具介紹與使用時機

索引
全文

前言

Elementor有多種輪播工具可選用,但每一種有它的特性,在深入了解每個輪播工具的特點後再選用適當,以利我們在設計網頁時可以做出符合需求的效果。

說明

工具名稱 說明 使用時機
背景輪播 在任何一個區塊容器,其背景都可以設定成多張背景去輪播。(既然是背景,就可以在圖上加上自訂文字或其它元素) 主要是輪播圖上需要加上文案或按鈕時,甚至加上小區塊中要再包含更多元素,即會選用此方式。
幻燈片 每則幻燈片由「圖+文字+按鈕」組成,然後實施輪播。 主要是輪播圖上需要加上文案或按鈕時,即會選用此方式。
媒體輪播

每個項目可以置入「圖」或「影片」,無法置入文字,然後實作圖或影片的輪播切換。

輪播有多個樣式可選。

最常使用時機是輪播元素中需有「影片」的情況,即可用此工具。

圖片轉盤

一次圈選多張圖片後,進行輪播。

圖片比例盡量一致,否則輪播時會有高度不一造成輪播版面忽高忽低的情況。

要求最佳響應式效果 : 非採背景方式置入圖片,故響應式效果最佳,圖片可維持原比例。

因其圖片是採一次圈選多張的方式,故可配合ACF動態欄位對應,讓業主免進入Elementor即可自由替換圖片。

 

在Elementor中,有些輪播工具,它的圖片是採「背景」方式置入,故在「響應式」效果時,有時候為了讓圖可以填滿整個區塊,會強制把圖「延展」至整個區塊的大小,故有時候圖片的邊邊有時會被遮住無法全貌呈現。

而「圖片轉盤」較特殊,它的輪播是用「插入圖片」的方式來置入圖片,故圖片會一直以原始比例置入,在不同裝置的響應式呈現時,仍會以原圖來呈現,故不會有延展而造成部分邊邊被遮住,但正因它沒有延展功能的特點,原圖在製作時需要盡量維持一樣的長高比例,不然在輪播時會造成版面忽高忽低,另,若把它設定一次呈現一張,也就是當成「大圖輪播」的話,其原圖的設計尺寸要盡量大一點,這樣才能填滿整個螢幕左右寬度,為何?因它沒有「延展圖片」的功能,會以原圖比例呈現。

 

 

有問題嗎?歡迎於下方發問

發佈留言

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

下一首

Line的不良影響

我個人並不很喜歡用Line,因當我一句訊息回覆後,馬上對方又一句回來,如此往返下去則半小時、一小時就過去了,我無法專心工作,除非是正式諮詢或安排會議的討論,才適合這種模式

有時候對方的問題很多很雜,一傳就是十幾封訊息,這就是訊息轟詐了,我就不知從何回起,我就會只回最後一封的訊息。

有時候對方的問題很多還加上數張截圖,因Line無法條列式呈現,我也無法增加腦力去判斷哪張圖要對應哪則訊息,所以我就會只回最後一封的訊息。

另我不喜歡私人Line被直接來電,因我常常在國道開車需要導航,有時因加班在補眠,這些都會不良干擾。

不是正式會議的討論階段,請您用Email,Email可以條列方式呈現多則問題與截圖,也可以讓我先已讀後再慢慢思考怎樣回覆,避免我自己不小心已讀不回造成對方不佳的感受。🙏 - Wiktionary, the free dictionary

哈囉,在加Line好友之前請先確認一下幾點 :

1、若您是上課的學員或讀者,請直接用Email發問或在該篇文章留言發問,盡量不要直接加Line發問,因我平常很忙,無法守在Line前與您一句一句訊息對答,若每一期 + 每個學員都加Line課後詢問,我短時間內回不完這麼多訊息也會回得很慢喔 ,請見諒。(用Email發問,我會仔細條列說明,你會得到更完整的圖文回覆,甚至還會附上小影片解說。)
Email : [email protected]

2、若是網站外包詢價相關,您再加Line,因我可能需要與您語音會議或遠端連線。

3、補充說明 : Line的不良影響

以上。

目前線上有 5 個使用者: 0 個成員0 個訪客5 個檢索機器人

線上同時最多使用者人數為 91 個使用者,發生於 2024-01-1423:41

5 個檢索機器人 正在線上

#1 – Google 於 2024-04-1702:00
架站勤拿手 » [細論]四種圖片輪播工具介紹與使用時機 | 架站勤拿手 [網址]

#2 – PetalBot 於 2024-04-1701:59
架站勤拿手 » 首頁 | 架站勤拿手 [網址] [參照連結網址]

#3 – PetalBot 於 2024-04-1701:58
架站勤拿手 » 16_如何安裝佈景主題(3種方式) | 架站勤拿手 [網址] [參照連結網址]

#4 – Google 於 2024-04-1701:57
架站勤拿手 » [外掛]文章點閱統計-top 10 | 架站勤拿手 [網址]

#5 – PetalBot 於 2024-04-1701:56
架站勤拿手blog | 第 10 頁,總計 18 頁 | 架站勤拿手 [網址] [參照連結網址]