جستجو در وردپرس بدون افزونه

جستجو در وردپرس بدون افزونه
آکادمی آی تی
آکادمی آی تی
dots

جستجو در وردپرس بدون افزونه

زمان مورد نیاز برای مطالعه 5 دقیقه

جستجو در وردپرس بدون افزونه، اضافه کردن فرم جستجوی جدید به وردپرس، معرفی فیلتر ها به وردپرس و...

دپارتمان ‌ها: آموزش طراحی سایت
1398/08/02
4,247 بازدید

جستجو در وردپرس بدون افزونه

 

گام اول : اضافه کردن فرم جستجوی جدید به وردپرس

این کد را به Funactions.php قالب اضافه کنید. اگر همچین فایلی ندارید در پوشه قالب یکی با همین نام و پسوند php بسازید


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 قالب اضافه کنید.


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

 

1.دسته بندی

if($default[‘cat_show’]==1): $categories = get_categories(); $cat_option=‘

’; if($default[‘label_show’]): $cat_option .=‘

’.__(‘دسته بندی’,‘zistfa’).‘

’; endif; $cat_option .=‘


’; endif;

 

2. برچسب

’; if($default[‘label_show’]): $tag_option .=‘ ’.__(‘برچسب’,‘zistfa’).‘ ’; endif; $tag_option .=‘ ’; endif;

 

3. نویسنده

if($default[‘author_show’]==1): $authors=get_users(array(‘who’=>‘authors’,‘fields’=>array(‘id’,‘display_name’))); $author_option=‘

 

’; if($default[‘label_show’]): $author_option .=‘

’.__(‘نویسنده ‘,‘zistfa’).‘

’; endif; $author_option .=‘
if($default[‘archive_show’]==1): $archive_option=‘

ساخت فیلد جستجو:

if($default[‘field_show’]==1): $field_option=‘

’; if($default[‘label_show’]): $field_option .=‘

’.__(‘جستجو برای : ‘,‘zistfa’).‘

’; endif; $field_option .=‘
’; endif;

 

ساخت دکمه جستجو :

if($default[‘button_show’]==1): $button_option=‘

 

ثبت جستجوگر جدیدمان در وردپرس

‘.$cat_option.$tag_option.$author_option.$archive_option.$field_option.$button_option.‘

’; if($default[‘echo’]==1): echo $form; else: return $form; endif; } add_filter( ‘get_search_form’, ‘custom_search_form’,10,1 );

 

بعد از درج کدهای بالا رو به function  قالبتون اضافه کردید با استفاده از کد می توانید فرم را در هر جایی که می خواهید به نمایش در بیاورید

 
1, ‘archive_show’=>1, ‘cat_show’=>1, ‘tag_show’=>1, ‘author_show’=>1, ‘label_show’=>1, ));?>

 

نکته:  در کد بالا از خط ۵ تا ۸ برای نمایش فیلتر ها است که اگر ۰ باشد نمایش داده نمی شود و خط ۹ هم مربوط به توضیحات هر فیلد است.( اگر به demo دقت کنید می بینید که بالای هر فیلد یک توضیح کوتاه در مورد آن داده شده ).

گام آخر : استایل دادن به فرم

در این مرحله چون فرم ما ظاهر خوبی نداره ما باید یه استایل براش در نظر بگیریم که برای این کار کد های زیر رو به فایل style.css اضافه کنید تا ظاهر بهتری رو پیدا کنه .

 .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 } 

 

در کد css بالا برای زیبایی بیشتر به خط ۸ با استفاده از خاصیت font-family یک فونت انتخاب کنید