برای کاربران
تست منو وسط بالا 2
عنوان | پاسخ | بازدید | توسط |
![]() |
5 | 1154 | batterieslet |
![]() |
5 | 1381 | lavillmom |
![]() |
7 | 1206 | georgemum |
![]() |
24 | 2881 | lavillmom |
![]() |
7 | 1421 | georgemum |
![]() |
7 | 951 | georgemum |
![]() |
1 | 1065 | sun2rise |
![]() |
7 | 2440 | sun2rise |
این نظر توسط حمید مهربان در تاریخ 1348/10/11 و 8:26 دقیقه ارسال شده است | |||
با افزایش وبلاگها و سایتها و پیشرفت تکنولوژی داشتن یک سایت یا وبلاگ زیبا و کاربردی برای تمامی افراد الزامیست . امروزه تعداد قالبهای طراحی شده آماده زیاد است و این امر ضروریست که قالب را برای خود اختصاصی کنید ، در این پست آموزش تغییر هدر انواع قالب و اختصاصی کردن قالب را در اختیار شما قرار می دهیم . [...] متاسفانه به دلیل تنوع در طراحی ها این امر کمی پیچیده می شود که اگر کمی با CSS و HTML آشنایی داشته باشید بسیار به شما کمک می کند اما سعی می کنیم این آموزش را به صورت آسان و صریح برای شما قرار دهیم . امروزه هدر سایتها اکثرا از عکسهایی استفاده می شود که این عکسها به دو صورت در کد HTML قالب فراخوانی می شوند : ۱- به صورت کد نمایشی عکس HTML در تگ همان table : در این روش عکس هدر را توسط کدی شبیه به کد زیر در قالب و در قسمتهایه اول قالب فراخوانی می کنند ( در TABLE هدر ) در این کد width=”1005″ به معنی این است که طول این عکس ۱۰۰۵ پیکسل است و height=”344″ به این معنی است که عرض آن ۳۴۴ پیکسل است . * دقت کنید که حتما عکسی را که می خواهید جایگزین هدر فعلی قالب بکنید ، حتما در همان اندازه هدر اصلی قالب باشد وگرنه ممکن است قالب به هم ریخته شود در این نوع فقط کافیست عکس خود را با ساز هدر قالب طراحی کنید و در فضایی آپلود کنید و لینک آن را جایگزین لینک فعلی هدر بکنید . 2- فراخوانی از طریق فایل CSS ( جانبی / داخلی ) : اکثرا در قالبها از این روش استفاده می شود ، به دلیل اینکه سرعت بیشتری نسبت به روش قبل دارد و امروزه می توان گفت بیش از ۹۵% طراحی ها از این طریق انجام میشود . در این روش کار یکم سخت تر می شود ، برای شروع شما باید ابتدا فایل CSS را که در قالب فراخوانی شده است پیدا کنید . برای اینکار بین دو تگ و به دنبال کدی شبیه کد زیر بگردید : جای style.css لینک فایل CSS قرار دارد . دقت کنید که فقط از این طریق می توان فایل CSS را در قالب فراخوانی کرد و همیشه پسوند آن css. می باشد . ممکن است که در قالب بیش از یک فایل CSS باشد که در این صورت ابتدا به دنبال فایلی بنام style بگردید و اگر پیدا نکردید بقیه فایلهای CSS را باز کنید و دنبال تگ هدر بگردید . بعد از پیدا کردن فایل CSS ، لینک آنرا در مرورگر خود باز کنید . یک صفحه کد برای شما نمایش داده می شود ، آنرا SAVE کنید و در کامپیوتر خود با ویرایشگر مناسبی باز کنید ( مثلا notepad ) ، حال یکسری کد دارید که به توضیح آنها می پردازیم . در اینجا نیز با توجه به طرحهای مختلف ممکن است مختلف باشد اما در کل شما برای تغییر هدر کافیست به دنبال کدی شبیه زیر بگردید : .header { background: url(‘images/header.jpg’) transparent no-repeat scroll center top; height: 344px; width: 1005px; position: relative; font-size: 18px; } در بیشتر قالبها به اسم header ، header Image ، …. می باشد . شما از اسم آن می توانید آنرا در بیشتر قالبها شناسایی کنید . ممکن است کدهای درون آن نیز کمی بیشتر یا کمتر باشد یا تفاوتی دیگر داشته باشد اما در کل یک لینک عکس دارد با آندازه طولی و عرضی آن . حال مانند قبل عمل می کنیم و عکسی را که طراحی کردیم با سایز هدر اصلی قالب را آپلود می کنیم و در کد بالا در قسمت images/header.jpg قرار می دهیم و SAVE می کنیم . حال باید فایل CSS خود را آپلود کنیم و جایگزین فایل زیر درون قالب خود کنیم : فایل جدید را جایگزین style.css می کنیم و قالب خود را save می کنیم . هدر جدید ما آماده است و می توانیم از آن استفاده کنیم . نکاتی که باید دقت شود : ۱- حتما سایز عکسی که طراحی می کنیم با سایز هدر اصلی قالب مطابقت داشته باشد وگرنه ممکن است قالب به هم ریخته شود . ۲- ممکن است در فایل CSS ب جای header. از مقادیری دیگری استفاده شود . ( اما در کل اسمی از header نیز در آن به کار می رود ، البته بستگی به طراح دارد ) ۳- ممکن است فایل CSS بخش header. دارای تعداد بشتری دستور باشد که شما فقط لیمک عکس را تغییر می دهید و به دیگر کدها دست نمی زنید . ۴- در اکثر قالبهای امروزی به خصوص قالبهای ارایه شده رایگان از روش دوم (فراخوانی از طریق فایل CSS ) استفاد می شود . ۵- برای آپلود نیز می توانید از سایتهای فضای رایگان استفاده کنید . ۶- به قسمتهای مختلف آموزش دقت کنید و مو به مو انجام دهید تا موفق باشید . این آموزشم به پایان رسید امیدوارم مفید واقع بشه . کیوان ا |