چگونه به راحتی اعلان برگه مرورگر را در وردپرس اضافه کنیم

آیا می خواهید اعلان های برگه مرورگر را برای وب سایت خود اضافه کنید؟

افزودن اعلان‌ها به برگه مرورگر می‌تواند راهی عالی برای جلب توجه کاربر باشد، می‌تواند نرخ رها شدن سبد خرید را کاهش دهد و فروش و درآمد را افزایش دهد.

در این مقاله به شما نشان خواهیم داد که چگونه اعلان های تب مرورگر را در وردپرس اضافه کنید.

اعلان برگه مرورگر چیست؟

اعلان برگه مرورگر زمانی است که وقتی کاربر روی سایت دیگری در مرورگر خود تمرکز می کند، چیزی را در برگه وب سایت خود تغییر می دهید.

با افزودن ویژگی اعلان برگه مرورگر به وب سایت وردپرس خود، می توانید توجه کاربر را در لحظه ای که برگه دیگری را برای خروج از صفحه شما باز می کند، جلب کنید.

به عنوان مثال، می توانید فاویکون وب سایت خود را تغییر دهید، آن را متحرک سازید، یک پیام سفارشی بنویسید یا به سادگی تب را فلش کنید.

اگر یک فروشگاه آنلاین دارید، اعلان‌های برگه مرورگر واقعا می‌توانند کمک کنند. این اعلان‌ها مشتریان پریشان را باز می‌گرداند، نرخ رها کردن سبد خرید را کاهش می‌دهد و تعامل مشتری را افزایش می‌دهد.

با استفاده از این ویژگی، می توانید مشتریان خود را در مورد رها شدن سبد خرید آگاه کنید یا حتی اگر توجه خود را به سایت شما برگردانند، تخفیف بدهید.

در اینجا نمونه ای از اعلان برگه مرورگر آمده است.

همانطور که گفته شد، ما به شما نشان می دهیم که چگونه سه نوع مختلف اعلان های مرورگر را به وردپرس اضافه کنید.

WPCode را نصب کنید تا اعلان‌های برگه مرورگر را اضافه کنید

با افزودن کد سفارشی در وردپرس می توانید به راحتی اعلان ها را به تب مرورگر سایت خود اضافه کنید. شما معمولاً باید فایل functions.php تم خود را ویرایش کنید، اما این می تواند حتی با یک اشتباه کوچک وب سایت شما را خراب کند.

به همین دلیل است که توصیه می کنیم از WPCode، ایمن ترین و محبوب ترین افزونه قطعه کد استفاده شده توسط بیش از 1 میلیون وب سایت استفاده کنید.

ابتدا باید افزونه رایگان WPCode را نصب و فعال کنید. برای جزئیات بیشتر، می توانید راهنمای گام به گام ما در مورد نحوه نصب افزونه وردپرس را مشاهده کنید.

پس از فعال سازی افزونه کافیست به قطعه کد » همه قطعه ها در پنل مدیریت وردپرس شما

فقط روی دکمه Add New کلیک کنید، که شما را به صفحه Add Snippet هدایت می کند.

اکنون ماوس را روی گزینه «افزودن کد سفارشی (نسخه جدید)» ببرید و روی دکمه «استفاده از قطعه» در زیر آن کلیک کنید.

سپس افزونه شما را به صفحه Create Custom Snippet می برد.

مهم نیست که از کدام نوع اعلان برگه مرورگر استفاده می کنید، کد زیر را با استفاده از این صفحه وارد خواهید کرد.

نوع 1. به روز رسانی های جدید را به عنوان یک اعلان در برگه مرورگر نمایش دهید

در صورت استفاده از کد زیر، کاربران شما از هر به روز رسانی جدیدی که در سایت شما ارسال می شود مطلع می شوند. یک عدد در برگه ظاهر می شود که به آنها می گوید چند آیتم جدید از دست داده اند.

به عنوان مثال، اگر یک فروشگاه آنلاین دارید و به تازگی محصولات جدیدی را به موجودی اضافه کرده اید، کاربر اعلان را در تب مرورگر به صورت عددی مشاهده می کند که نشان می دهد چند محصول جدید اضافه شده است.

این را می توانید در تصویر زیر مشاهده کنید:

هنگامی که در صفحه Create Custom Snippet هستید، باید قطعه خود را نامگذاری کنید. شما می توانید هر چیزی را انتخاب کنید که به شما در شناسایی کد کمک کند. این فقط برای شماست.

سپس از منوی کشویی سمت راست «نوع کد» را انتخاب کنید. این کد جاوا اسکریپت است، بنابراین فقط بر روی گزینه “Snippet جاوا اسکریپت” کلیک کنید.

پس از آن، تنها کاری که باید انجام دهید این است که قطعه کد زیر را کپی و در قسمت پیش نمایش کد قرار دهید.

let count = 0;
const title = document.title;
function changeTitle() {
    count++;
    var newTitle="(" + count + ') ' + title;
    document.title = newTitle;
}
function newUpdate() {
    const update = setInterval(changeTitle, 2000);
}
document.addEventListener('DOMContentLoaded', newUpdate );

پس از چسباندن کد، به قسمت «درج» بروید. دو گزینه پیدا خواهید کرد: «درج خودکار» و «کد کوتاه».

کافی است گزینه «درج خودکار» را انتخاب کنید تا کد شما به صورت خودکار در سایت شما درج و اجرا شود.

اگر می‌خواهید به‌روزرسانی‌های جدید را فقط در صفحات خاصی که کد کوتاه را اضافه می‌کنید نشان دهید، می‌توانید از روش Shortcode استفاده کنید.

پس از انتخاب گزینه خود، به بالای صفحه بازگردید.

روی سوئیچ از “غیر فعال” به “فعال” در گوشه سمت راست بالا کلیک کنید و سپس به سادگی روی دکمه “ذخیره قطعه” کلیک کنید.

وقتی این کار کامل شد، قطعه کد سفارشی شما به سایت شما اضافه می شود و راه اندازی می شود.

نوع 2. Favicons را به عنوان اعلان برگه مرورگر تغییر دهید

با این روش وقتی کاربران به تب دیگری می روند، فاویکون متفاوتی را در تب مرورگر سایت خود نمایش می دهید.

فاویکون تصویر کوچکی است که در مرورگرهای وب مشاهده می کنید. اکثر کسب و کارها از نسخه کوچکتری از لوگوی خود استفاده می کنند.

اکنون برای تغییر فاویکون ها در تب مرورگر خود از افزونه WPCode استفاده می کنیم.

ابتدا برو به قطعه کد » همه قطعه ها در پنل مدیریت وردپرس خود و سپس روی دکمه «افزودن جدید» کلیک کنید.

سپس فقط روی گزینه Add Custom Code (New Snippet) بروید و روی دکمه Use Snippet در زیر آن کلیک کنید.

این شما را به صفحه Create Custom Snippet می برد. می توانید با وارد کردن عنوانی برای قطعه کد خود شروع کنید.

اکنون فقط “نوع کد” را از منوی کشویی سمت راست انتخاب کنید. برای این قطعه کد، باید گزینه «HTML Snippet» را انتخاب کنید.

هنگامی که این کار را انجام دادید، به سادگی کد زیر را کپی کرده و در نمایشگر کد قرار دهید.

<link id="favicon" rel="icon" href="https://example.com/wp-content/uploads/2022/10/favicon.png"/>

<script>var iconNew = 'https://example.com/wp-content/uploads/2022/10/favicon-notification.png';

function changeFavicon() {
    document.getElementById('favicon').href = iconNew;
}
function faviconUpdate() {
    const update = setInterval(changeFavicon, 3000);
    setTimeout(function() { 
        clearInterval( update ); 
    }, 3100);
}

پس از چسباندن کد، به سادگی لینک های فاویکون نمونه را از کد حذف کرده و آنها را با تصاویر خود جایگزین کنید.

به یاد داشته باشید که تصاویری که به عنوان فاویکون انتخاب می کنید باید قبلاً در کتابخانه رسانه وردپرس شما آپلود شده باشند.

در غیر این صورت کد کار نمی کند و فاویکون شما طبق معمول نمایش داده می شود.

پس از چسباندن پیوندها به فاویکون های جدید، به قسمت «درج» بروید. در اینجا دو گزینه پیدا خواهید کرد: “درج خودکار” و “کد کوتاه”.

اگر می‌خواهید کد را به‌طور خودکار در هر صفحه جاسازی کنید، می‌توانید گزینه «درج خودکار» را انتخاب کنید.

برای تغییر فاویکون فقط در صفحات خاص، گزینه “Shortcode” را انتخاب کنید و آن را در هر ناحیه ای که دارای کد کوتاه فعال است، مانند ابزارک های نوار کناری یا در پایین ویرایشگر محتوا، قرار دهید.

سپس فقط به بالای صفحه بروید و سوئیچ را از “غیر فعال” به “فعال” در گوشه بالا سمت راست تغییر دهید و سپس روی دکمه “ذخیره قطعه” کلیک کنید.

سپس فاویکون شما به عنوان اعلان برگه مرورگر شروع به تغییر می کند.

نوع 3. تغییر عنوان سایت به عنوان یک اعلان در تب مرورگر

اگر می خواهید عنوان سایت را تغییر دهید تا دوباره توجه بازدیدکننده خود را به خود جلب کنید، می توانید از این روش استفاده کنید.

با استفاده از این قطعه کد، عنوان سایت شما تغییر می کند تا زمانی که کاربران به برگه دیگری در مرورگر می روند، پیامی چشم نواز نمایش می دهد.

ما از افزونه WPCode برای تغییر عنوان سایت شما به عنوان اعلان برگه مرورگر استفاده خواهیم کرد.

برای رفتن به صفحه Create Custom Snippet، به قطعه کد » همه قطعه ها و فقط روی دکمه “افزودن جدید” کلیک کنید.

سپس به سادگی گزینه «افزودن کد سفارشی» را همانطور که در مثال های بالا نشان داده شده است انتخاب کنید.

اکنون که در صفحه Create Custom Snippet هستید، با وارد کردن عنوانی برای قطعه کد خود شروع کنید.

سپس باید «نوع کد» را از منوی کشویی سمت راست انتخاب کنید. از آنجایی که این کد جاوا اسکریپت است، به سادگی بر روی گزینه “Snippet جاوا اسکریپت” کلیک کنید.

سپس به سمت پایین اسکرول کنید و به گزینه “Location” بروید و روی منوی کشویی کنار آن کلیک کنید.

از منوی کشویی، به سادگی بر روی گزینه “Wide Site Footer” کلیک کنید.

پس از آن، تنها کاری که باید انجام دهید این است که قطعه کد زیر را کپی و در پیش نمایش کد قرار دهید.

function changeTitleOnBlur() {
	var timer     = null;
	var	title     = document.title;
	var altTitle="Return to this page!";
	window.onblur = function() {
		timer = window.setInterval( function() {
			document.title = altTitle === document.title ? title : altTitle;
		}, 1500 );
	}
	window.onfocus = function() {
		document.title = title;
		clearInterval(timer);
	}
}

changeTitleOnBlur();

هنگامی که کد را جایگذاری کردید، اکنون می توانید آن را ویرایش کنید و به سادگی هر پیامی را که می خواهید در برگه مرورگر شما در کد ظاهر شود بنویسید.

برای نوشتن پیامی که می خواهید، کافیست به آدرس زیر بروید var altTitle="Return to this page!"; را خط بکشید و متن محفظه پیام اعلان را در برگه مرورگر خود حذف کنید.

سپس به قسمت Insert بروید، جایی که دو روش درج را پیدا خواهید کرد: Auto Insert و Shortcode.

اگر روی گزینه «درج خودکار» کلیک کنید، اعلان در برگه مرورگر شما در هر صفحه فعال خواهد بود. با این حال، اگر می خواهید پیام چشم نواز خود را فقط در صفحات خاصی قرار دهید، می توانید گزینه “Shortcode” را انتخاب کنید.

برای مثال، ممکن است بخواهید این کد را فقط در صفحه «افزودن به سبد خرید» اضافه کنید تا بتواند نرخ رها شدن سبد خرید در وب سایت شما را کاهش دهد.

در این صورت می توانید گزینه Shortcode را انتخاب کنید.

تنها چیزی که بعد از آن باقی می ماند این است که به بالای صفحه بروید و سوئیچ را از «غیر فعال» به «فعال» تغییر دهید، سپس روی دکمه «ذخیره قطعه» کلیک کنید.

این است! اکنون اعلان موجود در برگه مرورگر شما به کاربرانی که سایت شما را ترک می کنند هشدار می دهد.

امیدواریم این مقاله به شما در یادگیری نحوه افزودن اعلان‌های برگه مرورگر در وردپرس کمک کرده باشد. همچنین ممکن است بخواهید آموزش ما را در مورد نحوه افزودن اعلان‌های فشار وب به سایت وردپرس خود ببینید و برگزیده‌های ما از افزونه‌های ضروری وردپرس را برای رشد سایت خود بررسی کنید.

اگر از این مقاله لذت بردید، لطفا در کانال یوتیوب ما برای آموزش های ویدئویی وردپرس مشترک شوید. شما همچنین می توانید ما را در توییتر و فیس بوک