سلام
اگر سری آموزش های طراحی قالب وردپرس را از اول دنبال نکرده اید به آدرس زیر بروید.
یک مرور کوچیک میکنیم ببینیم تا حالا چی یاد گرفتیم
اول فهمیدیم وردپرس اصلا چی هست و چه میکند!
بعد مواد لازم رو تهیه کردیم و شروع کردیم به نصب وردپرس روی کامپیوتر شخصی برای تست سریع برنامه و قالب ها!
در درس شماره ۱ فهمیدیم تگ ها و قانون مهم اونها چیه و همچنین قالب وردپس از چی تشکیل شده!
درس شماره ۲ که خیلی هم ساده بود یک نمای کلی از یک قالب معمولی وردپرس به ما نشون داد.
در درس شماره ۳ یک قالب جدید با نام amoozesh ساختیم و فایل های index.php و style.css رو ساختیم.
درد درس شماره ۴ تونستیم نام وبلاگ رو در بالای صفحه بارگذاری کنیم. یعنی شروع ساخت header
درس ۴ باز هم ادامه پیدا کرد و توضیحات سایت هم در زیر اسمش اومد تا ساخت header به پایان برسه.
در درس ۵ یک کار مهم رو شروع کردیم و یک حلقه ساختیم که لیست مطالب رو فراخوانی میکرد.
و حالا میخواهیم درس مهم شماره ۵ رو ادامه بدیم:
مثل همیشه برنامه ها و فولدر های مورد نیازمون رو باز میکنیم.
در درس قبل به اینجا رسیدیم که وبلاگمون دارای اسم، توضیحات و لیست مطالب هست.
خوب میدونیم که مطالب ما الان دیده نمیشن!
خوب برای اینکار باید در زیرعنوان نوشته در فایل index که در جلسه قبل با این کد:
<h2><a href=” <?PHP the_permalink() ?>”> <?PHP the_title() ?> </a></h2>
نوشتیم کد زیر رو اضافه کنیم:
<?PHP the_content();?>
به همین راحتی content یا محتوای پست رو فراخوانی میکنیم، کار رو ذخیره کرده و میریم سایتمون رو ببینیم!
به این ترتیب متن نوشته ها هم در صفحه ظاهر میشه و صفحه ما شامل: عنوان سایت،توضیحات سایت،عنوان پست ها به همراه متن اونهاست!
ما در حال حاضر یک سایت نیمه کامل و البته بسیار بد شکل و قیافه داریم که اصلا ترس نداره!
بعدا با استایل کردن میتونیم بسیار زیبا و شکیلش کنیم.(با کمک فایل style.css )
میبینیم که یک خط کوتاه کد php که نوشتیم چه میکنههههه!!!
احتمالا میدونین که اگه خودتون میخواستین با html این مطالبی که نوشتین رو بعد از وقت گذاشتن بسیار زیاد بنویسین احتمالا از نوشتن پشیمون میشدین!
خوب بریم سر تمیز کاری!
یادتون میاد که در درس header کل کدهای مربوط به قسمت بالایی صفحه رو بین تگی نامرئی(div) با شناسه ی header گذاشتیم و در پایین اون یک تگ نامرئی دیگه ساختیم با نام content که کل محتوای صفحه رو در بر میگیره! حالا ما درمحدوده ی content قرار داریم و میخواهیم که محتوای عنوان نوشته ها و محتوای اونها رو از بقیه قسمت های صفحه متمایز کنیم و نامهایی مناسب براشون انتخاب کنیم.
برای اینکار پیشنهاد من این است که یک نام مناسب برای عنوان هر پست و همچنین یک نام برای متن پستها انتخاب کنیم!
برای اینکار ابتدا یک تگ div برای عنوان پست به این صورت:
<div class=”posttitle”>
<h2><a href=” <?PHP the_permalink() ?>”> <?PHP the_title() ?> </a></h2>
</div>
و یک تگ هم برای محتوا به این صورت:
<div class=”entry”>
<?PHP the_content();?>
</div>
میسازیم، میدونیم که این دو تگ(یعنی posttitle و entry ) با هم تشکیل گروه بزرگتری رو میدن که همان پستهای ماست پس هر دوی تگ ها رو با نام post به هم مربوط میکنیم:
<div class=”post”>
<?PHP if(have_posts()): while(have_posts()):the_post();?>
<div class=”posttitle”>
<h2><a href=” <?PHP the_permalink() ?>”> <?PHP the_title() ?> </a></h2>
</div><div class=”entry”>
<?PHP the_content();?>
</div>
</div>
احتمالا این سوال پیش اومده که چرا به جای id یه تگ ها class دادم!!؟
اصلا فرقشون چیه؟
جواب اینه که فرق زیادی ندارن فقط موضوع مورد توجه اینه که class در صفحه n بار تکرار میشه اما id یگانه است!
در واقع مثل اسم عام و اسم خاص میمونه! ما فقط یک برج ایفل داریم اما n تا برج داریم!! اوکی شد؟!
اوکی…
دیگه چیز خاصی برای این درس نمیمونه جز اینکه بگم حتمن حتمن حتمن گوگل کروم رو دانلود کنید!
کاری ندارم که مرورگر خوبی هست یا نه اما برای درک اینکه ما داریم چیکار میکنیم بسیار زیاد کمکمون میکنه!
هرچند یک افزونه برای فایرفاکسی ها هم بود(اسمش رو یادم نیست اما یک bug داشت و عکسش هم یه سوسک بود:d ) که کاری که من میخوام توضیح بدم رو انجام میداد اما من کروم رو برای اینکار پیشنهاد میکنم!
با این کروم عزیز بعدها خیلی کار داریم چون میدونم خیلی ها مثل من سرعت بالایی دارن!! گفتم زودتر بگم که شروع به دانلود کنید!!
در ضمن اگه ایرادی داشتم گوشزد کنید لطفن! مرسی…
فعلا بابای بای بای بابای بای
این درس یکم منو گیج کرد فکر می کنم یه جای کار ایراد داره؟؟؟؟؟؟؟؟؟؟؟؟؟؟؟؟؟؟
قبلا ما یه تگ برای مطالب داشتیم
پس چرا دوباره برای مطالب یه تگ دیگه گذاشتیم
اینش برام جای سوال داره؟؟؟؟؟؟؟؟؟؟؟؟؟؟؟
منظورم از تگ همون تگ های divهستش که بقول شما نامرئی ان و بعدا تو استایل ازشون استفاده می کنیم
بعد از فراخوانی توابع
the_permalink
و
the_title
سمی کالن درج نشده.
در جایی از متن آمده :
ما در حال حاظر یک سایت نیمه کامل و…
«حاضر» صحیحه، چون املای خودم ضعیفه، روی املا حساسیت دارم! 🙂
خب توابع اینا هستن ولی وقتی میخوایم استفاده کنیم باید از قواعدش پیروی کنیم
در زبان PHP پس از دستورات تک خطی، نیاز به درج ; نمی باشد… اما اگر دستور دیگه ای بخواهیم بدیم باید ; را درج کنیم.
سلام من این قسمت رو که گفتید با دقت تایپ کردم اما نمیشه همش خطا میده و روی تصویر هیچ چیزی نشون نمیده جان من یه کمکی بفرمایید
سریع تر اگه میشه ممنون سیاوش انگار این نوشته شما یه مشکلی داره یه نگاهی بهش بندازید
<a href=” ”>
لطف کنید کد رو داخل تگ pre یا code قرار بدین که نمایش داده بشه
سلام ممنون که جواب دادی مشکل من کادر اخری هست این جا زده بودم اما انگار نیومده ممنون بازم لطفا دوباره جواب بدید منطزرم
خب پس کد رو برای من بفرستین به ایمیلم از طریق صفحه تماس با ما هم میتونین بفرستینش
ببخشید کلا میشه کل کدهایی که تا الان نوشتیم رو بذارید تا ببینیم چیزی رو اشتباه نکردیم
ممنون.
تو آموزش چند بار توضیح داده میشه من الان کدها رو ندارم چون واسه حدود سه ساله پیشه آموزشها 🙂
اسمش فایرباگ بود firebug هه
سلام
،ممنوون بابت توضیحات روان و خوبت ، الکی مطلب رو نمیپیچونی و این عالیه