Comments claudine started the conversationJuly 5, 2015 at 5:16pmHello,How could I change icons in the service section? I would like to use my own icons but doesn't work.Thanks 2,006Support repliedJuly 6, 2015 at 7:58pmHello, check first if there is a font awesome icon which suits you:http://fortawesome.github.io/Font-Awesome/icons/then just paste the icon class (\'fa fa-leaf\' for example) in the shortcodeotherwise you will have to add your own icons styles to the themethanksThank you. Clapat Support Review Envato Item Support Policy Follow us! https://www.clapat.com/https://www.facebook.com/clapat.ro https://www.instagram.com/clapat.themes/https://x.com/clapatdesignhttps://www.linkedin.com/company/clapatstudiohttps://www.tiktok.com/@clapatstudioclaudine repliedJuly 6, 2015 at 9:47pmHello thanks for the reply.My icons are too specific and I couldn\'t find something similar in font-Awesome. I designed one icon with the same size but it isn\'t working in the template (screenshot). Do you know can I integrate my icon? Do you have any solution?Thanks 2,006Support repliedJuly 7, 2015 at 12:54amHello,Try uploading the files somewhere as a subfolder of the theme and then use @font-face to create a font family.And then simply add the font-family style for each element you want to have that font.See here for a description of the process:http://premium.wpmudev.org/blog/custom-fonts-css/You can edit style.css or use theme options Styling Options -> Custom CSSthanksThank you. Clapat Support Review Envato Item Support Policy Follow us! https://www.clapat.com/https://www.facebook.com/clapat.ro https://www.instagram.com/clapat.themes/https://x.com/clapatdesignhttps://www.linkedin.com/company/clapatstudiohttps://www.tiktok.com/@clapatstudioclaudine repliedJuly 11, 2015 at 1:29amHello, thanks for your help.I have created my font face with IcoMoon and add the font-family. I have added to custom CSS but it is still not working.bellow my custom css:@font-face { font-family: \'iconsb\'; src:url(\'fonts/iconsb.eot?-npkg3f\'); src:url(\'fonts/iconsb.eot?#iefix-npkg3f\') format(\'embedded-opentype\'),url(\'fonts/iconsb.ttf?-npkg3f\') format(\'truetype\'),url(\'fonts/iconsb.woff?-npkg3f\') format(\'woff\'),url(\'fonts/iconsb.svg?-npkg3f#iconsb\') format(\'svg\'); font-weight: normal; font-style: normal;}[class^=\"icons-\"], [class*=\" icons-\"] { font-family: \'iconsb\'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}.icons-icons1:before { content: \"\\e600\";}.icons-icons2:before { content: \"\\e601\";}.icons-icons3:before { content: \"\\e602\";}.icons-icons4:before { content: \"\\e603\";}http://s581887304.onlinehome.fr 2,006Support repliedJuly 11, 2015 at 4:49amWhat\'s the page url?Thank you. Clapat Support Review Envato Item Support Policy Follow us! https://www.clapat.com/https://www.facebook.com/clapat.ro https://www.instagram.com/clapat.themes/https://x.com/clapatdesignhttps://www.linkedin.com/company/clapatstudiohttps://www.tiktok.com/@clapatstudioclaudine repliedJuly 11, 2015 at 12:24pmHello,The page url is http://s581887304.onlinehome.fr/specificationsThanks 2,006Support repliedJuly 13, 2015 at 8:23pmAdddisplay: inline-block;property to[class^=\"icons-\"], [class*=\" icons-\"] {Thank you. Clapat Support Review Envato Item Support Policy Follow us! https://www.clapat.com/https://www.facebook.com/clapat.ro https://www.instagram.com/clapat.themes/https://x.com/clapatdesignhttps://www.linkedin.com/company/clapatstudiohttps://www.tiktok.com/@clapatstudio Sign in to reply ...
Hello,
How could I change icons in the service section? I would like to use my own icons but doesn't work.
Thanks
Hello, check first if there is a font awesome icon which suits you:
http://fortawesome.github.io/Font-Awesome/icons/
then just paste the icon class (\'fa fa-leaf\' for example) in the shortcode
otherwise you will have to add your own icons styles to the theme
thanks
Thank you.
Clapat Support
Review Envato Item Support Policy
Follow us!
https://www.clapat.com/
https://www.facebook.com/clapat.ro
https://www.instagram.com/clapat.themes/
https://x.com/clapatdesign
https://www.linkedin.com/company/clapatstudio
https://www.tiktok.com/@clapatstudio
Hello thanks for the reply.
My icons are too specific and I couldn\'t find something similar in font-Awesome. I designed one icon with the same size but it isn\'t working in the template (screenshot). Do you know can I integrate my icon? Do you have any solution?
Thanks
Hello,
Try uploading the files somewhere as a subfolder of the theme and then use @font-face to create a font family.
And then simply add the font-family style for each element you want to have that font.
See here for a description of the process:
http://premium.wpmudev.org/blog/custom-fonts-css/
You can edit style.css or use theme options Styling Options -> Custom CSS
thanks
Thank you.
Clapat Support
Review Envato Item Support Policy
Follow us!
https://www.clapat.com/
https://www.facebook.com/clapat.ro
https://www.instagram.com/clapat.themes/
https://x.com/clapatdesign
https://www.linkedin.com/company/clapatstudio
https://www.tiktok.com/@clapatstudio
Hello,
thanks for your help.
I have created my font face with IcoMoon and add the font-family. I have added to custom CSS but it is still not working.
bellow my custom css:
@font-face {
font-family: \'iconsb\';
src:url(\'fonts/iconsb.eot?-npkg3f\');
src:url(\'fonts/iconsb.eot?#iefix-npkg3f\') format(\'embedded-opentype\'),
url(\'fonts/iconsb.ttf?-npkg3f\') format(\'truetype\'),
url(\'fonts/iconsb.woff?-npkg3f\') format(\'woff\'),
url(\'fonts/iconsb.svg?-npkg3f#iconsb\') format(\'svg\');
font-weight: normal;
font-style: normal;
}
[class^=\"icons-\"], [class*=\" icons-\"] {
font-family: \'iconsb\';
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icons-icons1:before {
content: \"\\e600\";
}
.icons-icons2:before {
content: \"\\e601\";
}
.icons-icons3:before {
content: \"\\e602\";
}
.icons-icons4:before {
content: \"\\e603\";
}
http://s581887304.onlinehome.fr
What\'s the page url?
Thank you.
Clapat Support
Review Envato Item Support Policy
Follow us!
https://www.clapat.com/
https://www.facebook.com/clapat.ro
https://www.instagram.com/clapat.themes/
https://x.com/clapatdesign
https://www.linkedin.com/company/clapatstudio
https://www.tiktok.com/@clapatstudio
Hello,
The page url is http://s581887304.onlinehome.fr/specifications
Thanks
Add
display: inline-block;
property to
[class^=\"icons-\"], [class*=\" icons-\"] {
Thank you.
Clapat Support
Review Envato Item Support Policy
Follow us!
https://www.clapat.com/
https://www.facebook.com/clapat.ro
https://www.instagram.com/clapat.themes/
https://x.com/clapatdesign
https://www.linkedin.com/company/clapatstudio
https://www.tiktok.com/@clapatstudio