[Tansenn]

Hi there!

I updated to 3.1 and my icons for the menu have disappeared. Also, the bottom right to get back to the top menu is gone. It too is a grey empty square.

This is the case for my original PHP of 8.3.30 or my new 8.4.19

What is my resolution for my icons? I’ve tried clearing caches but it doesn’t seem to help.

See: Freeflowrambling.com

Thanks!

[sujapati]

@Tansenn:
It looks like your site is using Elementor, which is likely causing the issue. Our theme includes Font Awesome version 6.7.2, and this version may not be fully compatible with Elementor at the moment. As a result, some icons may not display correctly on your site.

To resolve this, you can try adding the following CSS:

.social-navigation a:before,
#feature-slider .cycle-prev::before,
#feature-slider .cycle-next::before,
#logo-section .cycle-prev::before,
#logo-section .cycle-next::before,
#to_top_scrollup,
#scrollup,
.posted-on a::before,
.byline a::before,
.cat-links span+a::before,
.tags-links span+a::before,
.comments-link a::before,
.edit-link a::before,
.fa-collapse:before,
.fa-solid:before,
.fa-brands:before,
#promotion-section .button.play-button:before,
.pagination .prev span:before,
.pagination .next span:after,
.gallery-item .gallery-icon a:after,
.tiled-gallery .tiled-gallery-item a:after,
.comment-meta .comment-permalink:before,
.site-header-cart .cart-contents:before,
.mejs-button button:before,
.audioman-mejs-container.mejs-container .mejs-button button:before,
.nav-next .nav-subtitle:after,
.nav-previous .nav-subtitle:before,
.cat-links span + a:before,
.tags-links span + a:before,
.wp-custom-header-video-button:before,
.search-toggle:before, .menu-toggle:before,
.menu-toggle-close:before,
.main-navigation .menu-item-has-children > a:after,
.main-navigation .page_item_has_children > a:after,
.dropdown-toggle:after, .search-submit:before,
#feature-slider-section .cycle-prev:before,
#feature-slider-section .cycle-next:before,
#testimonial-content-section .cycle-prev:before,
#testimonial-content-section .cycle-next:before,
.entry-breadcrumbs a:after,
.comment-reply-title small a:before, #scrollup:before {
    font-family: "FontAwesome" !important;
    font-weight: 900;
}
.social-icons .font-awesome {
    display: inline-block;}

Go to Dashboard → Appearance → Customize → Additional CSS.
Paste the provided CSS code into the Additional CSS field, and the issue will be resolved.

Regards,
Sujapati

[Author]

Posts