قالب وبلاگ

ابزار وبلاگ

تم کده

تعداد بازدید : 224 بازدید

قالب با چند استایل مختلف

چنانچه شما یک طراح وب می باشید احتما لا به ایـن فکر افتاده اید که برای قالبی که طراحی می بکنید چند استایل متفاوت داشته باشید تا کاربر بتواند با دقت به سلیقه خود طرح و رنگ دلخواهش را برای قالب انتخاب نماید .
یا ایـن که یک استایل آسان برای کسانی که از ایـن ترنت کم سرعت استفاده می کنند و یک استایل زیبا و سنگین تر برای کسانی که از ایـن ترنت پر سرعت بهره می برند ارائه دهید تا سبب جلب رضایت همه کاربرانتان شود.
کدهای پیش رو ایـن خواسته به جا و منطقی شما طراح وب عزیز را به آسانی فراهم می نماید و شما را در ارائه پیشرفته تر هنرتان یاری می دهد.
دقت کنید که در ایـن شیوه امکان داشتن قالب با کدهای html متفاوت نیست و تنها کدهای css قابل جایگذینی می باشند .
ابتدا کدهای css قالب هایی را که طراحی کـرده اید را در فایل های متفاوت با نام های متفاوت ذخیره بکنید . دقت کنید که قالب پیش فرضتان را با نام default.css ذخیره بکنید .
حالا فایل هایی که آماده کـرده اید را آپلود بکنید و آدرس آن فایل ها را در کدهای زیر که در بین تگ های head قالب قرار می گیریند قرار دهید.

<link rel=”stylesheet” type=”text/css” href=”css/default.css” />
<link rel=”alternate stylesheet” type=”text/css” href=”css/blue.css” title=”blue” />
<script type=”text/javascript” src=”http://1code.ir/webdesign/stylechanger/js/styleswitcher.js”></script>

به جز قالب پیش فرض تان که نامش default هست در کدهای بالا در پارت title نامی مناسب برگزینید.
حالا کافیست که دکمه های انتخاب قالب را در پارت body قالبتان در اختیار کاربر قرار دهید برای مثال کدهای زیر به صورت لینک ایـن کار را می کنند.

<a href="#"
onclick="setActiveStyleSheet('default');
return false;">change style to default</a>
<a href="#"
onclick="setActiveStyleSheet('blue');
return false;">change style to blue</a>

حتما دقت کـرده اید که نامی که برای هر استایل در پارت title در وهله قبل انتخاب کـرده ایم را در کدهای بالا در داخل پرانتز setActiveStyleSheet قرار می دهیم.

دموی قالب با دو استایل مختلف







قالب های تصادفی
قالب وبلاگ خبری
تعداد بازدید : 895 بازدید
 
قالب وبلاگ عمومی
تعداد بازدید : 2,234 بازدید
 
قالب وبلاگ مشکی
تعداد بازدید : 1,217 بازدید
 
قالب وبلاگ سه ستونه
تعداد بازدید : 1,459 بازدید
 
قالب وبلاگ دانلود
تعداد بازدید : 2,406 بازدید
 
قالب وبلاگ خبری
تعداد بازدید : 971 بازدید
 
ابزار پیغام ورود و خروج از سایت
تعداد بازدید : 0 بازدید
 
دانلود قالب وبلاگ سه ستونه الگوی جهانی
تعداد بازدید : 0 بازدید
 
نظرات

شما هم نظری ارسال کنید

ارسال نظر