如何在 WordPress 中製作圖像輪播?

已發表: 2021-12-06
Image Carousel

最後更新 - 2022 年 3 月 8 日

您可能不知道輪播一詞,但仍然經常在數字市場中看到它們。 大多數新時代網站都使用圖像輪播:滑動圖像,包括有關企業提供的產品或服務的簡介。 圖像會自動旋轉並進出視圖。

圖像輪播有效地讓網站訪問者保持更長時間,因為滑動圖像使他們對企業提供的產品或服務更加好奇。 在某些情況下,圖像滑動不是自動的,訪問者必須手動旋轉圖像才能顯示下一張幻燈片。

在 WordPress 中製作圖像輪播

根據業務基調,圖像輪播可以包含一些大膽的陳述,並在沒有長篇描述的情況下揭示很多關於業務的信息。 如果您渴望學習如何在您的網站中加入圖像輪播,那麼您來對地方了。

我們將描述在 word press 中安裝 Smart Slider 3 插件的過程。 還有其他幾個工具可以完成這項工作,安裝過程可能類似於 Smart Slider 3。

在進入教程之前,有一點警告。 如果您在網站上銷售產品,那麼就轉化而言,選擇圖像輪播可能不是最明智的選擇。 但是,如果您正在運行攝影或設計網站並希望它看起來美觀,請通讀整個博客。

從選擇圖像尺寸開始

Smart slide 3 將根據所選的演示格式調整 wordpress 中的圖像大小。 因此,如果圖像很大,該工具會將其縮小,反之亦然。 而且,您可能熟悉,當放大小圖像時,質量開始下降。 因此,盡量不要包含小於輪播尺寸的圖像。

此外,大圖像在輪播中看起來更好,但下載時間也更長。 所以,你必須在質量和大小之間取得平衡,所以它在 Slider 中仍然看起來很棒。

一個小提示:圖像輪播水平滑動,因此選擇更寬的圖像會比方形圖像更有吸引力。

安裝智能滑塊 3

安裝智能滑塊 3.png

Smart Slider 3 的安裝過程對於市場上可用的任何其他工具幾乎相同。 要開始,首先,登錄您的 word press 管理儀表板。 在左側,您將看到一個導航面板,其中包含許多不同的選項可供選擇。 從選項中,選擇插件並單擊“添加新”鏈接。

搜索欄將出現在您的面前。 在其中搜索 Smart Slider 3。 安裝插件後,請單擊激活選項。

開始圖像輪播之旅

Smart Slider 3 使用媒體庫中的圖像,因此請確保在開始製作 Slider 之前上傳一些圖像。 您可以通過他們的教程視頻更好地了解如何開始選擇圖像並將它們添加到您的演示文稿格式中。 按下 Smart Slider 3 並獲取“Learn Smart Slider 3”介紹視頻,該視頻提供有關如何使用該工具的深入知識。

您可以藉助視頻或閱讀本文開始。

從菜單中選擇基本選項。

  • 為您的滑塊命名,以便在一次處理多個輪播時更容易找到您的輪播。
  • 寬度和尺寸會影響滑塊的大小和形狀。 忽略選擇要配置為佔據設備或瀏覽器的整個寬度的任何像素。
  • 選擇默認寬度和尺寸會將輪播設置為當前寬度和大小,而選擇“全寬”選項將忽略任何尺寸並使輪播圍繞窗口的整個寬度旋轉。

優化圖像後,按“創建”。

將圖像添加到滑塊

將圖像添加到 Slider.png
資源

一旦您配置了輪播的默認大小和寬度,下一步顯然是用吸引人的圖像填充輪播。 為此,請按照以下步驟操作:

  • 單擊 Smart Slider 3 中的添加幻燈片圖像。
  • 您將獲得為滑塊選擇圖像的選項。 單擊該選項。
  • 從 wordpress 庫中選擇圖像。
  • 輪播然後將呈現選定的圖像。 對所選圖像感到滿意後,單擊“發布”部分。

如果您打算在代碼中插入滑塊,只需從工具中復制 PHP 代碼或選擇帖子編輯器選項。

當您開始為網站編寫新博客時,頁面上會出現智能滑塊三個選項。 如果您使用的是經典編輯器,請單擊智能滑塊圖標。 現在,選擇您之前準備的自定義 Slider,發布帖子後,Slider 將上傳到網站並可供訪問者查看。

Carousel 將在滑塊的兩側向前或向後鏈接以手動滑動圖像。

默認情況下,輪播圖像不會自動滑動,但您可以更改它。

輪播圖像的自動循環

在 WordPress 管理儀表板中,單擊 Smart Slider 3 鏈接並選擇編輯選項。 選擇“自動播放”樣式,然後按“啟用”。 切換之間的默認時間為八秒。 現在從面板右側的保存按鈕保存更新的設置。

使用輪播作為小部件

智能滑塊也可以用作 WordPress 滑塊圖像。 這些滑塊可以作為小部件添加到任何地方,例如側邊欄。

  • 您將在左側看到一個導航面板。 單擊外觀,然後單擊“小部件”鏈接。
  • 當您看到“可用小部件”部分時,單擊“智能滑塊”按鈕。
  • 選擇要顯示圖像的區域,然後選擇“添加小部件”按鈕。

圖片或無圖片是個大問題

網站設計和開發是主觀的,其他人可能會覺得有吸引力,有些人可能不會。 它經歷了更新和修改的幾個階段,當企業開始將它整合到任何地方時,圖像輪播曾經是網站中最受歡迎的需求。

上述討論提供了在網站上添加圖像輪播的分步指導。 該過程並不復雜,需要耐心和專業知識來選擇相關圖像以提升網站的外觀。 輪播對於創意網站來說非常有吸引力,而在電子商務網站中則沒有幫助。

因此,下次您計劃在滑塊中添加生動的圖像時,請考慮評估它是否會為網站增加價值或在很大程度上影響轉化率。

進一步閱讀

  • 如何優化產品圖片尺寸?
  • WooCommerce 的最佳圖像縮放插件
  • 改善圖像的智能提示