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

لیست آموزشهای قالب وردپرس

امروز یک فرم جستجو میسازیم و یک تقویم در سایدبار قرار میدیم تا در درس بعد بتونیم کار سایدبار رو تموم کنیم.

برای اینکه یک فرم جسنتجو داشته باشیم باید اطلاعاتی از html و تگهای مختلفش و همچنین آشنایی لازم از کدهای وردپرس رو داشته باشیم.

اما چون اینجا هدفمون بیشتر آموزش طراحی وردپرس هست و کارهایی که باید بعدن بازهم انجام بشه،(که البته ساخت فرم جستجو جزو این دسته نیست!) برای همین نیازی به توضیح زیادی نیست.

(البته میتونین کد رو بررسی کنین و اگه سوالی بود در خدمتم!)

فرم جستجویی که در اختیارتون قرار میدم رو دانلود کرده و بعد با باز کردن و انتخاب save as  اون رو با نام searchform.php در فولدر اصلی تم amoozesh ذخیره کنید.

searchform.txt

معمولن در سایتها و وبلاگ ها فرم جستجو در قسمت بالایی قرار داره ، البته دل بخواه است و میتونین هرجا خواستین میتونین کد زیر رو بنویسین:

<li  id=”search”>

<?php include     (TEMPLATEPATH . ‘ /searchform.php  ‘)  ;   ?>

</li>

من در زیر تگ <ul> که در زیر <div > سایدبارقرار داره این کد رو نوشتم.

توضیح اینکه include یک تابع php است که کارش از اسمش معلومه، include یعنی شامل شدن و در برداشتن یعنی اینجا این تابع فایل داخل پرانتز روبروی خودش رو کپی میکنه و میاره جایی که نوشتیم، یعنی ما میتونستیم همه ی محتویات رو همینجا کپی کنیم و include نکنیم اما اینکار ابلهانه است به نظرم!

TEMPLATEPATH هم path یا همون “مسیر” template یا همون “قالب” رو مینویسه، یعنی آدرس فولدر theme مارو پیدا میکنه و فقط میمونه که به فایل searchform.php بریم.

در واقع الان ما فایلی در آدرس زیر رو include کردیم:

http://localhost/wordpress/wp-content/themes/amoozesh/searchform.php

که مثلن اگه من تم سایت خودم (tenet.ir) رو amoozesh قرار بدم آأرس اتوماتیک به آأرس زیر تغییر میکنه:

http://tenet.ir/wp-content/themes/amoozesh/searchform.php

اکی؟

حالا میمونه اون دات یا dot یا . که بعد از TEMPLATEPATH نوشتیم، اون نقطه کارش اینه که آدرس هارو به هم میچسبونه، این نکته هم بد نیست بدونین که .  در موارد بسیاری در php شبیه این کار رو انجام میده.

کار رو ذخیره میکنیم و میریم به صفحه ی اصلی سایتمون ببینیم چیکار کردیم،

برای تغییر اندازه فرم میتونیم در فایل searchform.php سایز (size) رو تغییر بدیم و برای جایگزین کردن کلمه ای به جای find قسمت value رو تغییر بدیم.

اکی؟

پس تا حالا داریم:

توضیح خاصی هم فکر نمیکنم دیگه لازم باشه id هم دادیم چون منحصر به فرده واسمش هم search قرار دادیم که فکر نمیکنم اسم دیگه ای بهتر از این باشه!

حالا اگه بخواهیم یک تقویم (که من علاقه ای بهش ندارم!) در زیر فرم جستجو قرار بدیم میریم زیر<li/> مربوط به فرم search کد زیر رو مینویسیم.

<li  id=” calendar ” >   <h2>    <?php   _e (’Calendar’)  ; ?  >   </ h2 >

<? php    get_calendar() ;  ? >

< / li >

با تابع e_ یک calender نوشتیم و بین تگ h2 گذاشتیم تا مثل بقیه عناوین بشه و بعد هم با تابع get_calender تقویم رو فراخوانی کردیم!

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

برای امروز بس میباشد!

در درس بعدی کاری میکنیم که سایدبارمون widgetize بشه و با ابزاک ها سازگار!

این یکی از مهمترین کارهاست و از همه ی کارها هم ساده تر!

مواظبت باشید!

بای بای بای

پستهای مرتبط

• آموزش طراحی سایت
• آموزش طراحی قالب وردپرس #۱
• آموزش طراحی قالب وردپرس-الف (مواد لازم)
• آموزش طراحی قالب وردپرس #۳
• آموزش طراحی قالب وردپرس #۲