فرم جست و جو با html5 برای وردپرس - search form

فرم جست و جو با html5 برای وردپرس

اینبار در بخش هک و آموزش وردپرس آموزش افزودن فرم جست و جو با html5 برای وردپرس رو براتون اماده کردم , فرم جست و جو از نیازهای سایت هستش و واقعا لازمه و قالبی که طراحی میشه باید این فرم رو در خودش داشته باشه اما اگر قالب وردپرس شما این امکان رو نداره می تونید با استفاده از این آموزش یک فرم جست وجوی حرفه ای با html5 به وردپرس خودتون اضافه کنید.

خوب برای افزودن فرم جست و جو دو راه داریم یکی اینکه کد رو مستقیم در مکان دلخواهی که دوست داریم قرار بدیم و یا ایجاد فایل ‌search.php هر دو رو میگم از هر کدوم که خواستید استفاده کنید مشکلی نداره.

فرم جست و جو با html5 برای وردپرس از طریق فایل search.php

ایتدا داخل پوشه ی قالب وردپرس خود یک فایل به نام search.php ایجاد کنید و کد زیر رو داخل این فایل کپی کنید

<pre><form role="search" method="get" id="searchform" action="/">
    <div><label class="screen-reader-text" for="s">جست و جو برای:</label>
        <input type="text" value="" name="s" id="s" />
        <input type="submit" id="searchsubmit" value="جست و جو" />
    </div>
</form></pre>

حالا کافیه با تابع search وردپرس فرم ساخته شده رو صدا کنید تابع search به این صورت هست


<code> <?php get_search_form(); ?> </code>

حالا کد زیر رو هم به فایل Functins.php اضافه کنید ( در مکان مناسب )

<pre>/**
 * Replacing the default WordPress search form with an HTML5 version
 *
 */
function html5_search_form( $form ) {
    $form = '<form role="search" method="get" id="searchform" action="' . home_url( '/' ) . '" >
    <label for="s">' . __('جست و جو برای:') . '</label>
    <input type="search" placeholder="'.__("Enter term...").'" value="' . get_search_query() . '" name="s" id="s" />
    <input type="submit" id="searchsubmit" value="Search" />
    </form>';

    return $form;
}
add_filter( 'get_search_form', 'html5_search_form' );</pre>

همین کار تمومه به راحتی تونستید با html5 یه فرم به قالب وردپرس خود اضافه کنید , روش دوم هم قرار دادن کدی که در ابتدا گفتم در فایل search.php کپی کنید رو می تونید در مکان دلخواه بین کدهای php و html استفاده کنید مثلا در آخر پست های سایت که باید در فایل single.php بعد از حلقه ی پست ها قرار بدید.

منبع: بیگ تم

لینک: https://bigtheme.ir/search-form-html5-wordpress/

یک پینگ

  1. پینگ‌بک: افزونه جست و جو حرفه ای Ajax برای وردپرس| قالب های وردپرس

  2. پینگ‌بک: افزونه وردپرس فرم جست و جوی حرفه ای| وردپرس

یک نظر

  1. saeed

    میشه بپرسم شما برای کپچای فرم دیدگاه تون از چه کدی استفاده کردین؟
    ممنون میشم نحوه ایجادشو آموزش بدین

  2. سحر

    سلام . من میخوام جستجو رو تغییر بدم . میخوام بر حسب مثلا منطقه یا قیمت کنم . چطور میتونم انجام بدم؟

  3. مهدی

    سلام خسته نباشید..ما یک فرم جستجو مثه سایت اسکریپت بای میخواستیم..هزینه طراحی چقدر هست؟ایا میشه این فرم جستجو رو ریپ زد و برای سایت خود استفاده کرد؟
    scriptbuy.ir

  4. هادی قربانی

    خوب تو برگه جست و جو که کدنویسی میشه یه شرطی باید تعریف کنید که اگر پیدا نشد یه پیغامی نشون بده تو نمونه قالب ها رایگان این مورد رو بررسی کنید متوجه میشید

  5. رضا

    سلام
    من خیلی دنبال آموزش ساخت برگه جست و جو گشتم ولی چیز خاصی پیدا نکردم.
    من میتونم رگه جست و جو رو درست کنم در زمان سرچ هم مطالب رو نمایش میده ، مشکل زمانی که اون کلمه در سایت نباشه ، در اون زمان برگه خالی نمایش میده
    ممنون میشم که کمک کنید .
    یا حق

  6. هادی قربانی

    سلام
    این فقط فرم هستش نه صفحه ی جست و جو , باید یه فایل به اسم search.php داشته باشی که مشخص کننده ی صفحه جست و جو هستش , و اونجا مشخص کنید که اگر نتیجه ای نداشت چیکار کنه. اغلب در صورت نبودن نتیجه می نویسه نتیجه ای برای جست و جو پیدا نشد.

  7. رضا

    سلام ببخشید من می خواستم بدونم که این فرم قالبیت اینو داره که در صورت جست و جوی کلمه ای که در سایت نباشه به صحفه 404 بره.
    یا حق

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *