Align fields and make them non-bullet points and remove Related Post content

Anonymous

#262630

I copied the text from this very page and it pastes correctly. After saving it turns to
“& g t ;” (without the spaces). When I paste that text as it appears in the Custom CSS box after saving into this web form, the form corrects it again. (hence my earlier comment having twice the > symbol.

Trevor

#262632

This reply has been marked as private.

Anonymous

#262634

This reply has been marked as private.

Trevor

#262636

That probably would not work.

When you copy the code I gave you, it should not convert the > symbol to its HTML entity. What are you pasting the code in to, an editor, or where?

Anonymous

#262638

What would not work? I think Skype desktop share will save a lot of typing…

I am adding the code in the Custom CSS section of the theme. See the snapshots that I shared earlier. This does work for lots of other stuff. Alternatively, there is also direct access to the actual php theme files, as also shared on the screengrabs.

Trevor

#262640

I saw the screenshots. I do not know why the > is being converted to a HTML entity. It should not be doing that. The > symbol is valid. You can remove it, but the CSS would be less specific. My site happily accepts that symbol and does not convert it, so something is wrong with either your browser or the server.

Anonymous

#262642

It just occurred to me that there is another instance where custom CSS can be added, in the Customizing –> additional CSS section of WordPress. I pasted the code there and voila, the bullet points are gone. However, the fields are still in the same positions, too far to the right. They should align more to the left, right above the “Found 709 results” text.

You can see the result here:
https://www.hifi-advice.com/blog/search-and-filter/?sf_paged=2

Trevor

#262644

OK, I will need to get on this on Monday. We are not officially open over the weekend. Here is the CSS you need:

.searchandfilter ul {
    margin-left: 0;
}

Anonymous

#262646

Ok no worries, thanks for the help so far.

Just to confirm: the last code does make the text jump halfway over to the left but it’s still not fully aligned. Looking at it using Google Inspect, it seems that the elements within the ul section that you are moving have a 10px padding themselves. But that can wait until after the weekend:-)

Trevor

#262711

I see what is causing the extra left padding (again from your theme). This should fix it:

.body-content .searchandfilter ul li {
    padding-left: 0;
}

[Author]

Posts