از آنجایی که در این مدت دوستان زیادی درخواست آموزش تغیر تصاویر قالب های سایت یا وبلاگ را مثل تصویر هدر قالب (عکس بالای قالب) داشتند ، نحوه تغیر تصاویر را خواهیم گفت.
قبل از تغیر تصاویر باید توجه کنید که اندازه تصویر جدیدی که می خواهید در قالب خود قرار دهید باید از نظر طول و عرض تقریبا با تصویر قبلی یکسان باشد تا زیبایی قالب پس از جایگزین کردن تصاویر از دست نرود. برای تغیر تصاویر کافی است در کدنویسی تنها آدرس جدید تصویر را در قالب اعمال کرد ، پس اول تصویر جدید را در یک فضا (مثل سایت های آپلود عکس) آپلود کنید بعد آدرس جدید تصویر را جایگزین آدرس قبلی کنید.


تصاویر در قالب های وبلاگ به چندین شکل مختلف در کد قالب قرار دارند که رایج ترین روش ها را بررسی می کنیم :

۱- تصاویر قالب در بین دو تگ <style> در کد اصلی قالب قرار گرفته است.
در تگ <style> که تنظیمات قالب (اعم از تنظیمات جدول بندی، رنگ متن ها و …) وجود دارد برای تغیر تصاویر قالب مثل تصویر هدر ، منو ها و دیگر تصاویر قالب کافی است آدرس و در صورت نیاز سایز عکس را ویرایش کرد.

<style>
.top{background:url(http://topskin.ir/34/top.jpg) no-repeat top; width:900; height:200; float:right;}
</style>

2- تصاویر قالب بصورت کد عکسی در قالب قرار گرفته است.

<img border="0" src="http://topskin.ir/36/header.jpg" width="186" height="30">

3- تصاویر قالب خارج از کد قالب اصلی و در یک فایل جانبی به نام فایل CSS در قالب درج شده است .

در این روش که رایج ترین و حرفه ای ترین نوع کد نویسی قالب ها می باشد ، برای تغیر تنظیمات و تصاویر قالب دو روش ساده وجود دارد.
روش اول : باید ابتدا فایل CSS قالب را از آدرس مربوطه که در کد قالب وجود دارد دریافت کرده

<link href="http://topskin.ir/36/style.css" type="text/css" rel="stylesheet">

آنرا با برنامه هایی مثل NOTEPAD باز کرد و آدرس تصاویر جدید قالب یا تنظیمات دیگر که روی فایل CSS پیاده می شود را اعمال کرد و سپس فایل CSS جدید را روی یک فضا آپلود کرد. بعد از انجام این کار کافیست آدرس جدید فایل CSS که تغیرات جدید در آن قرار دارد را در کد قالب قرار داد.

روش دوم : چنانچه تغیر فایل CSS قالب و آپلود آن برای شما دشوار است ، پس از دریافت فایل CSS قالب آنرا باز کنید، شناسه مربوط به جدولی که تصویر مورد نظر در آن قرار گرفته را در فایل CSS پیدا کنید.عنوان شناسه ها در فایل CSS در ابتدای هر سطر با نقطه یا # مشخص شده اند. پس از یافتن شناسه ، آنرا در کد قالب پیدا کنید:

<div class=header>
<div id=header>

سپس کد زیر را مطابق مثال در جای خود اضافه کنید.

<div class=header style="background:url(http://yourskin.ir/34/mypic.jpg)">

غیر از مراحل گفته شده در بالا ، مراحل دیگری هم وجود دارد اما رایج نیستند.


برای نمونه و تفهیم بیشتر، جهت تغیر تصویر هدر قالب شماره ۳۶ سایت (برای اکثر قالب های بلاگ اسکین شناسه یا اصطلاحا کلاس top برای قسمت هدر قالب می باشد) کافی است عبارت زیر را در کد قالب پیدا کرده

<div class=top>

و کد قرمز رنگ را به کد مربوطه اضافه کنید و آدرس تصویر خود را جایگزین آدرس موجود نمایید.

<div class=top style="background:url(http://yourskin.ir/34new/mypic.jpg)">

نظرات دوستان درمورد بخش پشتیبانی قالب ها و یا سوالات متفرقه پس از پاسخ به آدرس ایمیل شما ، از سایت حذف خواهند شد و ارتباط شما با سایت تنها از طریق آدرس ایمیل امکان پذیر است !

۳۱۸ نظر به تغییر تصاویر در قالب های بلاگ اسکین

  1. پرستو گفت:

    جالب بود اما یه کم بیشتر توضیح بدید

  2. سیدعیسی خان گفت:

    سلام. دستتون درد نکنه. کارتون عاله. خسته نباشید.

  3. صابر جوکار گفت:

    مرسی از سایتتون

  4. گردان سایبری نیروی مقاومت بسیج حوزه 13 شهید محمدی استان قم گفت:

    اول با سلام به مدیریت محترم سایت و با تبریک به سال نو برای شما عرض خسته نباشید خدمت شما داریم امیدواریم در این صحنه های مجازی سربلند و سرافراز باشید و دشمنان اسلام را به راه راست هدایت کنید ممنون هستیم

  5. الهه گفت:

    خیلی عالیه از همگی تون ممنون عزیزان

  6. محمود طالبی گفت:

    واقعا دسستون درد نکنه کارتون حرف نداره

  7. نعیمه گفت:

    من که نفهمیدم چی شد! ایکاش یه کم بیشتر توضیح میدادید

  8. میثم گفت:

    سلام اونو درست کردم خیلی ممنون

  9. معین گفت:

    مرسی هدر برای وبلاگم گذاشتم!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! خیلی مرسی مرسی خیلی

    gta-iv.blogsky.com

  10. فرشادامامی گفت:

    خیلی زیبابودمرسی

  11. محسن گفت:

    آقا هرچی بگم بازم کمه ! دستت درد نکنه ! ایول ! خوشم اومد ازت !!
    اینی که گفتی شدیدا به دردم خورد !

  12. توفان گفت:

    زیباترین قالبهارو من تو این سایت دیدم ممنونم از زحماتتون

  13. pedram گفت:

    be khoda harchi begam kam goftam kareton doroste man pishe yeki ro sefid kardin

  14. محمود گفت:

    واقعا دست تمام دستندرکاران گل سایت بلوگ هلپ و هم چنین بلوگ اسکین درد نکنه خیلی قالب های زیبا و مطالب کمیاب و پر محتوایی دارید اگه میشه مطالب آموزشی در مورد CSS و هم چنین کد نویسی Xhtml هم قراردهید
    مرسسسسسسسسسسسسسسسسسسسسسسسسسسسسسسسسی!!!!!!!!!!!!!!!!!!!!!!!!!!

    مدیر سایت manmigam.fa3t.com

  15. محمد حسین گفت:

    از زحمات شما خیلی خیلی ممنونم. من هر روز دارم چیز های زیادی از سایت شما یاد می گیرم.ممنون

  16. soraya گفت:

    سلام بابت همه چی ممنون؛ همه کامل و بی نقصه
    دمتون گرم

  17. mostafa گفت:

    سلام از توضیحات واضحتون متشکرم

  18. ali.h.k گفت:

    قاب هاتون واقعا عالین تشکر

  19. amir rm گفت:

    واقعا ممنون
    خیلی حیلی باحالید

  20. mobina گفت:

    salam mikhastam begam ke dar bare ye in kalame hayi ke be in gilisi neveshtin bishtar tozih bedin baraye mahayi ki taze vared hastim va chizi az in kalame ha nemifahmim

  21. Imun گفت:

    اولا” سلام.
    ثانیا” خیلی سایتتون باحاله و خیلی به درد بخوره!
    ثالثا” ممنون از همتون .

  22. A.K گفت:

    سلام

    مرسی عالی بود

  23. مرسی عالی بود گفت:

    مرسی عالی بود

  24. baran گفت:

    ممنون از توضیحاتتون میشه برا مایی که زیاد وارد نیستیم بیشتر توضیح بدین

  25. علی گفت:

    خیییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییلی خوووووووووووووووووووووووووووبه
    واقعا متشکرم ازتمام دست اندرکاران سایت

  26. میکا .م گفت:

    مرسی واقعا عالی وکامل . کاش همه از یاد دادن به دیگران نترسند وتجربیات و مهارتهاشونو بهم آموزش بدن

  27. علی امینی گفت:

    گل کاشتی

» ارسال نظرات

تمام حقوق این سایت و مطالب منتشر شده در آن برای مرجع راهنمای وبلاگ نویسان محفوظ است.