تغییر تصاویر قالب وبلاگ
تغییر تصاویر قالب وبلاگ اگر از آن دسته از دوستانی هستید که با تغییر نحوه نگاشت فایلهای CSS مان برای تغییر در تصاویر قالب تان دچار مشکل شده اید و یا قصد تغییر تصاویر قالب تان دارید و میخواهید از تصاویر دلخواه خودتان در قالب های ما استفاده کنید ولی بلد نیستید چگونه این کار را انجام دهید شما را به خواندن این آموزش دعوت میکنم.
اوایل با وجود سختی های فراوان برای من سعی میکردم بخش CSS رو بصورت درون صفحه ای طراحی کنم تا دوستان بتوانند هر تغییری را که دوست داشته باشند روی قالب خود براحتی انحام بدهند ، این کار تنها حسنش همین است که کاربر براحتی میتواند تصاویر و مشخصات بخش های قالب را به سلیقه خودش تغییر بدهد و نهایتا مشکلی به نام عدم لود نشدن فایل CSS نخواهیم داشت . با انتقال قالب ها به هاست اختصاصی و مشکلاتی که برای انتقال و آدرس دهی فایل ها بوجود آمد برخلاف میل باطنی مان مجبور شدیم از CSS خارجی استفاده کنیم . همانطور که دوستان هم احتمالا مطلع هستند استفاده ازCSS خارجی مزایای فراوانی را برای طراح دارد که از مهم ترین مزیت های آن میتوان به موارد زیر اشاره نمود : انتقال راحتر فایل ها و آدرس دهی به مراتب راحت تر ، آپدیت کردن CSS بدون نیاز به نصب دوباره قالب ، استفاده در چندین قالب یا صفحه مشابه و ... . با تغییر این سیاست با درخواست دوستانی مواجه شدیم که خواستار برگشتن به حالت قبل و آزاد گذاشتن کاربران برای تغییر تصاویر قالب بودند ، خدمت آن دسته از دوستانی که خواستار تغییر در CSS و احیانا در تصاویر قالبشان هستند می رسانم به دلیل ماهیت سلسله مراتبی و ارث بری در CSS این کار بازهم شدنی است ولی یک خورده سخت تر شده . برای تغییر هدر(تصویر بالای وبلاگ) که معمول تر از سایر موارد است سعی کردیم در قالب هایی که مشخصا تصویری در بالای قالب وجود دارد این امکان را فراهم آوریم (برای مثال سیاه) برای این کار ابتدا تصویری را که قصد دارید جایگزین تصویر فعلی قالبتان کنید را تهیه کنید سعی کنید هم اندازه با تصویر اصلی باشد این تصویر را آپلود کنید پیشنهاد من برای آپلود سرویس Picofile خود بلاگ اسکای است و مسیر را کپی کنید. در کد قالب تان در بخش <head> و در درون تگ <style>آدرس تصویری را مقابل مشخصه background مشاهده میکنید که باید آن را پاک کرده و آدرس تصویری را که آپلود کرده اید را جایگزین کنید برای مثال :
<style type="text/css">
#Banner {
background: url('http://themestudio.ir/ThemesFiles/Free/black/images/top.png') no-repeat;
}
</style>
<style type="text/css">
#Banner {
background: url('http://s1.picofile.com/turorial/rss.png') no-repeat;
}
</style>
<style type="text/css">
Body{
background-image:url(‘آدرس تصویر’)
}
<style>
<div style=” background-image:url('آدرس تصویر')" ></div>
درصورتی که میخواهید مسیر عکسی را تغییر دهید میتوانید از مشخصه src مربوط به همان عکس استفاده کنید:<img src=”مسیر تصویر خود را وارد کنید” />
ضمنا برای افزودن فایل CSS خارجی به قالبتان میتواند از روش های زیر استفاده کنید:<link rel=”stylesheet” src=”آدرس فایل سی اس اس خارجی” type=”text/css” />
و یا:<style type="text/css">
@import url(‘آدرس فایل سی اس اس خارجی’) ;
<style>
<style type="text/css">
.warper{
font-family:Tahoma;
color:#5922A2;
}
<style>
<div class=”sidebar”> => .sidebar {CSS codes}
<div id=”sidebar”> => #sidebar{CSS codes}
