Blacksmith to target lists

Blacksmith

Starting to play around with blacksmith and have done some simple CSS tweaks such as reduce paragraph size. That was easy because I could target ‘paragraphs’ in blacksmith settings.

I have used the settings to increase line height and text colour but I am sure blacksmith would be a better solution across many pages of a website.

How do I use blacksmith to target lists? What selector should I use? Am I correct in using the font spacing option to increase line height?

Cheers Nigel

So I had a play around (used inspect element) and used a custom selector and selector of ‘li’ to target the list. It is targeting the list in edit view. I can make all sorts of changes to the list but not when it previews.

Parent class of line-height - The list on the editor view has increased in line height but not on preview? I had a play around and can change ‘transform’ the text to capitals, change colour etc. in edit view but not when I preview?

I am sure I am missing something, simple but obvious.

Nigel

Those settings in the tool are there to do just that, so you don’t need to add Blacksmith to the page.

If you still want to do it in Blacksmith I would make sure you’re targeting things a bit more precisely. <li> tags make up a lot more than just an unordered list you might be adding with the List tool. They’re used, for example, in Navigation tools as well. So any styling you apply to an <li> tag could also possibly affect your navigation as well, among other things. Using a unique classname would be a better approach, IMO.

Thank you. I did change the settings in each list in the end. Just wondered if it could be done with Blacksmith as a way to play around with.

Yep, definitely can. As I said I’d just use a classname instead to do it.

1 Like