Search Results for 'data-sf-form-id'

[Trevor]

Something like this maybe:

.home .widget-wrap form.searchandfilter[data-sf-form-id="1135"]:before {
  content: "Search";
  float:left;
  padding-top: 20px;
  font-size: 25px;	
}

[Anonymous]

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]

If, if you examine the page code using the inspector, you see this for the form start tag:

<form action="http://www.hmgaerospace.com.gridhosted.co.uk//lara/news/" method="post" class="searchandfilter" data-sf-form-id="1418" data-is-rtl="0" data-results-url="http://www.hmgaerospace.com.gridhosted.co.uk//lara/news/" data-ajax-url="http://www.hmgaerospace.com.gridhosted.co.uk/?sfid=1418&sf_action=get_results" data-ajax-form-url="http://www.hmgaerospace.com.gridhosted.co.uk/?sfid=1418&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-1418" data-ajax-links-selector=".pagination a" data-update-ajax-url="1" data-only-results-ajax="1" data-scroll-to-pos="0" data-auto-update="" id="search-filter-form-1418" autocomplete="off">

Notice the action url and the data-results-url have this as their value:

http://www.hmgaerospace.com.gridhosted.co.uk//lara/news/

There are 2 slashes in the url of both. Is this an issue in the WordPress setup?

[Anonymous]

I am copying the following to my child theme stylesheet as I want search fields to appear horizontally, however there is no change.

.searchandfilter[data-sf-form-id=”2374″]
{
display: inline !important;
font-size: 100px !important;
}

I’ve also tried

.searchandfilter p
{
display: inline !important;
font-size: 100px !important;
}

Can you please advise?

Thank you.

[Anonymous]

Thank you I found this thread https://support.searchandfilter.com/forums/topic/sf-horizontal-the-final-solution/ which helped a lot but the problem I am coming across right now is getting the check boxes to line up in 3 columns in a row like in the photo above. here is the css I am using .

.searchandfilter[data-sf-form-id=”116014″] .chosen-container.chosen-container-multi {
width: 100% !important;
margin-top: -5px !important;
}

.searchandfilter[data-sf-form-id=”116014″] input.default {
border-color: rgba(0,0,0,0.3);
outline: 1;
outline: thin dotted \9;
box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(0,0,0,0.2);
-webkit-transition: border linear 0.2s,box-shadow linear 0.2s;
transition: border linear 0.2s,box-shadow linear 0.2s;
}

.searchandfilter[data-sf-form-id=”116014″] li.sf-field-category {
width: 30% !important;
}

.searchandfilter[data-sf-form-id=”116014″] select.sf-input-select {
width: 100%;
}
`

[Trevor]

Hi

You would need to decide which bits need to be where, but this for example:

.searchandfilter[data-sf-form-id="41629"] li.sf-field-category {
    width: 20% !important;
}

Might become this:

.searchandfilter[data-sf-form-id="41629"] li.sf-field-category {
    width: 20% !important;
    float: left;
    display: inline-block !important;
}

and so on.

[Anonymous]

Ok this is the final result with consistency:

.searchandfilter[data-sf-form-id="2545"] > ul > li {
	display:inline-block !important;
}

.searchandfilter[data-sf-form-id="2545"] li.sf-field-search {
  width: 40%;
  padding-right:10px !important;
}

.searchandfilter[data-sf-form-id="2545"] li.sf-field-tag {
  width: 40%;
  padding-right:10px !important;
}

/* format tag fields for consistency */
.searchandfilter[data-sf-form-id="2545"] .chosen-container-multi .chosen-choices {
    display: inline-block;
    height: 2.65em !important;
    margin-bottom: 0px;
    border: 1px solid #ddd;
    padding: 0 0.65em;
    font-size: 13px;
    line-height: normal;
    color: #555;
    background-color: #fff;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
} 

.searchandfilter[data-sf-form-id="2545"] .chosen-container.chosen-container-multi {
    width: 100% !important;
      margin-top: -5px !important;
}

.searchandfilter[data-sf-form-id="2545"] input.default {
border-color: rgba(0,0,0,0.3);
    outline: 0;
    outline: thin dotted \9;
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(0,0,0,0.2);
  -webkit-transition: border linear 0.2s,box-shadow linear 0.2s;
    transition: border linear 0.2s,box-shadow linear 0.2s;
}

.searchandfilter[data-sf-form-id="2545"] li.sf-field-category {
    width: 20% !important;
}

.searchandfilter[data-sf-form-id="2545"] select.sf-input-select {
    width: 100%;
}

Hope can help a lot of people that are trying to have an horizontal view for S&F.

Now I just need to edit the @media CSS for smartphones and tablets.

[Anonymous]

Hello,
I am using GTranslate plugin and would like SF2 ajax form results to be translated.
I got this from Gtranslate support:

——-
You have this form:

<form action=”http://en.tracers.ru/archive/&#8221; method=”post” class=”searchandfilter” data-sf-form-id=”17942″ data-is-rtl=”0″ data-results-url=”http://tracers.ru/archive/&#8221; data-ajax-url=”http://tracers.ru/?sfid=17942&sf_action=get_results&#8221; data-ajax-form-url=”http://tracers.ru/?sfid=17942&sf_action=get_form&#8221; data-use-history-api=”1″ data-template-loaded=”0″ data-lang-code=”” data-ajax=”1″ data-ajax-target=”#search-filter-results-17942″ 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″ id=”search-filter-form-17942″ autocomplete=”off”>

You will need to change data-results-url, data-ajax-url, data-ajax-form-url attributes to be relative or to include the language code like in action attribute. This attributes are not standard attributes like action, that’s why they are not getting replaced with appropriate language domain automatically.

Thanks! – See more at: http://gtranslate.net/forum/ajax-filter-resets-language-t4636.html#sthash.jFV69pbs.dpuf
——-

Can you tell me where should I make change in code?

Thank you,
Oleg

[Anonymous]

I take several tests and i can’t change page on the result page on a different language than a native one. In english (native language), everything goes well, but in french (in my case) i can’t change page. I changed to apache server and everything is ok. But for performance purpose, i need to run my website on Nginx.

I have a Dreamhost VPS server with Nginx 1.4.4 with PHP 5.5

For debug purpose, here is what i have in response when a click on a page in my result page in French :

url : http://wysote.tzclients.com/fr/?sfid=102&sf_action=get_results&sf_paged=2&lang=fr

And the output is the html of my home page.

In english, the output start with this : {“form”:”<form action=\”http:\/\/wysote.tzclients.com\/inventory\/\” method=\”post\” class=\”searchandfilter\” data-sf-form-id=\”97\”

[Anonymous]

I ended up adding this code to my site instead of using the search and filter pro widget:

<form action=”” method=”post” class=”searchandfilter” data-sf-form-id=”34373″ data-use-history-api=”1″ data-template-loaded=”0″ data-lang-code=”” data-results-url=”http://focenter.staging.wpengine.com/search-results/&#8221; data-display-results=”archive” data-auto-update=”1″ id=”search-filter-form-34373″>

<li class=”sf-field-search” data-sf-field-name=”search” data-sf-field-type=”search” data-sf-field-input-type=””><input isp_ignore type=”text” name=”_sf_search” placeholder=”type and hit enter…” value=””><input type=”hidden” name=”_sf_submitted” value=”1″ /><input type=”hidden” name=”_sf_form_id” value=”34373″ class=”sf_form_id” />

</form>

Above I added the isp ignore attribute and it seems to have removed the autocomplete feature from the instant product search which shouldn’t have been showing up anyway. Now the issue is that when I submit the search, I am still seeing products when I should only be seeing posts and pages according to how that search and filter form was setup.

Am I doing this correctly? And how do I make sure the results show up correctly and don’t pull results from the other search box?