如何創建 WordPress Instagram Feed(輕鬆)

已發表: 2023-06-05
Facebook 鳴叫 領英

您想了解如何將 WordPress Instagram 提要添加到您的網站嗎?

Instagram 是一個非常受歡迎的社交媒體平台和營銷工具。 通過在您的 WordPress 網站上顯示您的提要,您可以建立社會證明、增加參與度、建立您的社會追隨者、節省時間並增加銷售額!

在本文中,我們將逐步向您展示如何以簡單的方式將 Instagram 提要添加到 WordPress。

為什麼要創建 WordPress Instagram 提要?

使用 WordPress Instagram 提要,您上傳到 Instagram 的圖像會自動出現在您的網站上,這是展示新鮮內容和鼓勵訪問者參與的一種非常方便的方式,而無需花費大量時間進行網站更新。

MonsterInsights 是最好的 WordPress 分析插件。 免費獲取!

以下是將 Insta 提要與 WordPress 連接以顯示照片和其他媒體的一些主要好處:

  • 允許站點訪問者查看您的最新帖子並鼓勵他們返回以獲取最新更新。
  • 向您的站點添加動態內容以保持其新鮮感和吸引力。
  • 允許您顯示產品評論、相關主題標籤提要和視頻推薦,以建立社會認同。
  • 推廣您的 Instagram 個人資料以擴大您的受眾群體、發展您的品牌並獲得更多 Instagram 關注者。
  • 可以通過為 Google 索引提供更多相關內容來改善您的 SEO 並提高排名。

這對您的企業來說是一些非常棒的好處! 準備好了解如何輕鬆地將您的 Instagram 提要嵌入 WordPress 了嗎? 讓我們開始吧。

添加 WordPress Instagram Feed 的最佳方式

要在您的網站上顯示 Instagram 提要,我們將使用超過 100 萬用戶推薦的最佳社交媒體和 Instagram 提要插件。

粉碎氣球

Smash Balloon Instagram Feed Pro 讓您毫不費力地將 Instagram 照片提要添加到您的 WordPress 網站並立即顯示迷人的內容。 其用戶友好的引導式流程使得將 Instagram 提要集成到 WordPress 並創建完全可定制的提要變得簡單快捷。

此外,它會自動採用您網站的設計,確保一致的視覺體驗,並針對超快的加載時間優化了性能。

社交媒體插件無需嵌入代碼即可輕鬆連接到您的 Instagram API,並可與最佳的拖放式頁面構建器無縫協作。

憑藉大量強大的功能,無需技術技能,以及對高級用戶的 CSS 支持,它是適合初學者和專家的最佳 WordPress Instagram 插件。

Instagram Feed Pro 的功能包括支持多個 Instagram 帳戶、標籤提要、Instagram 故事、捲軸、視頻、提及、可購買的 Instagram 圖片、燈箱、總體設計自定義、許多佈局選項等等。

Smash Balloon Shoppable Instagram Feed WordPress

使用 Smash Balloon,您可以在幾分鐘內為您的網站創建和自定義完全個性化的提要,例如上面用於電子商務的 Instagram 可購物提要。

立即開始使用 Smash Balloon Instagram Feed Pro!

準備好在 WordPress 上創建您自己獨特的 Instagram 提要了嗎? 讓我們深入了解分步說明。

如何將 Instagram 提要添加到 WordPress

  • 第 1 步:安裝 Smash Balloon Instagram Feed Pro
  • 第 2 步:創建新的 Instagram 動態
  • 第 3 步:將您的 Instagram 帳戶連接到 WordPress
  • 第 4 步:自定義 Feed 的設計
  • 第 5 步:在 WordPress 中嵌入您的 Instagram 提要

第 1 步:安裝 Smash Balloon Instagram Feed Pro

首先,您需要安裝並激活插件。 有關詳細說明,您可以查看有關如何安裝 WordPress 插件的教程。

注意:在我們的教程中,我們將使用 Smash Balloon 的高級版本,因為它提供了具有更多特性和功能的完整自定義選項。 如果您剛剛起步或預算緊張,可以試用免費版 Smash Balloon Social Photo Feed。

安裝並激活插件後,您需要激活許可證密鑰。 從您的 WordPress 管理員轉到Instagram Feed » 設置

在這裡,粘貼您的許可證密鑰(在您的購買確認電子郵件或您的 Smash Balloon 帳戶中找到),然後按激活。 然後,單擊右上角的保存更改

粉碎氣球激活許可證嵌入視頻 WordPress 插件

您已準備好創建您的第一個 WordPress Instagram 提要。

第 2 步:創建新的 Instagram 動態

要在 WordPress 上設置新的 Instagram 提要,請前往Instagram 提要 » 所有提要。 按頂部的按鈕, + 添加新的

Smash Balloon Instagram Feed - 新增

接下來,選擇 Feed Type ,然後從前 3 個選項中進行選擇:

  • 用戶時間線– 顯示您個人資料中的 Instagram 照片和視頻。
  • 公共標籤– 顯示帶有您選擇的標籤的 Instagram 帖子。
  • 標記的帖子– 顯示標記了您的 Insta 帳戶的帖子。

注意:社交牆用於組合來自 Smash Balloon 的多個社交網絡插件(Twitter、Facebook、YouTube 和評論)的提要,以在您的站點上創建社交牆 WordPress 頁面。

粉碎氣球 Instagram 提要類型

如果您想使用Public HashtagTagged Posts ,您需要一個 Instagram 企業帳戶。 使用企業帳戶還可以讓您訪問高級功能,例如分析、聯繫按鈕和實時 Instagram 故事。

查看 Smash Balloon 將個人 Instagram 轉換為企業帳戶的教程。 或者,您可以選擇用戶時間線與任何帳戶一起使用,這就是我們將要使用的。

選擇您的提要類型後,按“下一步”按鈕。

無論您選擇哪種類型,您都需要在下一步中將新的 Feed 連接到您的 Instagram 帳戶。

第 3 步:將您的 Instagram 帳戶連接到 WordPress

在下一個屏幕上,單擊藍色按鈕+ 添加源

Smash Balloon Instagram 添加來源

現在,您將被帶到您的 Smash Balloon 帳戶。 選擇您要連接的 Instagram 帳戶類型。

Smash Balloon Connect Instagram - 賬戶類型

按下按鈕連接 Instagram

Smash Balloon 添加新來源 - 連接 Instagram

現在,您將被重定向到 Instagram,以授予 Smash Balloon 訪問您的提要的權限。 確保兩個權限都被勾選為藍色,然後按Allow

Smash Balloon 連接 Instagram - 允許

從這裡,您將被重定向回您的 WordPress 網站。 單擊以選擇您的新 Instagram 源,然後按右上角的“下一步”

粉碎氣球 Instagram 源

恭喜,您已經學會瞭如何將您的 Instagram 提要連接到 WordPress! 現在進入有趣的部分,您將設計您的 Feed 並對其進行自定義以匹配您的品牌。

第 4 步:自定義 Feed 的設計

首先,您需要為您的 WordPress Instagram 提要選擇一個模板(別擔心,您可以稍後在編輯器中更改它)。 我們將使用Default 。 按下一步按鈕。

提示:如果您使用的是個人帳戶,您可能會看到一個彈出窗口,用於添加您的個人資料照片和簡介。 您可以稍後通過導航到Instagram Feed » 設置並使用 Feed 源旁邊的設置圖標來添加它們,或者您可以使用編輯器為每個 Feed 設置它們。

Smash Balloon WordPress Instagram Feed 模板

接下來,您將到達實時編輯器,您可以在其中自定義您的 WordPress Instagram 提要,使其看起來完全符合您的需要。

在左側邊欄中,您會找到所有可以更改的選項,例如佈局、配色方案、標題設計、燈箱、帖子樣式、加載更多和關注按鈕等等。

注意:請記住,我們使用的是專業版。 如果您使用的是免費插件,您將無法使用所有相同的自定義選項和功能,但您仍然可以使用已有的選項,或者前往 Smash Balloon 的定價頁面進行升級。

實時預覽會在您進行更改時更新,這對於在確定最終 Instagram 提要設計之前嘗試不同的佈局和選項非常方便。

Smash Balloon Instagram Feed Pro 實時編輯器

有很多不同的定制,其中大部分是不言自明的。 我們建議您繼續嘗試不同的選項,直到您對 Instagram 動態的外觀感到滿意為止。

也就是說,我們將分享一些提示和您可能想要進行的常見更改。

自定義 Instagram Feed 的技巧

如需更多佈局選項,請單擊摘要佈局。 您可以使用CarouselMasonryHighlightGrid佈局更改帖子的排列方式。 然後,您可以使用高度和填充進一步自定義佈局以更改媒體之間的間距。

使用輪播佈局,您還可以自定義行數、循環類型、間隔時間、分頁、導航箭頭和自動播放。

同樣,突出顯示佈局允許您通過創建帖子模式和使用偏移來選擇突出顯示哪些帖子,或者您可以選擇通過帖子 ID 或主題標籤突出顯示。

如果您想查看您的提要在不同尺寸的設備上的外觀,只需單擊實時編輯器右上角的設備圖標即可。

默認情況下,Smash Balloon 將在移動設備和桌面設備上顯示相同數量的 Instagram 帖子。 更改此設置可能是個好主意,因為較小的設備具有較小的屏幕和較少的處理能力。 在Feed Layout 下,您可以更改Number of Posts下的字段。

在此下方,您可以更改為每種設備類型顯示的默認數。 如果您想為更注重燈箱的設計創建較小的縮略圖,這也很有用。

Smash Balloon Instagram 提要帖子/專欄的數量

您可以單擊側邊欄中的“設置”選項卡,為您的 Instagram 提要設置更多首選項,例如啟用可購物提要、更改帖子的排序順序、添加過濾器以控制哪些帖子出現在您的 WordPress 網站上,以及緩存您的提要。

Smash Balloon Instagram 提要編輯器 - 設置

完成自定義後,單擊右上角的保存按鈕。

第 5 步:在 WordPress 中嵌入您的 Instagram 提要

您已完成最後一步! 現在是學習如何將 Instagram 提要嵌入 WordPress 網站的時候了。

保存設計後,單擊嵌入按鈕。

Smash Balloon Instagram 編輯器保存/嵌入

您將有 3 個選項來決定您希望如何將 Instagram 提要嵌入您的網站。 我們將在下面逐一介紹,但請記下簡碼中feed=旁邊的數字(在我們的例子中為 1)。

粉碎氣球 嵌入 WordPress Instagram Feed

1.使用簡碼嵌入

如果您使用簡碼,您只需按下複製按鈕並將您的 Instagram 提要簡碼粘貼到任何頁面或使用 WordPress 簡碼塊發布。

您始終可以通過轉到Instagram Feed » All Feeds找到不同 Feed 的簡碼。 在這裡,您會在每個提要旁邊看到您的簡碼。

2. 將您的提要添加到頁面

如果您選擇添加到頁面,您將看到一個頁面列表,您可以選擇要將提要嵌入其中的頁面。 它會自動將您帶到該頁面的 WordPress 編輯器。 您也可以在編輯帖子或頁面時隨時使用此選項。

在 WordPress 編輯器中,單擊+圖標添加一個新塊。 開始輸入Instagram Feed ,您會看到阻止選項出現。

粉碎氣球 Instagram 提要 WordPress 塊

默認情況下,該塊將使用您的一個提要,如果您有多個提要,您需要選擇顯示哪個提要。 在側邊欄的簡碼設置下,將feed=” 更改為正確的數字。 然後,按Apply Changes

Smash Balloon WordPress Instagram Feed 塊 - 簡碼設置

3. 添加 Instagram 小部件

您還可以將您的 Instagram 內容添加為提要小部件,如果您想在所有頁面上輕鬆展示提要(例如在側邊欄或頁腳中),這是一個很好的選擇。

如果您從嵌入選項中單擊“添加到小部件” ,您將被帶到您站點的小部件區域。 (您也可以通過外觀 » 小部件找到它)。

在這裡,只需單擊頁面頂部的藍色+圖標即可添加新小部件,然後開始在左側邊欄中輸入Instagram Feed 。 當您看到它時,您可以將它拖到您選擇的小部件位置。

注意:您的 WordPress 主題必須支持小部件區域才能使用此選項,但許多主題都支持常見的小部件位置。

粉碎氣球 WordPress Instagram 提要 添加小部件

如果它沒有顯示您想要的單個提要,您可以在側邊欄的簡碼設置下更改提要=數字,就像我們在上一個嵌入選項期間在頁面編輯器中所做的那樣。

按右上角的更新使您的提要小部件生效。

就是這樣! 您成功學會瞭如何創建 WordPress Instagram 提要!

查看我們使用 Smash Balloon 製作的最終 Instagram 照片源。

Smash Balloon Instagram Feed 示例

現在您已經在您的 WordPress 網站上設置了一個很棒的 Instagram 提要,使用 MonsterInsights 來跟踪您的新提要頁面的流量和轉化!

如果您喜歡這篇文章,您肯定想查看如何設置 Google Analytics 社交媒體跟踪。

還沒有使用 MonsterInsights? 你在等什麼?

不要忘記在 Twitter、Facebook 和 Youtube 上關注我們以獲得最佳的 WordPress 教程和 Google Analytics 更新。

尋找 Smash Balloon 的替代品? 查看這些插件:

  • 不可思議的自動化
  • 重振社會
  • 餵他們社交
  • WP縮放