Search Results for 'horizontal'

[Anonymous]

Hello Trevor.

I would like to explain more what exactly I need and I hope you will help me how to set this plugin to achieve this result.

https://www.dropbox.com/s/gjr5foo2hbb6yhm/Screen%20Shot%202020-08-28%20at%202.21.28%20PM.png?dl=0

I hope it will open this photo. The idea is to have 3 different horizontal drop down filters.

First will be different services. I believe I will use Categories there.

Second will be different languages. I think I need to use tags there.

Third will be different cities. I don’t know what shall I use there. After reading your documentation, I figured out that the best way is to use taxonomy, but maybe you can suggest something else.

If to use taxonomy, I need a help to create that taxonomy. s I mentioned in the previous message, I tried to use a plugin suggested, but it was slowing down my website, so I decided to modify my theme and create that taxonomy there.

Can you help me to have that code which will include those cities I mentioned in the previous message?

Thank you so much for your help,
Yulianna

[Trevor]

You have the menu inside a vertical sidebar, it cannot be horizontal in there, there is not enough space/width. You would need to remove the sidebar and place the form above the results in the main content area of your page.

[Anonymous]

Hello There,

I wanted to know how to display filter form horizontally instead of vertically ?
https://prnt.sc/u7lzh0

Regards.

[Trevor]

Does it now look as you want?

The horizontal CSS is changed to this:

.searchandfilter > ul {
margin-left: 0;
display: flex;
}
.searchandfilter > ul > li {
padding: 0px 40px 0px 0px;
}
.searchandfilter > ul > li.sf-field-submit {
align-self: flex-end;
}
.searchandfilter > ul > li.sf-field-submit input {
justify-content: flex-end;
}

[Anonymous]

Nevermind. I found what I needed at https://support.searchandfilter.com/forums/topic/how-to-make-checkbox-arranged-horizontally/

.searchandfilter ul {
padding-left: 0;
}
.searchandfilter > ul > li[data-sf-field-input-type="radio"] > ul > li {
display: inline-block;
margin-right: 20px;
}

[Trevor]

In the mobile version, the filters will need to be vertically arranged, not horizontal.

I can see that your theme has a CSS rule that uses flexbox to make them horizontal. At some point you need to set the content into a column. Use this custom CSS maybe:

.fusion-content-widget-area .widget .searchandfilter select.sf-input-select,
.fusion-content-widget-area .widget .searchandfilter label {
    width: inherit;
}
.fusion-content-widget-area .widget .searchandfilter > ul > li {
    min-width: 200px;
    margin-right: 20px;
}
@media only screen and (max-width: 991px) {
  .fusion-content-widget-area .widget .searchandfilter > ul {
    flex-direction: column;
  }
  .fusion-content-widget-area .widget .searchandfilter > ul > li {
    margin-right: 0;
    margin-bottom: 20px;
  }
  .fusion-content-widget-area .widget .searchandfilter .search-filter-reset {
    margin: 0;
  }
}

[Anonymous]

The cooperation with Divi is very good.

The horizontal display of the form only works with the free version, but not with the pro-version. Therefore I have now changed the whole design:
https://www.veggie-treff.de/vegane-rezepte/

Missing language files are not good in the long run. Especially with a paid version this should be standard.

A copy for individual editing of “results.php” is nice, but also dangerous. So I have to check after each update if I have to make adjustments.

Scary is the old version (3 months) and only tested until WordPress 4.9.
When can I expect a current Pro version, which is at least tested with WordPress 5.4.2 and 5.5?

[Trevor]

We do not use languages files, sorry. If you are using the shortcode display results method and need to translate the strings in the results template file, you can make your own custom template (the strings are easy to find and change):

https://searchandfilter.com/documentation/search-results/using-a-shortcode/#customising-the-results

To make the form horizontal:

https://searchandfilter.com/documentation/getting-started/display-search-form/#making-your-search-form-horizontal

There are many snippets of CSS in the forum:

https://support.searchandfilter.com/forums/search/data+form+sf+id+searchandfilter

[Anonymous]

Thanks, this information was helpfull.

But two more questions:
1. Is there a German language file?
2. How can I display checkboxes horizontally in the search form?

[Trevor]

To make the form Horizontal, see here:

https://searchandfilter.com/documentation/getting-started/display-search-form/#making-your-search-form-horizontal

There are many other customising snippets in the forums:

https://support.searchandfilter.com/forums/search/searchandfilter+data-sf-form-id/

That code you tried will likely not work. Are you able to send me a live link/URL to your search page so I can take a look?