Return to previous page

Fonts awesome - by jeroenberings - on WordPress WooCommerce support

This topic has 8 replies, 2 voices, and was last updated 7 years, 3 months ago ago by Rose Tyler

jeroenberings

Participant

September 21, 2017 at 13:57

1. I try to add a awesom font in menu field “ico name. I tried different syntaxes. Noothing works. What should I use for example <i class=”fa fa-telegram” aria-hidden=”true”></i>. See screenshot https://ibb.co/n5S5Jk

2. In menu with child options a small arrow in grey is present. How kan i change this arrow (different image, color, size). See screenshot https://ibb.co/db9D4Q

#173100 Copied Theme version: 4.6 WooCommerce version: 3.1.2

7 Answers
Rose Tyler

Support staff

September 21, 2017 at 14:10
Hello,

1. Please check this screenshot as example https://prnt.sc/gl1wqz
2. You may use custom css, for example, add this code in Theme Options > Styling > Custom css:
```
.product-categories
 .fa-angle-down:before {
    content: '\f2c1' !important;
    color: red !important;
    font-size: 20px !important;
}
```
http://prntscr.com/gnwpud

Regards
#173101 Copied
jeroenberings

Participant

September 21, 2017 at 14:30

1. I added GIFT in menu item as you suggested. Still no result in frontend. Screenshots:

https://ibb.co/g7YZB5
https://ibb.co/ieOqjQ

Login credentials added in private content if needed.

Please, contact administrator
for this information.

#173103 Copied Theme version: 4.6 WooCommerce version: 3.1.2
Rose Tyler

Support staff

September 21, 2017 at 14:43
This option works for menu, but you use woocommerce widget here http://prntscr.com/gnx2r8 http://prntscr.com/gnx2uq, I’ve added menu widget into your custom sidebar http://prntscr.com/gnx47y but stylings of this element are different http://prntscr.com/gnx4ol Please check.
if you want to use category element, you may add this code in custom css http://prntscr.com/gnx7f2:
```
.home .widget_product_categories.sidebar-widget ul li:first-child a:before {
    font-size: 16px;
    color: #999;
    font-family: 'FontAwesome';
    display: inline-block;
    content: "\f2c1";
    margin-right: 10px;
}
```
Regards
#173106 Copied
jeroenberings

Participant

September 21, 2017 at 16:21

Thank you. Almost ok now. I added black circle arrow. When clicking it twice it changes in original (unwanted) smaal, grey arrow down again.

https://ibb.co/iNBDok
https://ibb.co/iqnm8k

#173127 Copied Theme version: 4.6 WooCommerce version: 3.1.2

Rose Tyler

Support staff

September 21, 2017 at 16:28

Please check now.

Regards

#173130 Copied

jeroenberings

Participant

September 21, 2017 at 17:13

Still the same. After 2 clicks on arrow it changes in other image.

#173132 Copied Theme version: 4.6 WooCommerce version: 3.1.2
Rose Tyler

Support staff

September 22, 2017 at 08:37
Hello,

Sorry, please change this code http://prntscr.com/go89x3 to:
```
.widget_product_categories.sidebar-widget ul .open-this:before, .wpb_widgetised_column .widget_product_categories ul .open-this:before, .widget_nav_menu.sidebar-widget ul .open-this:before {
    content: '\f0ab' !important;
    color: #000 !important;
    font-size: 30px !important;
}
```
Regards
#173163 Copied
Tagged: awesome, fonts, templates, woocommerce, wordpress
Viewing 8 results - 1 through 8 (of 8 total)