ارزدیجیتال
حراجی دامنه های ویژهمشاهده





وینگو مارکت
تبلیغات
تبلیغات
تبلیغات تبلیغات
تبلیغات تبلیغات

ساخت نوار تبلیغات شناور در صفحات وردپرس

مقالات,آموزش,ترفند , وردپرس

نوار تبلیغات شناور چیست؟

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

ساخت نوار تبلیغات شناور در صفحات وردپرس

اینکار باعث اکاهش bounce rate یا همان نرخ پرش سایت می شود. چرا که کاربر را ترغیب می کند تا از صفحات دیگر سایت شما نیز بازدید کند. ( به دلیل چشمگیر بودن محل تبلیغات ) از این نوار برای اهداف زیر استفاده می شود:

  •  کلیک بیشتر روی لینک ها و دیدن سایر صفحات
  •  دریافت لیست ایمیل کاربران
  •  فروش محصولات

 

چگونه یک نوار ثابت به فوتر سایتمان اضافه کنیم؟

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

ابتدا وارد بخش نمایش > ویرایشگر شوید. حالا فایل footer.php را باز کنید و کد زیر را در انتهای آن قبل از </body> قرار دهید.

<div class="fixedBar">
<div class="boxfloat">
<ul id="tips">
<li><a href="http://www.20script.ir/">آیا می دانید بیست اسکریپت سایتی هست مرجع برای وبمستر ها؟</a></li>
<li><a href="http://www.20script.ir/userpro">آیا می خواهید برترین افزونه عضویت برای وردپرس را بشناسید؟</a></li>
</ul>

</div>
</div>

حالا فایل style.css قالب سایتتان را باز کرده و کد زیر را در انتهای آن paste کنید:

.fixedbar {
background: #000; 
bottom: 0px; 
color:#fff; 
font-family: Arial, Helvetica, sans-serif; 
left:0; 
padding: 0px 0; 
position:fixed; 
font-size:16px; 
width:100%; 
z-index:99999; 
float:left; 
vertical-align:middle; 
margin: 0px 0 0; 
opacity: 0.95; 
font-weight: bold;
}
.boxfloat {
text-align:center; 
width:920px; 
margin:0 auto;
}

#tips, #tips li {
margin:0; 
padding:0; 
list-style:none
}
#tips {
width:920px; 
font-size:20px; 
line-height:120%;
}
#tips li {
padding: 15px 0; 
display:none;
}
#tips li a{
color: #fff;
}
#tips li a:hover {
text-decoration: none;
}

حالا کد زیر را به فایل header.php قالب سایتتان قبل از </head> اضافه کنید:

<script>
(function($) {
this.randomtip = function(){
	var length = $("#tips li").length;
	var ran = Math.floor(Math.random()*length) + 1;
	$("#tips li:nth-child(" + ran + ")").show();
};

$(document).ready(function(){	
	randomtip();
});
})( jQuery );
</script>

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

متن را از فایل footer.php می توانید تغییر دهید و لینک دلخواه خود را به جای http://www.20script.ir وارد کنید.

این محتوا چقدر براتون مفید بود؟

از ۱ تا ۵ امتیاز بدید.

میانگین رتبه 5 / 5. تعداد رای : 1

تا حالا کسی رای نداده! اولین نفر شما باشید.

دانلود

هاست ارزان، لایت اسپید، سرور مجازی منطبق با اسکریپت های 20script کلیک کنید >

خرید ارز
نحوه استفاده

کافیست افزونه را در مسیر wp-content/plugins آپلود کنید و سپس از بخش مدیریت افزونه ها آن را فعال نمایید.

مطلب مفیدی بود ؟
نویسنده : تیم محتوای 20اسکریپت 0 مقالات,آموزش,ترفند , وردپرس
لینک کوتاه مطلب : https://www.20script.ir/?p=36341
کلمات کلیدی پست :
مطالب مرتبط
9,560افزودن لینک دلخواه در نوار ابزار وردپرس تاریخ : 2018/04/3
13,002خروجی گرفتن از آدرس‌های وردپرس با افزونه Export All URLs تاریخ : 2017/07/3
16,784دانلود قالب آرتمن وب برای وردپرس تاریخ : 2016/08/26
9,980ایجاد جستجوگر پیشرفته در وردپرس با افزونه Algolia تاریخ : 2019/05/19
12,612دانلود افزونه کاربردی Image Elevator نسخه 1.8.8 تاریخ : 2014/05/27
8,852آموزش رفع خطای نمایش ندادن پیشخوان وردپرس تاریخ : 2019/07/9
18,789هدایت کاربران به صفحه خاص پس از ورود با افزونه Peter’s Login Redirect تاریخ : 2017/08/29
19,816ایجاد برگه سوالات متداول در وردپرس با افزونه Easy Accordion تاریخ : 2019/12/23
26,696دانلود قالب سایت چهارده ورژن ۲ برای وردپرس تاریخ : 2014/08/13
9,152افزایش منابع هاست با ویرایش فایل php.ini در کنترل پنل CPanel تاریخ : 2019/10/23
9,640بهترین افزونه آموزش آنلاین وردپرس چیست؟ تاریخ : 2019/11/18
8,960کاندید نهایی (شماره۱) وردپرس ۵٫۰ تاریخ : 2018/12/16
برخی از قالب های وبلاگ - بیست اسکریپت
قالب عشق بین انگشت هاقالب عشق بین انگشت ها
قالب دخترونه و آرایشقالب دخترونه و آرایش
قالب زیبای ماشینقالب زیبای ماشین
قالب فانتزی و طنز چِشمقالب فانتزی و طنز چِشم
قالب دختر رویاییقالب دختر رویایی
قالب وبلاگ دکوراسیونقالب وبلاگ دکوراسیون
قالب وبلاگ کلبه و درختقالب وبلاگ کلبه و درخت
قالب دختر زیباقالب دختر زیبا
قالب پسرونه غمگینقالب پسرونه غمگین
قالب عاشقانه قلبقالب عاشقانه قلب