Search Results for '.searchandfilter custom css'

[Trevor]

To reset the font to normal (it was made by bold by your theme), use this Custom CSS:

.searchandfilter label {
  font-weight: 400;
}

[Trevor]

OK

Try this Custom CSS:

.searchandfilter .sf-field-taxonomy-branche h4, .searchandfilter .sf-field-taxonomy-branche label {
  display: block !important;
}

[Trevor]

Yes, but they are in a narrow column?

I also see that one section of that Custom CSS is not pasted correctly. There should be greater than symbols and instead there are HTML entities

#main-content .searchandfilter .sf-field-post-meta-erster_buchstabe > ul > li {
 margin-left:0 !important;
}

Did you copy from the email, or from this forum post?

Anyway, that last code block becomes this:

#main-content .searchandfilter .sf-field-post-meta-erster_buchstabe > ul > li {
 margin-left:0 !important;
 width: 2.5em;
 display: inline-block;
}

[Trevor]

OK. So you need to add some Custom CSS to your theme:

.searchandfilter .sf-field-post-meta-erster_buchstabe input {
  display: none;
}
.searchandfilter .sf-field-post-meta-erster_buchstabe label {
  text-align: center;
  width: 1.5em;
  line-height: 1.4em;
  border: 2px solid #666;
  padding: 3px !important;
  text-indent: 0;
}
.searchandfilter .sf-field-post-meta-erster_buchstabe label:hover {
  cursor: pointer;
}
#main-content .searchandfilter .sf-field-post-meta-erster_buchstabe > ul > li {
  margin-left: 0 !important;
}

How does that look?

[Trevor]

Hi

I am glad we are making some progress for you.

The first thing is to reveal the submit button. Somewhere in your custom CSS you have added this:

.searchandfilter input[type="submit"] {
    margin-right: -12px !important;
    padding: 14px !important;
    border-radius: 35px !important;
    width: 150px;
    text-align: center !important;
    color: black;
    background-color: white;
    border: none !important;
    position: absolute;
    top: 8px;
    right: -23%;
    font-family: CircularStd-Book !important;
    font-size: 17px !important;
}

It is the position: absolute; that is the problem. Change that to position: relative;

Then, in the form setup, on the General settings tab, disable Auto Submit.

Finally, this code can be seen in the images:

" class="vc_gitem-link vc-zone-link">

This is being caused by the Multi Rating plugin that you have installed. You would need to check the settings to see if any changes might fix it, or alternatively contact the author for a fix.

I would observe that the WPBakery Visual Composer plugin, at v5.2.1, is out of date. That plugin is currently at v5.4.4 (with 5.4.5 due in the coming days). The plugin has also been renamed to Page Builder since your version was released.

[Trevor]

Ok, to remind what I said in our chat. You need to make sure the parent product categories are in the WooCommerce Product Category custom taxonomy. The sub categories must be in a separate custom taxonomy.

You may need to make an additional taxonomy for this. This post tries to explain this a bit better (you can use a plugin to switch category terms from media-category to any new taxonomy that you make, so it is not so hard to do). It is a really awful preachy lecture I wrote:

https://support.searchandfilter.com/forums/topic/multiple-categories-combination/#post-55166

Sorry about the tone, but the message is right and it links to good plugins (except taxonomy switcher I think).

In the form you need to …

In the General Settings tab:

Make sure that Maintain Search Form State is set to OFF (unless you need it on)
Set Auto Count (both settings) to ON
In Detect defaults from current page -> Choose which kinds of pages S&F will try to do this on, set Tag, Category & Taxonomy Archives to ON

and in the Display results settings tab:

Template Options -> Enable filtering on Taxonomy Archives set to ON

In the Form UI:

In the sub-category custom taxonomy that you make, set Hide Empty to ON

You will need to hide the Product cateogry field from the user using custom CSS (display: none;) on that field.

If I missed anything (I probably did, my apologies), follow up and nudge me.

[Trevor]

Hi

Q1. Is there any way to show the total result count of the actual search in the S&F widget?
A1. If you mean in the same space as the form, not easily. If you had this count in the result block on the page (and that would be dependent on your results template), you could use javascript to copy this value to another part of the page. But you would need to hire a third party coder to do that.

Q2. How can I format the checkboxes horizontal?
A2. Most formatting of the forms needs to be done using custom CSS. There are code snippets in answers on the forum, such as this:

.searchandfilter ul > li > ul:not(.children) {
  padding-left: 0;
}
.searchandfilter > ul > li > ul > li {
  display: inline-block;
}
.searchandfilter  > ul > li > ul > li .sf-label-checkbox {
  margin-right: 20px;
}

Q3. In your Movie demo is the “Genre checkbox-area” reduced (scrollable) – how is it done?
A3. There are many ways that you can do this, including some quite pretty scrollbars using jQuery, but in this case a simple piece of custom CSS:

.searchandfilter > ul > li[data-sf-field-input-type="checkbox"] > ul, .searchandfilter > ul > li[data-sf-field-input-type="radio"] > ul {
  max-height: 150px;
  overflow: auto;
}

Note that this will affect all checkbox and radio button groups in your form.

[Trevor]

Can you try adding this custom CSS to your theme’s custom CSS file, or in the theme customizer:

.searchandfilter > ul > li {
display: inline-block;
margin-right: 20px;
}
.searchandfilter > ul > li:last-child {
margin-right: 0;
}

[Trevor]

Off the top of my head, this custom CSS has worked for others:

.so-widget-sow-editor .searchandfilter label br {
  display: none;
}
.so-widget-sow-editor .searchandfilter select,
.so-widget-sow-editor .searchandfilter input {
  margin-bottom: 0;
}
.so-widget-sow-editor .searchandfilter p {
  margin-bottom: 0;
  margin-top: 0;
}

[Trevor]

Q. Is there a way to adjust Preisbereich (price range) and the range checkboxes left?
A. Yes, use this Custom CSS to remove the indent (left padding)

.searchandfilter ul ul {
  padding: 0;
}

Q. Does search & filter do the caching automatically when new posts are added?
A. If you add posts using the WordPress editor, yes. If you import them, the cache must be re-built manually, or as the new posts are imported one by one, you can use one of our actions:

https://www.designsandcode.com/documentation/search-filter-pro/action-filter-reference/#Update_Cache_for_a_Particular_Post