تغییر رنگ تصادفی پس زمینه سایت وردپرس

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

تغییر رنگ تصادفی پس زمینه سایت وردپرس

مثل همیشه برای ایجاد یک چنین تغییری روی قالب وردپرس، باید اسناد قالب را دستکاری کنیم. پس سند functions.php قالب فعال روی سایت‌مان را باز می‌کنیم و کدهای زیر را در انتهای سند وارد می‌کنیم.

function wpt_bg() { 
$rand = array('0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'a', 'b', 'c', 'd', 'e', 'f');
$color ='#'.$rand[rand(0,15)].$rand[rand(0,15)].$rand[rand(0,15)].
$rand[rand(0,15)].$rand[rand(0,15)].$rand[rand(0,15)];
echo $color;
}

کد بالا یک تابع بسیار ساده است که ابتدا یک آرایه با عنوان rand تعریف کرده است که مقادیری از ۰ تا ۹ و a تا f را در خود جای داده است. ما از این نویسه‌ها و اعداد برای تولید یک کد هگزادسیمال رنگ تصادفی استفاده خواهیم کرد.

یک آموزش جذاب دیگه!  چگونه قالب وردپرس را نصب کنیم ؟

سپس یک متغیر با نام color تعریف شده که درون آن از تابع پی‌اچ‌پی rand به همراه یک نویسهٔ # در ابتدای آن استفاده شده که یک کد رنگ به صورت xxxxxx# تولید شود.در نهایت متغیر color به صورت چاپ شده خروجی داده می‌شود.

حال به سراغ سند header.php قالب می‌رویم و آن را باز می‌کنیم. در بخشی ک برچسب body تعریف شده، آن را به صورت زیر تغییر می‌دهیم:

	
<body <?php body_class(); ?> style="background-color:<?php wpt_bg();?>">>

توجه: گاهی اوقات با اعمال استایل مورد نظر به برچسب body تغییری را روی سایت نمی‌توانید مشاهده کنید. دلیل آن هم وجود یک رنگ دیگر روی یک باکس روی body یا بدنهٔ اصلی سایت است. بنابراین باید آن باکس یا عنصر را پیدا کنید و کد style بالا را روی آن اعمال نمایید. برخی از قالب‌های وردپرس هم برای خودشان از قسمت پیشخوان، تنظیمات قالب یا سفارشی سازی، گزینه‌ای برای انتخاب رنگ پس زمینهٔ صفحات دارند که باز هم در این صورت ممکن است کد سفارشی ما در اینجا کار نکند.

در اینجا ما از تابع wpt_bg()، همان تابعی که در مرحلهٔ اول ایجاد کردیم استفاده می‌کنیم و خروجی آن به صورت یک کد هگزادسیمال رنگ که با # شروع می‌شود، روبروی استایل background-color قرار می‌گیرد. حالا می‌توانید تغییرات داده شده را ذخیره کنید و یک بازدید از سایت به عمل آورید تا نتیجهٔ کار را ببینید. اگر نتیجه آن طوری که خواستید نشد، مراحل قبلی را بررسی کنید. ممکن است درجایی حتی یک اشتباه تایپی باعث بروز مشکل شده باشد.

یک آموزش جذاب دیگه!  طراحی پوسته وردپرس با Beaver Themer به روش گرفتن و کشیدن

ارسال دیدگاه

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

آموزش جامع وردپرس

آموزش نصب وردپرس روی لوکال هاست

آموزش افزونه Yoast SEO

درباره ®WPTutorial

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