Css styling problem

Anonymous

#228279

Hello there,

I want to display categories on my articles page but even using documentations instructions for customizing css I seem unable to modify how my categories are displayed.

`.searchandfilter[data-sf-form-id=”2721″]
{
font-family: BatonTurboWeb-Medium;
font-size:18px;

}

Could you help me please

Trevor

#228281

Are you referring to the display in the form (the fields) or in the list of posts, or before the list of posts (e.g. ‘You Searched for ….)?

Are you able to send me a live link/URL to your search page so I can take a look?

Any annotated screenshots you can make to help me would be appreciated. You will need to upload images to an external file sharing site, like dropbox, and share the link(s) with me.

Anonymous

#228295

Hi Trevor,

my post categories on the left side are like this :

https://ibb.co/KwQsFqDhttps://ibb.co/KwQsFqD

And my goal is to be like this :

https://ibb.co/7g96H7h

I added custom css with elementor on the shortcode of the searandfilter form but I don’t understand why it’s not working.

Here a link of the page :

https://www.wecangroup.ch/mediamediamedia/

Thanks for your help.

Trevor

#228348

You want to be able to click on one of them to select? and, from the settings I see, be able to select more than one, yes?

To be able to make the list look as per your sample, it needs to be a checkbox control, like this:

https://www.screencast.com/t/akg70bFxp2

I think you would want the operator set as OR (as I show), so, as you select more than one, the results will increase.

Can you set the field like this and let me know when this is done, then I will make the CSS for you?

Anonymous

#228414

Hello Trevor,

yes this is exactly what I want. I done the changes that you told me. Thanks for your reactivity !

Trevor

#228483

Can you try this custom CSS:

.searchandfilter li[data-sf-field-input-type=checkbox].sf-field-category > ul > li label {
  line-height: 42px;
  border-bottom: 1px solid #666;
  width: 100%;
  padding-left: 0px;
}
.searchandfilter li[data-sf-field-input-type=checkbox].sf-field-category input {
  display: none;
}
.searchandfilter ul li[data-sf-field-input-type=checkbox].sf-field-category li {
  padding: 0;
}
.searchandfilter ul li[data-sf-field-input-type=checkbox].sf-field-category {
  padding: 0;
}
.searchandfilter li[data-sf-field-input-type=checkbox].sf-field-category > ul > li.sf-option-active label {
  color: #e3051c;
}
.searchandfilter li[data-sf-field-input-type=checkbox].sf-field-category > ul > li label:hover {
  cursor: pointer;
}

Anonymous

#228756

Hi Trevor,

thanks for your help.

I have two new issues since this: https://www.wecangroup.ch/media/

When I click on the category in the searchand filter my goal was to see only the post relevant to the category under the component “Wecan news” but instead there is a strange list that appear.

And my second problem, is that I try to remove the category ” Uncategorized” but can’t find how to do it. Thanks for your help again.

Trevor

#228832

To remove ‘Uncategorized’ click the Advanced Settings link, deselect the Sync with Settings, browse and select that term to exclude:

https://www.screencast.com/t/9MuEm3jPe

Trevor

#228834

I think I see the issue. The results grid is made in Elementor Pro using their Post Grid element.

Thus, you must use the method described here:

https://support.searchandfilter.com/forums/topic/how-can-i-search-elemntor-column-while-retaining-the-design-of-that-column/#post-209754

Anonymous

#229155

Hi Trevor,

I followed the documentation and tried the method described in the post below but it don’t seem to work.

My post-grid when I click on categories seem to load but nothing happen : https://www.wecangroup.ch/media/

I added the script directly in the .js file of the theme. Put my search and filter shortcode through elementor. And here’s my setting of “Display results” in the dashboard :

https://ibb.co/5hLgWXy

Thanks for your time

[Author]

Posts