單擊鏈接或圖像時如何打開WordPress彈出式表單


您是否要創建一個彈出窗口,當訪問者單擊站點上的鏈接或圖像時出現?

這是增加您的電子郵件列表的一種行之有效的方法,並且流行站點經常使用它來提供激勵措施。

在本文中,我們將逐步展示如何在單擊鏈接或圖像時打開WordPress彈出窗口。

它並不像您認為的那樣在單擊時觸發WordPress彈出表單那樣複雜。 在本文中,我們將向您展示如何進行。

在您的網站上添加一個點擊彈出式表單

什麼是“點擊時”彈出式表單?

點擊彈出式窗口是燈箱彈出式窗口,當用戶單擊您網站上的鏈接,按鈕或圖像時打開。

通常,彈出窗口會在用戶到達或即將離開時出現在網站上。 單擊時,用戶交互會觸發彈出表單。

單擊彈出窗口示例

我們使用WPBeginner網站上的兩個單擊彈出窗口來增加電子郵件列表:第一個出現在所有社交圖標旁邊的側邊欄電子郵件圖標上,第二個出現在每個帖子下方,以下載我們的工具包。

創建點擊彈出窗口的最簡單方法是為WordPress使用彈出窗口插件。 我們將在本教程中使用OptinMonster。

為什麼單擊彈出式窗口如此有效?

單擊彈出窗口是有效的,因為它使用了強大的Zeigarnik效果。 這是一種心理原則,指出開始執行某項操作的用戶更有可能完成該操作。

當某人單擊鏈接或按鈕觸發您的彈出窗口時,他們已經表現出興趣。 當表單彈出窗口出現時,他們將更有可能使用它。

在本教程中,我們將使用一個單擊彈出窗口來提供鉛磁鐵。

但是,還有其他方法可以使用網站上的單擊彈出窗口。 例如,您可以要求用戶索取優惠券代碼,了解有關產品的更多信息,填寫調查表等等。

話雖如此,讓我們來看看如何輕鬆地為您的網站製作一個點擊式燈箱彈出窗口。

安裝和激活OptinMonster

首先,您需要註冊一個OptinMonster帳戶。 您將需要Pro帳戶(或更高版本)。 這為您提供了MonsterLinks™功能,可讓您在單擊彈出窗口中創建。

接下來,您需要在WordPress網站上安裝並激活OptinMonster插件。 這使您可以將OptinMonster帳戶連接到WordPress網站。

如需幫助,請參閱有關如何安裝WordPress插件的分步指南。

激活插件後,您需要連接您的帳戶。 您應該自動進入“歡迎”頁面。 如果沒有,只需單擊WordPress儀表板中的OptinMonster鏈接。

點擊“連接您的帳戶”,然後按照屏幕上的說明進行操作。

將您的OptinMonster帳戶連接到WordPress網站

創建您的首次單擊彈出窗口

將OptinMonster帳戶連接到WordPress網站後,就可以開始創建單擊彈出式窗口了。 點擊屏幕頂部的“創建新廣告系列”按鈕:

在OptinMonster中創建新的廣告系列

您將直接進入OptinMonster網站。

廣告系列類型應該已經設置為彈出窗口。 如果沒有,只需單擊彈出窗口將其選中。

將“彈出式”保留為您的廣告系列類型

接下來,選擇一個廣告系列模板。 稍後,您將可以精確修改外觀。 在本教程中,我們將使用“基本”模板。

為您的單擊彈出菜單選擇基本模板

將光標移到模板上,然後單擊“使用模板”按鈕。

單擊以使用基本模板進行點擊彈出

現在,系統將提示您輸入廣告系列的名稱。 如果您在多個站點上使用OptinMonster,請確保選擇正確的站點。 如果需要,請輸入一個新網站。 然後,單擊“開始構建”以創建您的彈出窗口。

為您的廣告系列命名,然後單擊以開始製作

OptinMonster將自動加載您選擇的模板。

您可以編輯默認文本並從模板中添加或刪除元素。 只需單擊您要編輯的任何內容。

編輯OptinMonster中彈出窗口的標題

例如,我們將從表單中刪除“名稱”字段。 只需單擊該字段以將其選中,您將在左列中看到字段選項,包括刪除它的選項。

從彈出窗口中刪除名稱字段

設計彈出窗口後,下一步就是設計成功視圖,這是人們填寫表單後看到的內容。 只需切換到屏幕頂部的“成功”視圖即可。

訪客輸入電子郵件地址後將看到的“成功”視圖

您可以像編輯optin視圖一樣編輯成功視圖。 例如,您可能想讓用戶立即下載鉛磁石。 您可以在此處包含指向它的鏈接。

要向圖像添加鏈接,請單擊圖像,然後向下滾動至“向圖像添加鏈接?”。 在左手側。

您可以切換以啟用圖像鏈接,並在“ URL”框中輸入指向您的鉛磁鐵的鏈接。

在OptinMonster中將鏈接添加到彈出圖像

將彈出窗口連接到電子郵件列表

對彈出窗口滿意後,請點擊屏幕頂部的“集成”標籤。 您需要將OptinMonster鏈接到您的電子郵件營銷服務,以便可以將其他人添加到您的電子郵件列表中。

點擊屏幕左側的“ +添加新集成”按鈕。

在OptinMonster中添加新的電子郵件集成

接下來,從下拉列表中選擇您的電子郵件提供商,然後按照說明將其連接到OptinMonster。

從下拉列表中選擇您的電子郵件服務提供商

注意: 每種電子郵件營銷服務的集成說明都不同。 如果您遇到困難,OptinMonster會提供詳細的電子郵件集成指南列表。

將彈出窗口設置為在點擊時顯示

現在,您需要配置彈出窗口,以便在用戶單擊鏈接時出現。 點擊屏幕頂部的“顯示規則”標籤。

OptinMonster中的默認顯示規則

顯示規則默認為頁面停留時間。 單擊下拉列表,然後選擇“訪客單擊MonsterLink™”。

切換顯示規則,以便您的彈出窗口使用MonsterLink功能

單擊按鈕以復制您的MonsterLink™代碼。 您稍後會需要它。

使點擊彈出窗口生效

現在,轉到“發布”標籤,然後將廣告系列的狀態設置為“實時”。 您還可以檢查或更改廣告系列所連接的網站。

將點擊彈出窗口的廣告系列狀態切換為實時

完成此操作後,單擊屏幕頂部的“保存”按鈕。

接下來,您需要在WordPress網站本身上投放廣告系列。

轉到WordPress儀表板,然後單擊OptinMonster鏈接。 點擊刷新廣告系列按鈕。

在OptinMonster儀表板中刷新廣告系列列表

您應該看到廣告系列,顯示為“實時”。 如果您想隨時禁用它,只需點擊廣告系列名稱下方的“禁用”鏈接。

WordPress儀表板中的OptinMonster廣告系列列表

將您的MonsterLink添加到您的網站

現在,您需要將特殊的MonsterLink™添加到您的站點。 如果您之前沒有復製過此內容,則可以通過返回MonsterInsights網站中廣告系列的“顯示規則”設置來獲取。

創建一個新的帖子或頁面,或編輯要添加鏈接的位置。

MonsterLink是HTML代碼,因此您需要將其粘貼到自定義HTML塊中。

單擊(+)按鈕添加一個新塊。 “自定義HTML”塊位於“格式”部分,或者您可以使用搜索欄進行搜索。 單擊它創建塊。

在WordPress中添加自定義HTML塊

現在,將您的MonsterLink複製到該塊中。 它看起來應該像這樣:

HTML塊中的MonsterLink

您可以更改“點擊我!”一詞。 到您要用於鏈接的任何文本。 我們將使用“點擊獲取獎金10提示!”

帶自定義文本的MonsterLink

放置鏈接後,您可以預覽頁面或發布信息以確保其正常工作。

這是我們的行動紐帶。 請注意,我們對文本應用了一些樣式,以創建帶有較大文本的框,以幫助提升鉛磁鐵:

行動中的點擊彈出式表單

小費: 您不僅限於使用MonsterLinks的文本鏈接。 您還可以將MonsterLink與網站上的號召性用語按鈕,圖像,橫幅或導航菜單一起使用。

我們希望本教程可以幫助您學習如何在點擊時觸發WordPress彈出式表單。 您可能還想看一下我們有關如何加快WordPress網站速度的教程,以及我們最終的WordPress SEO指南。

如果您喜歡這篇文章,請訂閱我們的YouTube頻道WordPress視頻教程。 您也可以在找到我們 推特 和Facebook。