عرض سلام خدمت همراهان عزیز مکانیک وردپرس ؛
بسیاری از توسعه دهندگان وبسایت ها برای ساخت جستجو پیشرفته در وردپرس، از افزونه های مربوطه در مخزن وردپرس استفاده میکنند.
اما برخی دیگر از توسعه دهندگان معتقدند که تا جایی که امکان دارد باید از کدنویسی بجای استفاده از پلاگین ها استفاده کرد، چرا که افزونه ها فشار زیادی به سرور وارد کرده و امکان نفوذ به سایت را افزایش میدهند.
در این مقاله به آموزش ساخت جستجو پیشرفته در وردپرس با استفاده از کد خواهیم پرداخت.
در واقع در این روش، ایجاد فیلتر هایی برای فرم جستجو در وردپرس اموزش داده خواهد شد.
گام اول: اضافه کردن فرم جستجو جدید به وردپرس
برای شروع ساخت جستجو پیشرفته در وردپرس با استفاده از کد، ابتدا قطعه کد زیر را در فایل Functions.php قالب وردپرس خود قرار دهید.
//--- custom Search Form ------------------------------------- function custom_search_form($custom_search){ $default=array( 'cat_show'=>false, 'tag_show'=>false, 'author_show'=>false, 'archive_show'=>false, 'field_show'=>true, 'label_show'=>false, 'button_show'=>true, 'rememberd'=>true, 'echo'=>false );//default array foreach((array)$custom_search as $key=>$value){ $default[$key]=$value; }
گام دوم: اضافه کردم متغیرها
دومرتبه قطعه کد زیر را در فایل functions.php پوسته وردپرس خود اضافه کنید.
//--base vars------------------------ global $WP_Query,$query,$wp_user; $cat_option='';$tag_option='';$author_option='';$archive_option=''; $advance_option='';$close_option='';$field_option='';$button_option=''; $cat_selected=get_query_var('cat'); $tag_selected=get_query_var('tag'); $author_selected=get_query_var('author'); $day_selected=get_query_var('day'); $month_selected=get_query_var('monthnum'); $year_selected=get_query_var('year'); if($day_selected==0)$day_selected=''; if($month_selected==0)$month_selected=''; if($year_selected==0)$year_selected='';
گام سوم: معرفی فیلترها
در این بخش نیز تمامی کد ها در فایل functions.php قالب وردپرس شما قرار میگیرد.
جایگذاری اولین فیلتر: دسته بندی
//--------category-------------------- if($default['cat_show']==1): $categories = get_categories(); $cat_option='<li><ul>'; if($default['label_show']): $cat_option .='<li class="cat-label">'.__('دسته بندی','zistfa').'</li>'; endif; $cat_option .='<li class="search-cat"><select name="cat" id="searchcat" > <option value="">'.__('همه','zistfa').'</option>'; foreach ($categories as $category) { $cat_option .= '<option value="'.$category->cat_ID.'"'; if(($cat_selected == $category->cat_ID)&&($default['rememberd']==1)): $cat_option .=' selected'; endif; $cat_option .= '>'.$category->cat_name; $cat_option .= '</option>'; } $cat_option .= '</select></li></ul></li>'; endif;
فیلتر دوم: برچسب
//--------tag-------------------- if($default['tag_show']==1): $tags = get_categories('taxonomy=post_tag'); $tag_option='<li><ul>'; if($default['label_show']): $tag_option .='<li class="tag-label">'.__('برچسب','zistfa').'</li>'; endif; $tag_option .='<li class="search-tag" ><select name="tag" id="searchtag" > <option value="">'.__('همه','zistfa').'</option>'; foreach ($tags as $tag) { $tag_option .= '<option value="'.$tag->slug.'"'; if(($tag_selected == $tag->slug)&&($default['rememberd']==1)): $tag_option .=' selected'; endif; $tag_option .= '>'.$tag->cat_name; $tag_option .= '</option>'; } $tag_option .= '</select></li></ul></li>'; endif;
فیلتر سوم: نویسنده
//--------author-------------------- if($default['author_show']==1): $authors=get_users(array('who'=>'authors','fields'=>array('id','display_name'))); $author_option='<li><ul>'; if($default['label_show']): $author_option .='<li class="author-label">'.__('نویسنده ','zistfa').'</li>'; endif; $author_option .='<li class="search-author" > <select name="tag" id="searchauthor" ><option value="">'.__('همه','zistfa').'</option>'; foreach ($authors as $author) { $author_option .= '<option value="'.$author->id.'"'; if(($author_selected == $author->id)&&($default['rememberd']==1)): $author_option .=' selected'; endif; $author_option .= '>'.$author->display_name; $author_option .= '</option>'; } $author_option .= '</select></li></ul></li>'; endif;
فیلتر چهارم: تاریخ
//--------Date-------------------- if($default['archive_show']==1): $archive_option='<li><ul>'; if($default['label_show']): $archive_option .='<li class="archive-label">'.__('تاریخ','zistfa').'</li>'; endif; $archive_option .='<li class="archive-field"> <input type="text" value="' . $year_selected . '" name="year" id="year" size="3" placeholder="'.__('سال','zistfa').'" /> <input type="text" value="' . $month_selected . '" name="monthnum" id="monthnum" size="2" placeholder="'.__('ماه','zistfa').'" /> <input type="text" value="' . $day_selected. '" name="day" id="day" size="1" placeholder="'.__('روز','zistfa').'" /> </li></ul></li>'; endif;
ساخت فیلد جستجو
//--------search field-------------------- if($default['field_show']==1): $field_option='<li><ul>'; if($default['label_show']): $field_option .='<li class="search-label">'.__('جستجو برای : ','zistfa').'</li>'; endif; $field_option .='<li class="search-field"> <input type="text" value="' . get_search_query() . '" name="s" placeholder="'.__('کلمه مورد نظر + اینتر','zistfa').'" /> </li> </ul> </li>'; endif;
ساخت دکمه جستجو
//--------search button-------------------- if($default['button_show']==1): $button_option='<li> <input type="submit" class="search-submit" value="'. esc_attr__( 'جستجو','zistfa' ) .'" /> </li>'; endif;
گام چهارم : ثبت جستجوگر جدیدمان در وردپرس
$form = '<form role="search" method="get" class="searchform" action="' . home_url( '/' ) . '" ><ul> '.$cat_option.$tag_option.$author_option.$archive_option.$field_option.$button_option.' </ul></form>'; if($default['echo']==1): echo $form; else: return $form; endif; } add_filter( 'get_search_form', 'custom_search_form',10,1 );
تا اینجای کار، تمامی کدها در فایل functions.php قالب وردپرس شما قرار میگرفت.
گام پنجم : نمایش فرم جستجوگر
اکنون میتوانید فرم خود را با قرار دادن قطعه کد زیر در هر محلی از سایت خود که تمایل دارید، ایجاد کنید.
<!--custom-search-form--> <div class="search-form"> <?php custom_search_form(array( 'echo'=>1, 'archive_show'=>1, 'cat_show'=>1, 'tag_show'=>1, 'author_show'=>1, 'label_show'=>1, ));?> </div><!--/custom-search-form-->
گام آخر: استایل دهی به فرم مورد نظر
در این مرحله برای نمایش مناسب و زیبای فرم ایجاد شده میتوانید از قطعه کد زیر در فایل CSS قالب وردپرس خود استفاده کنید.
البته ناگفته نماند میتوانید Style مورد علاقه خود را به فرم ایجاد شده بدهید.
.cat-label, .tag-label, .author-label, .archive-label, .search-label {font-size : normal;padding : 3px;text-align : center;} .author-label,.search-author select{color:rgb(53, 122, 232);border-color:rgb(53, 122, 232)} .tag-label,.search-tag select{color:rgb(142, 68, 173);border-color:rgb(142, 68, 173)} .cat-label,.search-cat select{color:rgb(216, 66, 55);border-color:rgb(216, 66, 55)} .archive-label,.archive-field input{color:rgb(0, 167, 83);border-color:rgb(0, 167, 83)} form.searchform ul li {display: inline-block;} form.searchform ul li ul li{display: list-item;} .search-form select,.search-form input { border: solid 1px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; margin:3px;text-align:center }
امیدوارم این مقاله برای شما مکانیک وردپرسی های عزیز، مفید واقع شود.
کلیه حقوق محصولات و محتوای این سایت متعلق به مکانیک وردپرس میباشد و هر گونه کپی برداری از محتوا پیگرد قانونی دارد . توسعه و پشتیبانی کمک وردپرس
سلام ممنون از سایت خوب شما ببخشید یک سوال داشتم قطعه کد های بالا رو به ترتیبی که ذکر کردید پشت سر هم کپی کنیم تو function.php اوکی میشه؟
سلام دوستان ، مدیر سایت یه مشکلی داشتم در وردپرس که مربوط به پستی که گذاشتین هم میشه ، من یه فرم جستجو شبیه همین دیجی کالا یا یه چیزی ساده تر می خواستم قرار بدم صفحه اول رو اسلایدر شبیه کافه تدریس اگه نگاه کنید ، می خواستم بزارم و این که این اسلایدره افزونش اسلایدر رولوشن هستش حالا مشکل اول این که من از چه کدی باید استفاده کنم و اینکه چطور رو اسلایدر قرارش بدم ممنون میشم کمک کنید .
محشره دنبال کد میگشتم اما همش افزونه بود این سایتتون عالیه
با سلاماگر بخواهیم دسته بندی خاصی رو نشون بدیم ینی بجای دریافت همه دسته بندی ها فقط دوتا از دسته هارو نشون بدیم چی؟
باید نسبت به این موضوع برنامه نویسی بشه .
Visitor Rating: 5 Stars
بخش اخر کدها مشکل دارن.
بد نوشتید
ممنون از یاد آوری اصلاح شد
Visitor Rating: 5 Stars
سلام وقتی کد رو میزنم دیه سایت بالا نمیاد
سلام محمد عزیز
بله قسمتی از کد مشکل داشت که مجدد بروز رسانی شد
میتوانید مجدد از این بخش استفاده کامل ببرید
با عرض پوزش
سلام.اموزش از اساس مشکل داره.هر کد رو قرار میدیم فقط قالب بهم میریزه
سلام خدمت شما
دوست عزیز این اموزش تست شده و کد ها معتبر میباشند
در صورت بروز مشکل مجدد گزارش بدید تا بررسی لازم صورت بگیره
موفق باشید
جناب جوشنی عزیز
با توجه به بررسی مجدد کد ها, بخش کوچیکی از کد مشکل داشت که حل شد و مجدد میتوانید از این اموزش استفاده کنید .
پوزش بابت بی توجهی