Search with dropdown

This topic contains 8 replies, has 2 voices, and was last updated by Ernest Marcinko Ernest Marcinko 6 years, 4 months ago.

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #7646
    MO
    MO
    Participant

    Hi,

    I am trying to get a searchbox similar to this restaurant website – http://look-out.be/

    So: dropdown for region, dropdown for kind of kitchen (french, asian etc) and keyword field.

    I looked at the Custom fields, but that only works with products. Since I don’t have Woocommerce, how to proceed?

    Thanks for your help!

    #7649
    Ernest Marcinko
    Ernest Marcinko
    Keymaster

    Hi,

    Custom fields does work with every post type (posts, pages, products, portforlio etc…), no need to have WooCommerce: https://codex.wordpress.org/Custom_Fields
    They are basically extra information you can attach to an object (such as a restaurant).

    Your setup depens on how the region and kitchen are defined – if they are taxonomy terms (similar to categories) you need the taxonomy term selectors.
    If they are stored as custom fields, then you can create custom field selectors.

    Best,
    Ernest Marcinko

    If you like my products, don't forget to rate them on codecanyon :)


    #7650
    MO
    MO
    Participant

    Hi Ernest,

    Both region and kithcen type are categories in this site.

    Basically, I would like to have a dropdown with region, below that a dropdown with kitchen and below that a keyword field.

    How should I proceed or isn’t that possible with this plugin?

    Thanks!

    #7655
    MO
    MO
    Participant
    You cannot access this content.
    #7658
    Ernest Marcinko
    Ernest Marcinko
    Keymaster

    Hi!

    To display the selectors above the search bar, I suggest using the settings shortcode. It basically allows you to display the settings box above the search bar. In your case the post/page with both shortcodes would look like:

    
    [wpdreams_asp_settings id=1 element='div']
    [wpdreams_ajaxsearchpro id=1]
    

    The plugins main feature is a search bar, thus a search phrase is required, however there is a knowledge base article to make it work without any phrases: https://wp-dreams.com/knowledge-base/how-to-use-filters-only-and-hide-the-search-bar/
    Just skip the Custom CSS part of that tutorial, since you want to display the search bar.

    It does not matter how many restaurants you have, by default always 10 is displayed (its the results limit by default). You can of course increase that to a higher number if you want to on the General Options -> Behavior panel: https://i.imgur.com/9nDaAC0.png

    Best,
    Ernest Marcinko

    If you like my products, don't forget to rate them on codecanyon :)


    #7668
    MO
    MO
    Participant
    You cannot access this content.
    #7669
    Ernest Marcinko
    Ernest Marcinko
    Keymaster

    Hi,

    1. Have you applied the tweaks to allow empty phrases? I cannot see the changes. When I type in something, I’m getting a result: https://i.imgur.com/TsRg8gf.png

    2-4. In this case, use the Two Column Shortcode instead of the search shortcode. Your final output should be:

    
    [wpdreams_asp_settings id=1 element='div']
    [wpdreams_ajaxsearchpro_two_column id=1 search_width=50 results_width=50 invert=0 element='div']
    

    This will display the settings on top and the results on the right side on 50% width.

    How it’s done on that example:
    In that example you linked I’m using column shortcodes, which are a feature of the that theme, but novadays 90% of the themes have them, probably yours as well. In that case the search shortcode on the left is put into a 1/3 column shortcode, and the results shortcode is put into a 2/3 column shortcode.

    
    [one_third]
        [wpdreams_asp_settings id=1 element='div']
        [wpdreams_ajaxsearchpro id=1]
    [one_third]
    [two_third_last]
        [wpdreams_ajaxsearchpro_results id=1 element='div']
    [two_third_last]
    

    THIS IS JUST AN EXAMPLE! These column shortcodes might be different on your theme, or might not exist!
    Check if your theme has similar column shortcodes and replace them if yes. You might be able to use them!

    Also, if you have visual composer, you can also use the search shortcodes to position to a two column layout separately. It’s a bit easier to position that way, as it does not require coding knowledge.

    3. It’s caused by the theme stylesheet, it sets the default color to brown on fieldsets. Use this custom CSS to fix that:

    fieldset.asp_custom_f * {
        color: white;
    }
    Best,
    Ernest Marcinko

    If you like my products, don't forget to rate them on codecanyon :)


    #7670
    MO
    MO
    Participant
    You cannot access this content.
    #7671
    Ernest Marcinko
    Ernest Marcinko
    Keymaster

    1. I still cannot see the change to allow an empty phrase: https://i.imgur.com/PjwmEBF.png

    If you cannot add it or need help (or it’s not working), just fill in the FTP and back-end login details and I will do that for you.

    2. Because the value of the “Maak uw keuze…” select is “Maak uw keuze” – which is telling the search to filter the filed by “Maak uw keuze” string. You need an empty phrase there instead. So now you have this line in the custom field configuration (https://i.imgur.com/hlmVLRQ.png):

    Maak uw keuze||Maak uw keuze...**

    change that to:

    ||Maak uw keuze...**

    for both custom fields. So there is nothing before the double lines on that first line. It will mean that no value is entered, thus matching anything.

    Best,
    Ernest Marcinko

    If you like my products, don't forget to rate them on codecanyon :)


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

You must be logged in to reply to this topic.