Show search bar on every page of Knowledgebase

This support request was posted in Flatbase by renee_HS

Request ID #30733 In Progress
  • I am trying to solve an issue with the Firebase theme: I want to have the search bar that currently only appears on the home page exist in the header for every page of the site.

    To this end, I initially built a hacked-together search bar via HTML/CSS/PHP that you can see here: http://helpshift-resources.com/support/knowledge-base/ It’s currently visible on the Knowledgebase page and on individual article pages.

    I used the following code snippet in template-knowledgebase.php and single-article.php to add the search bar to these pages:

    <!– START CUSTOM SEARCH BAR –>

    <div id=”search-wrap” align=”center”>
    <form role=”search” method=”get” id=”searchform” class=”clearfix” action=”<?php echo home_url( ‘/’ ); ?>” autocomplete=”off”>
    <div class=”input”>
    <label for=”faqsearchinput”><?php echo apply_filters( ‘nice_livesearch_label’, __( ”, ” ) ); ?></label>
    <input type=”text” name=”s” id=”faqsearchinput” size=”80%” placeholder=”Have a question? Ask or enter a search term.” />
    <input type=”submit” id=”searchsubmit” value=”Submit” />
    </div>
    </form>
    </div>

    <!– END CUSTOM SEARCH BAR –>

    However, this hacked-together search bar unfortunately does not include the feature of displaying search matches as your typing in the search term, which we really want to keep.

    To resolve this issue, I wanted to ask for information about two possible solutions:

    1) Fix it so that the search bar I built does populate possible search matches when the user types. I would need a recommendation for how to revise the code written above.

    or

    2) Instead of using the self-created search bar, modify the code in header.php to have the existing search bar on the home page appear within the header on every page. The new header would contain the nav bar and the search bar (without the welcome message “Advice and solutions from Helpshift experts” which should only appear on the home page.) I’m can expand the header via CSS to accommodate the search bar.

    To attempt this solution, I attempted to rewrite sections of code in the live-search section of header.php to ensure the search bar would appear on all pages, but not the welcome message. I’ve included that code in a gist here: https://gist.github.com/reneeHS/b09123844817894cf4b9ab9e6e8807ec (see line 110 for the rewrite)

    I’m not very familiar with PHP (I’m not a developer by trade) so at this point I’m stuck. I saw that someone else asked about this in a different support post, https://nicethemes.com/forums/topic/show-search-bar-on-each-article-and-faq/ but the Gist link from that thread is expired, so I couldn’t see their solution.

    Any and all guidance is welcome! Thank you!

    Hi there,

    Just wondering if there was any update. We are working on a solution with our in-house developers right now, so if it’s not something that can be resolved by the NiceThemes support theme, just let me know and i’ll work with our team members here. Thanks!

    Juanfra Aldasoro

    Hi Renée,

    Thank you for your patience and sorry for the delay. Unfortunately, as I mention on the thread you linked, that cannot be done via theme options.

    What I can tell you is that the thing you have to maintain in order to have the live search functionality working, is the HTML markup for the search form and its container.

    You are using a different ID for the search input (you are using faqsearchinput instead of s), and the livesearch JavaScript functionality is triggered over that input (within a #livesearch container)

    jQuery('#live-search #s').liveSearch();
    

    Best,
    Juan.

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

Login to your Account

Welcome back! Please log in to your account by filling the fields below:

Forgot?

Not a member? Create a free account.

Create a Free Account

You're 27 seconds away from some awesome WordPress free stuff, benefits and more. Create a free account and have access to our free products, benefits and more!

Already have an account? Log in
Secure Server