Description of the need
Sometimes it's required to use a search symbol instead of text in the search forms button. A possibility to use FontAwesome or locally stored icons would be practical.
Because for the search form button a <input type="submit">
is used, it's not possible to style it, using pseudo elements like :before
or :after
.
Proposed solution
It't would be required, to use a <button type="submit">
instead. This would also be better for semantic reasons.
Alternatives that have been considered
An alternative could be to create a view or custom block, which replaces the "Search form" block.
There is also a module Custom Search which allows to add an image to the Submit button, but not to use FontAwesome.
Another possibility if only a picture is required: add a backgound like .class { background: url('path/icon.svg'); }
.
You have to realize, that background-image:
does not work! (which makes no sense though ...).
This works also not for FontAwesome or other symbol libraries.
Additional information
Draft of feature description for Press Release (1 paragraph at most)
Backdrop now allows to style the Search Form Sumit Button.
Recent comments
If it's in a field or a node body, you can use the Markdown text filter in this module: https://backdropcms.org/project/markdown
Parse and render markdown
I don't think this answers your question, but it might help someone with a related question. The layout template for any given layout is stored in config and you can programmatically...
How to programmatically change layout?
perfect, thank you
Edit Node fields