Good day,
I've setup a WordPress website and selected a theme (Metrolo) plus WooCommerce. The menu items should have a down arrow (\f0d7) I think this is set by the theme. The arrow is not showing, only an empty box.
I inspect the css and see this:
.sf-menu.sf-arrows .sf-with-ul:after {
font-family: FontAwesome;
font-weight: normal;
font-style: normal;
text-decoration: inherit;
speak: none;
-webkit-font-smoothing: antialiased;
vertical-align: middle;
content: "\f0d7";
float: right;
margin-left: 5px;
}
What I've read so far is that it doesn't seem to be the Theme or WordPress but an hosting issue.
The only access I have to the back-end of the site is via a cpanel.
Based on our comments, it seems that the font-awesome
stylesheet has not been enqueued on your website.
You can easily rectify this by enqueuing it yourself either through the theme files, or a custom plugin:
Enqueuing through your theme files:
Add the following lines in your functions.php file:
add_action( 'wp_enqueue_scripts', 'so_my_custom_scripts' );
function so_my_custom_scripts() {
wp_enqueue_style( 'llt-google-fonts', 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css?ver=4.9.6' );
}
Enqueuing through a custom plugin:
If you don't have access to your functions.php file, or you aren't using a child theme and are not willing to risk adding this in your main theme, you could always add your own plugin to enqueue it for you.
Add the following to code to a blank php file named mcfae.php
inside a folder named mcfae
and upload that folder to your plugin directory via ftp, or zip the folder and upload from within the plugin dashboard.
<?
/*
Plugin Name: My Custom Font Awesome Enqueuer
Plugin URI: https://stackoverflow.com/a/50832019/6049581
Description: Ensures that Font Awesome is enqueued.
Version: 1.0.0
Text Domain: mcfae
Author: TungstenX
Author URI: https://stackoverflow.com/a/50832019/6049581
*/
add_action( 'wp_enqueue_scripts', 'mcfae_enqueue_scripts' );
function mcfae_enqueue_scripts() {
wp_enqueue_style( 'llt-google-fonts', 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css?ver=4.9.6' );
}