کد بنر ثابت گوشه ای سایت و وردپرس با قابلیت بسته شونده

کد بنر ثابت گوشه ای سایت و وردپرس

در این مقالات آموزشی وردپرس با کد بنر ثابت گوشه سایت و همچنین وردپرس در خدمت شما کاربران عزیز هستیم با توجه به اینکه بعد از انتشار مقالات مربوط به تبلیغات بنری و تبلیغات متنی با استفاده از افزونه وردپرس درخواست هایی از سوی کاربران داشتیم برای اضافه کردن کد بنر ثابت گوشه ای سایت و وردپرس که ما در این مقاله قصد داریم به این اموزش پردازیم و  نحوه قرار دادن بنر تبلیغاتی گوشه ای را آموزش دهیم با ما همراه باشید…

بنر ثابت سایت چیست؟  همانطور که از نامش پیداست شما قادر هستید بنرهای تبلیغاتی را به صورت ثابت در هر جایی از وبسایت خود در معرض دید کاربران قرار دهید که با اسکرول سایت این بنر نیز به همراه اسکرول بالا و پایین حرکت خواهد کرد. برای مثال اگر شما یک بنر ثابت در گوشه سمت چپ وب سایت خود قرار دهید در هر صفحه از سایت شما اگر کاربران اسکرول رو انجام بدهند این بنر نیز به همراه اسکرول حرکت خواهد کرد به این امر بنر ثابت سایت و وردپرس گفته می شود.

اگر آموزش های وردپرس ما را دنبال کرده باشید ما طی چند مقاله آموزشی نحوه قرار دادن بنر تبلیغاتی در سایت و وردپرس را به وسیله افزونه آموزش دادیم و همچنین نحوه قرار دادن تبلیغات متنی با استفاده از کد را نیز ارائه کردیم اما با توجه به اینکه بعضی از کاربران به هر دلیلی قادر  نیستند از افزونه وردپرس استفاده کنند یا قصد ندارند برای اضافه کردن هر امکانی از پلاگین استفاده کنند کمک بگیرند، در این بخش ما نحوه قرار دادن بنر ثابت گوشه ای وردپرس و سایت را به صورت کد ارائه کردیم که می‌تواند نیاز شما را به صورت کامل رفع کند.

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

آموزش نحوه قرار دادن بنر ثابت گوشه ای سایت

برای درج بنر ثابت گوشه ای در وردپرس یا سایت خود ابتدا کد زیر را داخل فایل style.css قالب وردپرس خود قرار دهید.

 

#banner a {
position:fixed;
display:block;
right:3px;
bottom:3px;
width:120px;
height:240px;
background:url('https://winza.ir/wp-content/uploads/2019/01/baner-fixid-ghabcgin.jpg') transparent no-repeat scroll center center;
}

 

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

  • ما در استایل این بنر ثابت گوشه ای  مشخص کردیم که از سمت پایین و راست 5px فاصله داشته باشد. ( right و bottom )
  • از نظر سایز هم مشخص کردیم که بنر تبلیغاتی 120 در 240  باشد. ( width و height )
  • همچنین شما باید آدرس  بنر خود را جایگزی آدرس پیش فرض ما یعنی https://winza.ir/wp-content/uploads/2019/01/baner-fixid-ghabcgin.jpg بکنید.

بعد از وارد کردن کد بالا در فایل style.css  پوسته وردپرس خود نوبت به نمایش بنر ثابت گوشه ای در وب سایت است برای این کار کافیست از کد زیر استفاده کنید.

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

 

<div id="banner"><a href="https://winza.ir/" title="قالب وردپرس"> </a></div>

 

اگر به کد بالا نگاه کنید  ما اطلاعاتی برای بنر خود مشخص کردیم که شما می توانید آن را تغییر دهید.

  • به جای لینک فرود ما یعنی https://winza.ir/ لینک مورد نظر خود را جایگزین کنید. لینک فروشد یعنی اگر روی بنر کلیک شود کابر به این آدرس منتقل خواهد شد.
  • برای بنر ثابت گوشه ای سایت خود یک عنوان مشخص کنید برای مثال ما همان ” قالب وردپرس “ را وارد کردیم شما می توانید عنوان بنر خود را جایگزین این کلمه بکنید.

خوب کار تمام است و شما می توانید نتیجه کار را مشاهده کنید.

بنر ثابت گوشه ای وردپرس

کد بنر ثابت گوشه ای با استفاده از javascript با قابلیت بشته شونده

در ادامه آموزش کد قرار دادن بنر ثابت گوشه ای در وب سایت کد جاوا اسکریپتی را آماده کردیم که می تواند در نوع خود بی نظیر و منحصر به فرد باشد و دیگر نیازی به قرار دادن  کدی در فایل style.css نیست.فقط کافیست کد زیر  را پس از سفارش سازی و جایگزین مشخصات خود آن را داخل فایل footer.php و قبل از تگ </body>  قرار دهید.

 

<!---https://winza.ir/ --->
<script type="text/javascript" src="https://dl.winza.ir/free/plugins/97/baner.swf"></script><a title="قالب وردپرس "target="_blank" href="https://winza.ir/"><img style="width: 100%;max-width: 122px;height: auto"alt="قالب وردپرس" src="https://winza.ir/wp-content/uploads/2019/01/baner-fixid-ghabcgin.jpg"title="وینزا"></a></div>
<!--- https://winza.ir/ --->

 

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

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

بنر ثابت گوشه ای بسته شونده

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

در این رابطه بخوانید:

افزونه قرار دادن تبلیغات بنری در وردپرس

افزونه تبلیغات متنی وردپرس

کد تبلیغات متنی وردپرس

 

منبع: وینزا

5/5 امتیاز

این مقاله را به اشتراک بگذارید

Share on facebook
Share on twitter
Share on linkedin
Share on pinterest
Share on telegram
Share on whatsapp

مطالب زیر را حتما بخوانید

6 پاسخ

  1. سلام وقت بخیر چطوری میتونم سایزشو تو موبایب کوچیک تر کنم یا جاشو تو موبایل عوض کنم؟

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

  2. سلام وقت شما بخیر
    ممنون از آموزش خوبتون
    چطور میشه دو کد (بنر) رو زیر هم قرار داد که هر دو رو بخونه؟ وقتی دو کد قرار میدم دومی رو نمیخونه
    اسم و استایل بنر دوم رو هم تغییر دادم اما متاسفانه دومی رو نمیخونه

    1. سلام سپاس از شما بهار عزیز،
      نیازی نیست استایل رو تغییر بدید کافیه کد html رو دو بار کنار هم یا همان زیر هم کپی کنید و فقط آدرس بنر ها رو با بنر خودتون تغییر بدید.
      احتمالا شما جایی دارین اشتباه کار میکنین برس کنید.
      با تشکر

  3. سلام خسته نباشید
    ممنون از آموزش خوبتون من مراحل انجام دادم ولی وقتی روش کلیک میکنم میخوام به تلگرام متصل بشه ولی وصل نمیشه ممنون میشم راهنمایی کنید

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

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *