How can I change the file upload icon to image in Chronoform 8, for example using a template override or CSS?
Enable the Field Class behavior for your field and set any class.
Then use a CSS like this one:
.field_class label svg{
display:none;
}
.field_class label::before{
// whatever css for your new image here
}
Thank you so much for your information!
Hiding the file icon works, but I haven't been able to insert a different icon using this:
`.upload_icon_dis label::before { `content: '<svg class="fasvg icon image" xmlns="http://www.w3.org/2000/svg"</svg>';`
or similar CSS entry. What do I need to change?
Hi Flamingo
This is not a correct content property, here is an example of a correct one:
content: url('data:image/svg+xml; utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M464 256A208 208 0 1 0 48 256a208 208 0 1 0 416 0zM0 256a256 256 0 1 1 512 0A256 256 0 1 1 0 256z"/></svg>');
You can get the <svg code from Font awesome or other icon libraries.
