سلام امروزمیخوام درمورد افزودن Banner به سایت WordPress بیاموزیم امیدوارم که براتون مفید باشه
امروزه تبلیغات بخش اصلی بیشتر وب سایت ها را تشکیل می دهد. در این مبحث نحوه ی افزودن banner به بخش های مختلف سایت را به شما خواهیم آموخت. بیشتر وب سایت هایی که banner های تبلیغاتی جزئی از آن ها است، کد مربوط به آن را نیز به طور کامل در اختیار شما قرار می دهد. کافی است محل قرارگیری banner در سایت را انتخاب کرده و دستورات زیر را دنبال نمایید:
۱٫ نحوه ی افزودن banner به نوارکناری (sidebar)
۲٫ چگونگی افزودن banner های تبلیغاتی در یک صفحه یا پست مشخص
۳٫ نحوه ی افزودن banner در بالا یا زیر تمامی پست ها یا صفحات
۴٫ افزودن banner به ناحیه ی footer یا header صفحه
۵٫ استفاده از افزونه برای نمایش banner در صفحه
افزودن banner تبلیغاتی به نوارکناری صفحه
اگر به سایت های مختلف دقت کرده باشید، می دانید که از ساید بار یا نوارکناری برای نمایش banner های تبلیغاتی استفاده می شود. برای این منظور دو راه پیشرو دارید: ۱٫ اگر پوسته ی سایت از ابزارک در نوارکناری پشتیبانی کند (اجازه ی استفاده از ابزارک در ساید بار را دهد)، در آن صورت می توانید کد ویجت Text را همراه با کد banner ضمیمه ی سایت کنید ۲٫ و یا کد را مستقیما در فایل sidebar.php پوسته ی سایت جایگذاری کنید.
چنانچه تم مورد از ابزارک پشتیبانی می کند در آن صورت بایستی المان Appearance را از ستون Dashboard انتخاب کرده و سپس گزینه ی Widgets را کلیک نمایید. حال ویجت Text را با مکان نمای موس گرفته و در ناحیه ی مناسب (“Main Sidebar”) جای گذاری کنید. در اینجا، ابزارک Text را در زیر فیلد جستجو قرار می دهیم. سرانجام کد banner را داخل آن جای گذاری نموده، در صورت تمایل یک عنوان برای ابزارک انتخاب نمایید و دکمه ی Save را فشار دهید.
خواهید دید که banner انتخابی شما را در نوارکناری سایت نمایش داده می شود.
اگر پوسته ی انتخابی از ابزارک پشتیبانی نمی کند، در آن صورت بایستی کد banner را مستقیما در فایل sidebar.php اضافه کنید. این فایل را می توانید از طریق بخش Editor صفحه ی مدیریت سایت WordPress مدیریت نمایید. برای دسترسی به بخش مذکور می بایست: Appearance ->Editor.
نحوه ی افزودن banner در یک پست یا صفحه ی مشخص
اگر می خواهید یک banner را داخل بدنه ی پست یا صفحه قرار دهید، در آن صورت کافی است ویرایشگر (editor) WordPress را در حالت mode Text باز کرده، سپس کد banner را در آن جایگذاری نمایید.
خواهید دید که banner بین دو پاراگراف نمونه پست جاری الصاق می شود. می توانید برای تغییر مکان یا ترازبندی banner برای همخوانی کامل با باقی صفحه یا پست، از ویرایشگر WYSIWYG استفاده نمایید.
نحوه ی افزودن banner در بالا یا پایین تمامی پست ها/صفحات
به منظور افزودن banner در بالا یا پایین پست ها/صفحات، بایستی کد banner را داخل فایل های single.php یا page.php پوسته های ورد پرس (WordPress themes) جای گذاری نمایید. هر دو فایل دارای محتوای مشابه هستند، اما بخش های مختلف سایت را اداره می کنند –فایل single.php پست های شما را مدیریت می کند ولی اداره ی صفحات سایت مربوط به فایل page.php می باشد. می توانید این فایل ها را با ورود به ناحیه ی کاربری مدیریت WordPress و پیمایش به Appearance ->Editor ویرایش نمایید.
اگر می خواهید banner در بالای پست ها و صفحات شما درج گردد، کد زیر را پیدا کنید:
<?php while ( have_posts() ) : the_post(); ?>
بلافاصله بعد از کد ذکر شده، کد banner را وارد نمایید. خواهید دید که banner در بالای عنوان صفحه و پست های شما قرار می گیرد. برای اینکه تصویر banner مطابق با نیاز شما نمایش داده شود، می توانید استایل CSS به آن اعمال نمایید.
افزودن banner به ناحیه ی header یا footer صفحه
افزودن banner به ناحیه ی footer و header، به پوسته ی مورد استفاده در سایت بستگی دارد. اگر تم مورد نظر ناحیه ای مختص ابزارک داشته باشد (widget area)، می توانید دستورالعمل های ذکر شده در این آموزش را برای افزودن banner به نوارکناری دنبال نمایید.
حال اگر تم جاری در ناحیه ی header و footer خود بخشی برای الصاق ابزارک ندارد (widget area به ناحیه ی هدر و فوتر آن اضافه نشده) یا به آن اضافه نشده است، در آن صورت بایستی banner های خود را به صورت دستی اضافه کنید. به منظور افزودن banner به صورت دستی، لازم است به ناحیه ی کاربری مدریت سایت لاگین کرده و سپس Appearance ->Editor. در این درس یک banner سفارشی به ناحیه ی header صفحه ی خود اضافه می کنیم. از آنجایی که banner را به ناحیه ی header سایت خود اضافه می کنیم، بایستی فایل header.php را از لیست فایل های موجود برای ویرایش انتخاب کنیم. توجه داشته باشید که کد موجود در این فایل با توجه به تم متفاوت خواهد بود. برای افزودن این banner بایستی آشنایی محدودی با زبان نشانه گذاری HTML داشته باشید.
ابتدا بایستی تگ باز body را پیدا کنید. در تم پیش فرض ورد پرس (twenty-twelve)، کد این تگ به شکل زیر خواهد بود:
<body <?php body_class(); ?>>
بلافاصله پس از آن، کد زیر وارد کنید:
<div class=”headerbanner”><a href=”BANNERLINK” target=”_blank”><img src=”LINKTOIMAGE” width=”200″ height=”50″ /></a></div>
بایستی پارامترهای BANNERLINK و LINKTOIMAGE را با URL ای که می خواهید banner به آن اشاره کرده (ارجاع داده) و لینک به تصویر banner مورد نظر، جایگزین نمایید. در پایان، می بایست مقادیر خصیصه های width و height را با طول و عرض واقعی عکس banner مورد نظر جایگزین نمایید.
این کد banner شما را در بالای صفحه ی سایت نمایش (render) می دهد. لازم به ذکر است که بسته به تم مورد استفاده، باید برای قرار دادن banner در مکان دلخواه، کد را در جای مناسب کپی کنید.
همان طور که مشاهده می کنید، banner را در المان div جای گذاری کردیم. این کار را به این خاطر انجام دادیم تا به banner خود استایل بیشتر اعمال نماییم. برای اعمال استایل css به banner خود، style.css را از ستون سمت راست انتخاب کرده و زمانی که صفحه بروز آوری (refresh) می شود، کد زیر را اضافه نمایید:
.headerbanner { display:block;margin: 10px auto;width: 480px}
این کد banner را در وسط صفحه قرار داده، مقداری top margin (حاشیه از بالا) اضافه می کند و نهایتا ظاهر بهتری به آن می دهد.
افزودن banner به ناحیه ی footer، به استثنای یک تفاوت کوچک، فرق چندانی با اضافه کردن آن به header ندارد. بایستی بجای header.php ، فایل footer.php را باز کنید. سپس، کد را در آنجایی که می خواهید banner نمایش داده شود، جای گذاری کنید.
نمایش banner با استفاده از پلاگین و افزونه های wordpress
اگر لازم است همزمان چندین banner را در یک صفحه نمایش دهید، تبلیغاتی که به نمایش می گذارید را ردیابی کنید، قابلیت های پیچیده تری به آن اضافه کنید، توصیه می شود یکی از افزونه های موجود wordpress ویژه ی مدیریت banner را نصب کرده و مورد استفاده قرار دهید.
برای انتخاب افزونه ی مناسب، باید ساختار و نیازهای سایت را در نظر داشته باشید. توصیه می شود داخل افزونه های موجود در پوشه ی اصلی یا مسیر WordPress Plugins جستجو کرده و افزونه ای (extension) که نیازهای شما را برآورده می سازد، پیدا و دانلود نمایید. پس از دانلود پلاگین مناسب، می توانید آن را مانند دیگر افزونه های WordPress نصب کنید.