آموزش تغییر هدر قالب کد فیلم آموزشی

***********************

خیلی از دوستان دوست دارند که هدر قالب ها را عوض کنند ولی متاسفانه روش آنرا بلد نیستند.به همین دلیل شک تصمیم گرفت که آموزش تغییر هدر قالب را برای شما عزیزان قرار دهد.

توجه:برای دیدن ویدیو ی این آموزش,پس از مطالعه ی کامل این مطلب بر روی این نوشته کلیک نمایید.

 

در ابتدا به چند نکته توجه نمایید:

1-این آموزش بر مبنای قالب “مدرسه ی شادی ” نوشته شده است ولی شما می توانید با استفاده از تعلیمات این آموزش تقریبا تمامی قالب ها را ویرایش نمایید.

2- هر کجا که از شما خواستیم که عبارتی را جستوجو نمایید ( تقریبا در تمامی برنامه ها) کافی است که کلید کنترل (Ctrl) را با کلید F کلید همزمان فشار دهید.(به عبارت ساده تر Crtl+F را بزنید).

3- برای تمرین می توانید قالب “مدرسه ی شادی” و هدر آن را دانلود نمایید.

4-به این دلیل که این آموزش حاوی تصاویر زیادی است ممکن است (به سرعت اینترنت شما بستگی دارد) بارگزاری صفحه کمی طول بکشد.پس شکیبا باشید.

خوب حالا به سراغ آموزش خودمان می رویم.

پیداکردن و انتقال فایل های استایل به رایانه

ابتدا باید مسیر(آدرس اینترنتی) فایل استایل قالب را از میان دیگر کدهای قالب بیابیم.برای این کار:

1-کد های قالب را باز نمایید.

2- مانند تصویر عبارت روبه رو را جست وجو نمایید. text/css

3-مانند تصویر بالا آدرس اینترنتی موجود در همان خط را کپی نمایید.

4-مانند تصویر بالا آدرس را در نوار آدرس مرورگر کپی کرده و آن را فراخوانی کنید(همان Enter را فشار دهید).سپس تمامی نوشته های ظاهر شده را کپی نمایید.

5- حال نرم افزار notepad را بازکنید.برای این کار در ویندوز7 کافی است مانند تصویر نام آن را در منوی شروع (start menu) تایپ نمایید.

6- حال کدهایی که کپی کرده بودیم را در نوت پدی که تازه باز کردیم پیست می کنیم.

بارگزاری هدر

برای اینکه هدرمان را بتوانیم به قالب انتقال دهیم ابتدا باید آن را در فضای مجازی آپلود نماییم.ولی قبل از آن باید از فایل psd یک خروجی بگیریم برای این کار:

1-فایل ویرایش شده را باز کنید.سپس Crtl+Shift+s را بزنید.

2-مانند تصویر بالا فایل را با فرمت jpeg در محل مورد نظرتان save کنید.

3- حالا تصویر را در محل مورد علاقه ی خود آپلود نمایید.(برای راهنمایی بیشتر در مورد آپلود سنتر ها به مطلب “کدام آپلود سنتر” مراجعه نمایید.)

4- حالا فایل نوت پدی که کد هارا در آن پیست کرده بودیم را بالا بیاورید.با جستوجوی عبارت header می توانید عبارت روبه رو را بیابید(مانند تصویر بالا): images/header

5-به جای عبارت فوق آدرس کامل تصویر هدر خود (همراه http) را وارد نمایید.مثلا: http://www.example.com/yourimage.jpg

مرحله ی نهایی

خوب در پایان برای اینکه باز هم قالب شما به خوبی کار کند باید مراحل زیر را طی نمایید:

1- در فایل نوت پد با فشردن کلید های ترکیبی Crtl+H پنجره ی جایگذاری را فراخوانی نمایید.

2-مانند تصویر بالا در اولین فیلد عبارت images را وارد نمایید ودر فیلد دوم عبارت زیر را:

http://theme.shek.ir/HappySchool/images

سپس دکمه ی Replace All را فشار دهید.

3-حالا باید فایل را سیو کنیم.برای این کار کلید های ترکیبی Crtl+s را فشار دهید.

4- حالا مکان ذخیره سازی را انتخاب نمایید.

5-مانند تصویر بالا در فیلد File name عبارت style.css را جایگزین کنید و Encoding را به UTF-8 تغییر دهید .سپس save را بزنید.

6-حالا فایل style.css را آپلود نمایید. البته باید به این نکته توجه داشته باشید که باید این فایل را در جایی آپلود کنید که فایل را برای دانلود قرار ندهد.به عبارت ساده تر باید بتوان فایل راپس از آپلود کردن مانند فایل استایل اولیه ی خود قالب تنها با وارد کردن آدرس در آدرس بار مشاهده کرد.

به همین دلیل ما به شما توصیه می کنیم فایل را در آپلود سنترهایی مانند رزآپ آپلود نمایید.

7-حالاآدرس فایل style.css جدید را جایگزین آدرس ایتدایی (که در مرحله ی دوم قسمت پیدا کردن استایل آن را یافته بودیم) کنید.

خوب قالب شما آماده است.

چند نکته ی ضروری

برای ویرایش قالب های دیگر نکات زیر را در نظر بگیرید:

1-ممکن است هدر برخی قالب ها با نام header سیو نشده باشد.برای یافتن نام آنها کافی است مانند تصویر بالا برروی هدر قالب کلیک راست کنید و گزینه ی viwe background image را انتخاب کنید.البته باز هم این نکته را در نظر بگیرید که نام تصویر نوشته های بین آخرین / و آخرین نقطه (.) است.

2-در مرحله جایگزین کردن آدرس ها (همون جایی که Crtl+h را می زدیم) برای پر کردن فیلد دوم باید به چند نکته توجه کنید:

حوه ی آدرس دهی به تصاویر در استایل:

به تعداد طراحان روی زمین روش آدرس دهی وجود دارد.البته رایج طرین راه همان راهی است که ما از آن استفاده می کنیم, یعنی, ارجا به پوشه ی تصاویر بدون دخالت دست!!!

ولی برای اینکه بدانید باید در فیلد اول ودوم چه چیزی نوشت :

ابتدا دقت کنید که به تصویر هدر چگونه آدرس داده شده است.یعنی تمام چیز هایی که پشت / قبل از نام هدر است را در فیلد اول وارد نمایید.(در کدهای موجود در استایل)

حالا اگر آدرس کامل سایت میزبان پوسته در فیلد اول نیست,آدرس کامل سایت میزبان را به پشت محتویات فیلد اول اضافه کنید وهمه را در فیلد دوم قرار دهید.

برای پیدا کردن آدرس کامل سایت میزبان هم کافی است هرچه که پشت آدرس فایل استایل اصلی قالب هست(یعنی هرچیزی که قبل از style.css/) را کپی کنید.

نکته ی بعدی اینکه ممکنه نام فایل استایل, Style نباشد یا قالب چند استایل داشته باشد.

برای مشکل اول هرچیزی که ما با نام style.css به شما گفتیم شما با نام جدید(مثلا example.css) در نظر بگیرید.

در مورد مشکل دوم هم تمام استایل ها ی موجود را از نظر وجود آدرس هدر بررسی کنید,هر کدام که آدرس هدر را داشت فایل مورد نظر ما است.

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

 

 

منبع:

shek.ir

http://jadoykalamat.ir

 

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

http://2link202.r98.ir