Prefill checkbox in Search Form

Anonymous

#73020

Hello,

I would like to setup 3 separate pages for a custom post type. We have an “insights” section on our website that contains white papers and case studies. Essentially, I want to be able to display the same S&F form, but then have 3 separate WP pages; 1) For all results (white papers and case studies) 2) For just white papers 3) for just consultant profiles.

Basically, functionality would be like this;
1) http://a52.b4e.mwp.accessdomain.com/insights-all/
2) http://a52.b4e.mwp.accessdomain.com/insights-all/?_sft_type=white-papers
3) http://a52.b4e.mwp.accessdomain.com/insights-all/?_sft_type=success-stories

But it would be separate WP pages rather than one page with different URLs. The reason for this is I simply want to customize SEO (Meta Titles, tags, descriptions, keywords etc) for each page to improve our search engine optimization. So if I could default the form to have “white pages” checked and display white page results and then include that in a new WP page, i could customize the meta tags for that purpose. A user could still uncheck white papers to show all results, or click success stories to display success story results.

Does that make sense? The easiest way would be if I could customize the search shortcode to default specific form fields as selected, such as white papers. Then I could use the same search form and results page for all 3 pages, but I could implement the search form shortcode slightly differently across 3 separate wordpress pages. Any ideas on how this can be done? Thanks in advance!

Trevor

#73045

You COULD do this with 3 separate filters, where you use the Tags, Categories & Taxonomies settings tab to include only the ones you want. If you are using the shortcode display method, you can still use the same search form, but the results part can be different.

Anonymous

#73395

Thanks for the reply! That would work, but it would not be idea. If I limit the results to only include a specific tag/cat/tax using that function, than the search form becomes limited to only that value. Example, I just set my “type” to only include “white papers” on the main search page. Now only “White Papers” appears in the search results, and as a checkbox in the search form.

http://a52.b4e.mwp.accessdomain.com/insights-whitepapers/

The user will only be able to search for white papers, and will not be able to uncheck whitepapers to display all the results. So it accomplishes the job of allowing me to create separate pages for each “type” of CPT, but not idea from a UI standpoint as a user would have to go back to http://a52.b4e.mwp.accessdomain.com/insights-all/ to display all the results.

The ability to prefill a check box using a shortcode or some other programatic method on page would still be preferred and allow me to create separate pages, but preserve the same S&F Search Form for all 3 pages.

Trevor

#73581

I do see what you mean, I think. What you mean is to arrive on a given page with the option you want pre-selected, even though it is not generally so in the form setup, and then allow a user to change that selection. If I have that correct, you would need to be using a child theme so that you could add some code to the child theme functions.php.

You would check if the search form is on the page as the first stage (see https://www.designsandcode.com/documentation/search-filter-pro/action-filter-reference/) and then check whether the page is one that you want to set a default (using the WordPress is_page() function), then check if the query is being filtered, and if not set the query argument you want.

A bit of a long winded way to do it. If that is what you want, I may need to ask the developer to help on this thread.

Anonymous

#73736

Thanks for the response Trevor! That sounds like the correct way to do things! Unfortunately, I’m not very good at manipulating functions or functions.php. I have a solution that is working for now however! I created 3 S&F Search Forms. They are all identical except one aspect. The main search form used to show all results has no results filter on “Tags, Categories & Taxonomies”. It’s ID is “11107”. Then I copied that search form into two new forms. Each has a filter on tags/cat/tax, one for white papers, one for success stories. I did a search on the main form, then i grabbed the source code for the form with the pre-checked checkbox, one for white papers, one for success stories. I have 3 pages; 1) for all the results with original shortcodes for search and results page 2) one for white papers with actual source code for the search form prechecked for white papers, BUT returning the search results to the original results page (11107). I have the search results shortcode, however, filtered using this new form (ID 11173). 3) Success stories is the same as the white papers, but with source code forcing case studies to be pre-checked and the third search results shortcode limiting search results to just case studies.

If you try the pages below, you can see it works pretty darn well. I have a custom page title and meta for each page. Each page displays the given or relevant results for the page title, but uses essentially the same form. And you can manipulate the search results to show anything you want despite the page you land on.

http://clarityconsultants.com/insights-all/
http://clarityconsultants.com/insights-white-papers/
http://clarityconsultants.com/insights-success-stories/

Code to generate S&F search form on White Papers page;

<form action="http://clarityconsultants.com/insights-all/" method="post" class="searchandfilter" data-sf-form-id="11107" data-is-rtl="0" data-results-url="http://clarityconsultants.com/insights-all/" data-ajax-url="http://clarityconsultants.com/?sfid=11107&sf_action=get_results" data-ajax-form-url="http://clarityconsultants.com/?sfid=11107&sf_action=get_form" data-use-history-api="1" data-template-loaded="0" data-lang-code="" data-ajax="1" data-ajax-target="#search-filter-results-11107" data-ajax-links-selector=".pagination a" data-update-ajax-url="1" data-only-results-ajax="1" data-scroll-to-pos="0" data-auto-update="1" data-auto-count="1" data-auto-count-refresh-mode="1" id="search-filter-form-11107" autocomplete="off">
  <ul>
    <li class="sf-field-search" data-sf-field-name="search" data-sf-field-type="search" data-sf-field-input-type="">
      <h4>Keyword</h4>
      <label>
        <input placeholder="Search …" name="_sf_search[]" class="sf-input-text" type="text" value="" title="">
      </label>
    </li>
    <li class="sf-field-taxonomy-type" data-sf-field-name="_sft_type" data-sf-field-type="taxonomy" data-sf-field-input-type="checkbox">
      <h4>Type</h4>
      <ul data-operator="or" class="">
        <li class="sf-level-0 sf-item-114 sf-option-active" data-sf-count="68">
          <input class="sf-input-checkbox" type="checkbox" value="success-stories" name="_sft_type[]" checked="checked" id="sf-input-ebd832e0d6a9e4300219f4c687415a3d">
          <label class="sf-label-checkbox" for="sf-input-ebd832e0d6a9e4300219f4c687415a3d">Success Stories<span class="sf-count">(68)</span>
          </label>
        </li>
        <li class="sf-level-0 sf-item-116" data-sf-count="5">
          <input class="sf-input-checkbox" type="checkbox" value="white-papers" name="_sft_type[]" id="sf-input-49fad65047305ebd34213e379030f930">
          <label class="sf-label-checkbox" for="sf-input-49fad65047305ebd34213e379030f930">White Papers<span class="sf-count">(5)</span>
          </label>
        </li>
      </ul>
    </li>
    <li class="sf-field-taxonomy-topic" data-sf-field-name="_sft_topic" data-sf-field-type="taxonomy" data-sf-field-input-type="checkbox">
      <h4>Topic</h4>
      <ul data-operator="or" class="">
        <li class="sf-level-0 sf-item-115" data-sf-count="19">
          <input class="sf-input-checkbox" type="checkbox" value="creative" name="_sft_topic[]" id="sf-input-95f19173a3a36575c1412aa1c10ce689">
          <label class="sf-label-checkbox" for="sf-input-95f19173a3a36575c1412aa1c10ce689">Creative<span class="sf-count">(19)</span>
          </label>
        </li>
        <li class="sf-level-0 sf-item-98" data-sf-count="54">
          <input class="sf-input-checkbox" type="checkbox" value="learning-and-development" name="_sft_topic[]" id="sf-input-39454b662e503ddfb9047f0316858be1">
          <label class="sf-label-checkbox" for="sf-input-39454b662e503ddfb9047f0316858be1">Learning and Development<span class="sf-count">(54)</span>
          </label>
        </li>
      </ul>
    </li>
    <li class="sf-field-submit" data-sf-field-name="submit" data-sf-field-type="submit" data-sf-field-input-type="">
      <input type="submit" name="_sf_submit" value="Submit">
    </li>
    <li class="sf-field-reset" data-sf-field-name="reset" data-sf-field-type="reset" data-sf-field-input-type="link"><a href="#" class="search-filter-reset" data-search-form-id="11107">Reset</a>
    </li>
  </ul>
</form>

Trevor

#73802

If it works for you ….. 😉

Can I close this thread as resolved?

[Author]

Posts