---
title: Elementor 首頁輪播圖怎麼換圖、改順序
description: 首頁 banner 想換圖、調順序卻找不到入口？先分清是 Elementor 小工具還是輪播外掛，再注意圖片比例。
url: "https://wptoolbear.com/docs/elementor-homepage-slider-banner-change/"
updated: "2026-09-13"
category: 內容操作教學
---

# Elementor 首頁輪播圖怎麼換圖、改順序

**快速答案：**用 Elementor 編輯首頁，點輪播區塊，在左側面板的投影片清單裡換圖、拖曳改順序；如果輪播是 Smart Slider、Revolution Slider 這類外掛做的，要到該外掛的後台改，不在 Elementor 裡。換圖前先把新圖裁成跟舊圖相同比例，手機版另外檢查一次。

## 為什麼會這樣

首頁 banner 有三種做法：Elementor 內建的輪播或圖片輪播小工具、獨立的輪播外掛、或佈景自帶的首頁 banner 設定。客戶最常卡在「找不到在哪改」以及「換了圖手機版跑掉」——後者是因為新圖尺寸與原本不同，或桌機與手機各設了一張圖，只換到其中一張。

## 怎麼處理

1. 找到入口：登入後在前台點上方工具列「使用 Elementor 編輯」，點輪播區塊，左側出現設定。如果點到的是一段短代碼，那是輪播外掛，到後台對應外掛（例如 Smart Slider 3）選那組 slider。
2. 換圖：投影片清單裡每一張點開換「圖片」；標題、文字、按鈕連結也在同一張裡。
3. 改順序：投影片清單直接拖曳；要加一張就複製現有的一張再改，樣式會一致。
4. 圖片規格：先到媒體庫看舊圖的長寬，新圖裁成同比例。一般 banner 寬 1920 就夠，檔案壓到 300KB 以下再上傳（TinyPNG、Squoosh 都行）。
5. 手機版：Elementor 左下角切到手機模式，看重點有沒有被裁掉、文字有沒有溢出。輪播小工具可以在手機版設不同高度，或改用「背景圖片」為手機另外指定一張直式圖。
6. 寬螢幕：容器設最大寬度，或背景圖用 cover 並設定位，避免大螢幕圖片超出邊界。
7. 按「更新」，清快取，用無痕視窗看前台。

## 我們實際遇過的情況

一家診所官網的客戶說「首頁的輪播圖片改不了順序與設定，之前記得都可以」——遇到這種，先確認那組輪播到底是頁面編輯器裡的小工具，還是輪播外掛放進來的短代碼，入口完全不同。一個多語官網要調各語言的首頁輪播，每個語言的首頁是獨立頁面，要一個一個改，不會自動同步。

另一個網站換了首圖之後手機版跑版；同一個站稍早也反映過，在比較大的螢幕看首頁 banner，圖片會超出 banner 邊界。這兩種回到的是同一件事：banner 的尺寸與響應式設定要跟著圖一起調，不是換張圖就結束。

## 什麼時候該找人

輪播用的是已停止更新的外掛、換圖後整個區塊消失、或要做桌機與手機不同圖的響應式設定卻不確定怎麼設。這種一次花半小時教會，比反覆試划算。

## 常見問題

### 首頁輪播在 Elementor 裡點不到、改不了順序？

那組輪播多半是 Smart Slider 之類的外掛做的，Elementor 裡只是一段短代碼；到該外掛後台選那組 slider 就能拖曳排序。

### 換了 banner 圖手機版就跑版？

多半是新圖比例與原設定不同。在 Elementor 手機模式另外設高度，或為手機指定一張直式圖。

### banner 圖片要多大？

先看舊圖長寬，新圖裁成同比例；一般寬 1920 就夠，檔案壓到 300KB 以下再上傳。

想有人每月幫你顧著、順便教你操作：[網站守護方案](https://wptoolbear.com/guardian/)；首頁想整個重做：[網站建置](https://wptoolbear.com/build/)。