Elementor Gallery issue [closed]

Question

My client decided to take it upon himself to change his domain and but when he did that, it corrupted most of the website. I managed to fix most of it but there is one error i cannot fix. When the user clicks on a picture it loads the picture fine but the left,right, and X on top are replaced with a box as seen here Example . Has anyone encountered this and how did you fix it? Every icon in elementor is displaying this but I want to fix the gallery icons more than anything

Here is the link to the site http://thedetailpro.com/boat-yacht-detailing/.

Answer 1

You're seeing that 'not found' box, because fontawesome is not fully loaded.

Use browser developer tools to find errors like this.

In Chrome, go to website, press F12 (MAC: Command+Option+J), Developer Tools will open.

Click the Console tab, there you can see the client-side errors. When i do this for your site i see the following fontawesome error:

Access to Font at 'http://www.thedetailpro.com/wp-content/plugins/elementor/assets/lib/font-awesome/fonts/fontawesome-webfont.woff2?v=4.7.0' from origin 'http://thedetailpro.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://thedetailpro.com' is therefore not allowed access.

This error is new to me, it's a server setup error.

A quick Google search, see this.

Regards, Bjorn

p.s. don't forget to charge your client for this F** up ;-)

Answer 2

it's because the Client Browser Policy through MaxCDN. You can either disable CORS header support in your CDN or add an exclusion for the files that are loaded.