PDA

توجه ! این یک نسخه آرشیو شده میباشد و در این حالت شما عکسی را مشاهده نمیکنید برای مشاهده کامل متن و عکسها بر روی لینک مقابل کلیک کنید : آموزش ویرایش قالب



tmehdis
2011-03-02, 03:43
خوب از اول قالب ادمین شروع می کنیم
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
این کد کاربردی ندارد و تنها معرف ویرایشگر قالب است

خوب ادامه کد ها (من سعی دارم چیزهای مفید را بگم پس اضافه نمی گم)
<HTML><HEAD><TITLE><-ShopTitle-></TITLE>
این قسمت قرمز رنگ یک تایتل یا همون عنوان هست خوب ببینید یک تایتل باز شده و بسته (رنگ بنفش)
درون این تایتل یا همان عنوان کد شاپ تایتل قرار گرفته است این کد با توجه به صفحه ای که در آن هستید موضوع صفحه را اتوماتیک تغییر می دهد اگر شما می خواهید عنوان صفحه (نوشته موجود در نوار ابی جستجوگر) سایت شما تغییر کند به چیز خاصی می توانید این کد را به متن مورد نظر تبدیل کنید
نمونه کد :
<HTML><HEAD><TITLE>www.akhale.shoploger.com</TITLE>

خوب می بینید که نوار آبی در بالای مرورگر به نام نوشته شده تغییر یافت

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
خوب این کد برای این است که زبان فارسی در صفحه شما پشتیبانی شود موجود نبودن این کد باعث می شود نوشته ها و متن ها نا خوانا شوند

<STYLE>@import url(template/temp1/css/style.css );
</STYLE>

این کد صفحه را به یک فایل متنی مرتبط می کند در این فایل متنی خیلی موارد گنجانده شده است
مانند هدر سایت یا همان تصویر بالای صفحه و رنگ متن های سایت رنگ متن عنوان سایت سایز نوشته ها و ............... حذف این کد قالب را به کلی به هم می ریزد

خوب اگه در مورد کد بالا بیشتر اطلاعات خواستید بگید

<BODY>
<TABLE dir=rtl cellSpacing=0 cellPadding=0 width=900 align=center border=0>
<TBODY>

این هم یه کد مهم دیگه این کد سایز صفحه و مکان قرار گیری صفحه را مشخص می کند
عدد 900 عرض سایت شما می باشد و کلمه center برای این است که تمامی اطلاعات در وسط قرار بگیرند خوب حالا امتحان کنید
عدد 900 را به 1024 تغییر بدهید و سایت خود را مشاهده کنید می بینید که سایت تمام صفحه شما را اشغال کرد
خوب حالا نوبت تغییر مکان می رسه کلمه center را به left تغییر دهید خواهید دید که صفحه به چپ منتقل گردید با تغییر کلمه به right صفحه به راست منتقل می شود


خوب اگر باز هم آموزش می خواهید نظر بدهید

tmehdis
2011-03-05, 01:08
خوب آقا مثل اینکه پست قبل مفید نبوده که کسی نظر نداده و تشکر هم نکرده باشه اولا از اقا رضا به خاطر تشکری که کرد ممنون خوب من یه اموزش کاملتر آماده کرده آم که می زارم چند نکته:
1.اگر نظرات و تشکر ها 15 تا بشند من آموزش فایل سی اس اس قالب رو هم قرار می دم
و همینطور ادامه آموزش قالب رو هم قرار می دم
2.من قالبی با نام قلعه ساخته بودم و دوستان بسیار استقبال کرده بودند من قول می دهم به زودی قالبی زیبا و جدید و بهینه برای شما عزیزان آماده می کنم
3.آموزشی که برای شما می خواهم قرار بدهم 4 بخش دارد :
بخش اول آموزش قالب اصلی قسمت 1
بخش دوم آموزش قالب سی اس اس که در اول قالب اصلی فایل اون قرار داره
بخش سوم آموزش قالب اصلی قسمت 2
بخش چهارم آموزش قالب اصلی قسمت 3



در آخر هم فایلها به صورت کامل در همین تاپیک برای دانلود قرار داده می شود





خوب این بخش اول:



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<!--کد بالا نشان دهنده ورژني است قالب با آن طراحي شده -->
<html><!--نشانه شروع طراحي صفحه است بايد تمامي کد هاي مورد نظر در داخل اين تگ قرار بگيرد-->
<head><!--تمامي اطلاعات صفحه در اينجا قالب ريزي ميشود مانند عنوان صفحه و تگهاي راهنماي جستجوگر-->
<title><!--عنوان صفحه در اين تگ قرار مي گيرد -->
<-shoptitle-><!--اين تگ عنوان صفحه را مشخص مي کند ما با اين کد از شاپلاگر مي خواهيم اتوماتيک با توجه به صفحه موجود عنوان را قرار دهد-->
</title><!--تگ عنوان صفحه را که باز کرده بوديم مي بنديم به خاطر اينکه عنوان را مشخص کرديم حتما بايد تگ هاي باز بسته شوند -->
<meta name="keywords" content="<-ShopKeywords->">
<!--خوب اين تگ براي موتور جستجو ها قرار داده شده ما بوسيله کلمه شاپ کيورد کلمات کليدي را در قسمت کانتنت قرار مي دهيم تا جستجوگر به عنوان کلمات کليدي از آن استفاده کند-->
<!--نکته هايي را در هنگام قرار دادن کلمات کليدي در نظر داشته باشيد کلمات را مکرر تکرار نکنيد چون موتور جستجو شما را به عنوان اسپمر از ليست جستجو حذف مي کنه-->
<!--بايد کلمات کليدي که وارد مي کنيد در صفحه موجود باشد در غير اين صورت هم اسپمر محسوب مي شويد و از ليست جستجو حذف مي شويد ولي من توي اين قالب اين مشکل را حل کرده ام بوسيله قرار دادن کلمات کليدي در خود صفحه-->
<meta name="description" content="<-ShopDescription->"><!--اين هم توضيحات محصولات براي موتور هاي جستجوگر-->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"><!--اين هم کدي براي اينکه فونت شما اتوماتيک روي فارسي تنظيم شود و متن هاي شما به هم نريزد-->
<STYLE><!--اين تگ را براي تعريف قالب کلي قالب مثل فونت ها زمينه هدر و غيره استفاده مي کنيم-->
@import url(http://www.uploadfa.net/1389-2/ck873wvf23m8nk9qcwu.css );
<!--خوب مي بينيد که از يک آدرس استفاده کرديم اين به خاطر دو چيز است 1 سرعت لود صفحه بالا برود 2 مرورگرهاي جديد استيل دروني راقبول ندارند-->
<!--خوب حالا بايد چيزهايي که در فايل بالا قرار دارد را ياد بگيريد و الا از اينجا به بعد سر در نمي آوريد خوب به آدرس بالا بريد در همونجا آموزش هاي لازم داده شده-->
</STYLE><!--خوب حالا که فايل بالا را خونديد و ياد گرفتيد نوبت به ادامه طراحي ميرسه در اينجا استيل صفحه را که باز کرده بوديم مي بنديم چون ما تمام استيل صفه را بوسيله فايل بالا تعريف کرديم-->
</head><!--خوب هد را مي بنديم چون اطلاعات کلي صفحه تمام شد-->
<body><!--خوب اين هم تک بادي هر چيزي در اين تگ قرار بگيرد در صفحه نمايش داده مي شود و اگر خارج از اين تگ باشد ديده نمي شود مگر يک تگ که براي فرم هاست و کاري باهاش نداريم البته فعلا-->
<!--خوب نوبت مي رسه به قالب اصلي و کلي صفحه-->
<table dir=rtl cellspacing=0 cellpadding=0 width=900 align=center border=0>
<!--خوب حالا تمام قسمتهاي بالا را براتون توضيح مي دم خوب از اول خط نگاه کنيد ما اول يک تيبل يا همون جدول باز مي کنيم-->
<!--خوب بعد دي اي ار رو ار تي ال گذاشتيم يعني در اين جدول متن قرار است از چپ به راست نوشته شود-->
<!--بعد سل اسپکينگ را برابر 0 و سل اسپادينگ رو هم برابر 0 قرار داديم خوب اينها مشخص مي کند که فاصله بين سلول ها در جدول 0 باشد و فضاي بين نوشته در سلول و خود سلول 0 باشد-->
<!--خوب بعد عرض جدول را 900 قرار داده ايم-->
<!--بعد مکان جدول را بوسيله سنتر وسط قرار داديم-->
<!--بعد مشخص کرديم که سايز بردار در دور جدول 0 باشد يعني دور جدول ما بردار نباشد-->
<!--نکته در اینجا اینه که تمام صفحه ما قرار توی این جدول قرار بگیره-->
<!--نکته دیگه اینکه وقتی آدرس یک سایت وارد می شه باید اچ تی تی پی در اول اون قرار بیره-->
<tbody><!--محتویات و بدنه اصلی جدول در این تگ قرار می گیرند-->
<tr><!-- این تگ لازمه ای در تگ بالایی می باشد یعنی هر گاه بخواهیم از تگ تی بادی استفاده کنیم باید بعد از آن از تی ار استفاده کنیم کاربرد این تگ ایجاد یک سطر در جدول می باشد-->
<!--خوب ما یک سطر ایجاد کردیم ولی برای چی خوب این سطر را می خواهید برای هدر قرار دهید-->
<td class=header colspan=3>
<!--از این تگ برای ایجاد یگ خانه جدول درون سطر یا همان تی ار استفاده می شود-->
<!--خوب حالا می مونه خصوصیاتی که در تگ از اونا استفاده شده-->
<!--اولین خصوصیت کلاس هست می دونید کلاس چیه ما در فایل سی اس اس که در بالا بود کلاسهای مختلفی را معرفی کردیم اگه یادتون باشه اونجا بجای کلاس از نقطه استفاده می کردیم-->
<!--خوب الان موقع استفاده از کلاسهای تعریف شده در فایل سی اس اس بالا می رسه خوب در اینجا کلاس را برابر هدر قرار داده ایم یعنی همون ویژگی هایی که در-->
<!--فایل بالا برای هدر تعیین کردیم اینجا اجرا بشند-->
<!--خوب خصوصیت بعدی که به کار برده شده کول اسپن می باشد این شناسه مشخص کننده ی اندازه ی افقی یک سلول بر اساس تعداد سلول می باشد-->
<!--چون ما بیشترین تعداد سلولی که در این جدول در یک سطر می خواهیم قرار دهیم 3 است پس مقدار کول اسپن هدر برابر 3 باید باشد تا تمام سایز افقی جدول را هدر ما در بر بگیرد-->
<center><h1 style="color:#fff;font-size:15px;"><-ShopTitle-></h1></center></td></tr>
<!--خوب در اینجا ما می خواهیم عنوان فروشگاه را در وسط هدر قرار دهیم-->
<!--اول از همه تگ سنتر را اضافه گردیم یه نشان دهنده این است که متن در وسط قرار داده شود-->
<!--بعد از آن یک عنوان بزرگ را تعریف کردیم اچ 1 به معنای عنوان بزرگ می باشد ما 6 عنوان داریم عنوان 1 بزرگترین آنها می باشد-->
<!--بعد استیل متن را مشخص می کنیم مثل رنگ مربع اف اف اف برابر مشکی می باشد بعد سایز فونت را تعیین می کنیم و بعد هم عنوان فروشگاه را قرار می دهیم-->
<!--تگ شاپ تایتل بر روی شاپلاگر تعریف شده و اتوماتیک عنوان شما را در اینجا وارد می کند شما می توانید عنوان را به طور دستی وارد کنید-->
<!--بعد هم پاراگراف را می بندیم چون دیگر کارمان با پاراگراف تموم شد و همین طور سنتر و تی دی و تی ار-->

fbmfbm
2011-10-20, 01:50
اقا خیلی باحالی دستت درد نکنه