هر روز وب‌هایی رو میدیدم که چند رنگه کردن و به نظرم کار جالبی اومد.منم تصمیم به این‌کار گرفتم و یادم اومد که قبلن یه تم ترجمه کردم که این قابلیت‌ رو داشت و حالا هم برای شما خلاصه‌ش کردم.

باید اول یه فایل جی‌اسکریپت به تم‌تون اضافه کنید. {دانلود} بعد از دانلود باید آدرس رو تو هیدر قرار بدید،مثل مثال:
<?php wp_head(); ?>
<script type="text/javascript" src="آدرس فایل جی‌اسکریپت آپلود شده"></script>
</head>

استایل مورد نظرتون رو بنویسین.مثلن من برای رنگ قهوه‌ای از این استفاده کردم:
div.side-sec h3 {font-size: 1em;color:#fff;text-transform: uppercase;background-color:#663300;height:15px;}
a:link {text-decoration: none;color:#996633;}
a:visited {text-decoration: none;color:#996633;}

که استایل‌هایی که توی این ذکر میکنین جایگزین استایل اصلی‌شون تو پوسته استایل می‌شه.

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

یک)

کدهای زیر رو به استایل اضافه کنید:
#style-switcher {padding-right:5px 0;}
#style-switcher a {width:10px;height:10px;display:block;float:right;margin:0 3px;border:1px solid #fff;}
a#turquoise-color {background-color:#99CCFF;}
a#red-color {background-color:#CF6333;}
a#gold-color {background-color:#BF9B3B;}
a#green-color {background-color:#639F27;}
a#brown-color {background-color:#663300;}
a#black-color {background-color:orange;}

دو)

حالا باید یه چیز دیگه‌ای رو هم به هیدر اضافه کنید.مثلن برای استایل green.css میزنیم:

<link rel="alternate stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>/green.css" media="screen" title="green" />

سه)

و در آخر این رو هم مثلن بذارین توی سایدبار:
<div id="style-switcher">
<a id="green-color" class="styleswitch" title="سبز" onclick="setActiveStyleSheet('green'); return false;" href="#"></a>
</div>همین،وبلاگ‌تون چند رنگه شد.البته هنوز دو رنگه‌س،خودتون میتونید هر چند رنگ که بخواین بهش اضافه کنید :)

۳ نظر