بیگ تم, متفاوت & حرفه ای
مرجع ارائه آموزش وردپرس , قالب وردپرس , افزونه وردپرس بی نظیر


خانه / هک وردپرس / فرم جست و جو با html5 برای وردپرس
فرم جست و جو با html5 برای وردپرس - search form

فرم جست و جو با 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 بعد از حلقه ی پست ها قرار بدید.

منبع: بیگ تم

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

باکس دانلود

17 دیدگاه

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

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

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

  2. سلام من زمانی که فرم رو اجرا میکنم وارد یه صفحه سفید میشه

  3. سلام ببخشید اگر میشه به دیدگاه من جواب بدید خیلی ممنون میشم!!!!!!!!!!!!!!!!!!!!!!

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

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

  6. ممنونم خیلی عالی بود

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

پاسخ دهید

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

دنبال کردن