X_icon for Social Buttons changed

When updating to the latest release of the X Theme, the social icon images changed.

They went from

How do I change them back?

To:

Hello @rstigers,

Thanks for writing in!

It appears that you are using icon shortcodes inside a text widget. Please make sure that the icons does not reference to the square icons.

It you would not mind, please provide the code you have added in the text widget when you next reply.

Regards.

That is the way the shortcode appears in the widget. Google Console in the Browser shows it this way:

The forum is not allowing me to post how it appears in the widget. I guess I am too new to be able to post more than one link or shortcode. So, I don’t know how to respond to your question.

Hi There @rstigers

You can use a 3rd party image hosting tool to share your screenshots (https://snag.gy/). When you’re using icon shortocdes, there are couple of variations that you can use.

For example
[x_icon type="facebook"]
will output the following

And
[x_icon type="facebook-square"]
will output the following

You can check all those examples from here (http://demo.theme.co/integrity-1/shortcodes/icons/).

If you’re still having issues, please provide us with an example page URL to check your issue further.

Thanks!


As you can see it does not render what is expected if you look at the beginning of the thread.
Here’s the issue, I inherited this website and registered the theme. I migrated the site to a development site and password protected the directory so Google wouldn’t index it. The original designer, did not install a Child Theme. I installed a child theme first and activated. I then updated the parent theme. Somethings changed. These widgets being one of them.

I have the codes as you have instructed, and it is not producing the correct output. The live site you have access to as you can see from my license. www.sparkheadstudios.com. The live site has not been updated until I can figure out the problem.

If you use the browser ‘F12’ Console to view the elements on the live site, I am not showing any custom CSS.

Since a child theme was not originally used and just updating the site without a child theme, I get the same results. So, I am a lost puppy in tall grass.

If there is a way to share the Password protected credentials privately, I would supply the credentials so that you could view first hand what is occurring.

Hi @rstigers,

I checked and can see you have wp rocket installed.

Please try to clear the cache of wp rocket and check again.
If that doesn’t help, please provide us your wordpress admin login in Secure Note

Thanks

I cleared the cache… no change. I have supplied backend login credentials

Hi @rstigers,

The new version uses a new version of font awesome library too and you can see them here https://fontawesome.com/icons?from=io

I created another widget on your staging site with the icons (and their icon codes counter part). And unfortunately, the youtube one doesn’t have that available now. You can check it here https://fontawesome.com/icons?d=gallery&q=youtube

The idea is having a base icon HTML <i class="x-icon"></i> while defining the icon cide through data-x-icon-b. Example, let’s say twitter https://fontawesome.com/icons/twitter?style=brands

<i class="x-icon" data-icon-b="&#xf099;"></i>

There are other variants too, here are the completely list

data-icon-o data-icon-s data-icon-b

O for original and regular icons, B for brands (like twitter, facebook, etc.), and S for solid icons.

Thanks!

Ok, that solution seems to have resolved the issues. I don’t know if I should open another thread or not, but since this thread contains all of the login credentials, I have one last issue. When I upgrade the site to 7.1 PHP version, I lose the homepage. The site is currently set to 7.1 and you can see that from the dashboard, all of the information is still there, but does not render. any suggestions for that?

Forgot to mention that the live site is running on php 5.6. And the development site was the test ground to 7.1 which didn’t work.

Hi @rstigers,

It seems the Toolset View plugin isn’t compatible with 7.1. Please deactivate it and your home page will work again.

Thanks!

Thanks. That resolved that issue. I was ready to release the website back to the client and they tell me that I have lost the fonts. On the Homepage, the Headers are supposed to be Walkway-blackregular. That is in the CSS as:
.walkway {
font-family: ‘walkway_blackregular’;
}
But if you compare the staged site with the live site, the Headers (ie. Branding, Photography, Website Design, Graphic Design and Copywriting) aren’t the same. As you scroll down the Home page, the other Headers Web Design, Photography, etc. don’t look the same. So something is wrong with the fonts and I can’t figure out why they would look different.
This is also happening on several of the interior pages (ie. Our Work Page.) it is completely 2 different fonts. The same thing is happening to the Context under the header. A different font is represented on the Development Site versus the live site.
The X-theme is currently the active theme on the development site, and not the Child Theme. It doesn’t matter which theme is activated. The fonts have changed.
On the live site, I have disabled the Toolkit Plugin and upgraded to PHP 7.1 and it did not impact the fonts. So I have done as much trouble shooting as I know to do. The Toolkit Plugin has nothing to do with the fonts.

Hi @rstigers,

Your font files are missing in your staging. This is the CSS

@font-face {
    font-family: 'walkway_blackregular';
    src: url('/fonts/walkway_black-webfont.woff2') format('woff2'),
         url('/fonts/walkway_black-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

And the files are supposed to be here

https://sparkdev.proimpactllc.net/fonts/walkway_black-webfont.woff2
https://sparkdev.proimpactllc.net/fonts/walkway_black-webfont.woff

And these are working on live one

https://sparkheadstudios.com/fonts/walkway_black-webfont.woff2
https://sparkheadstudios.com/fonts/walkway_black-webfont.woff

Re-uploading them should make it work.

Thanks!

Perfect. I totally missed that. All in One Migration didn’t pull that folder over from the live site.Since I am having trouble with fonts, can you tell if the Lato Font is activate. It was not in the Font Folder and I am assuming it was part of the theme files.

body, input, button, select, textarea {
font-family: “Lato”,sans-serif;
}

Hey @rstigers,

This code is generated by your setting from the Theme Options so if you want to override it, you cn use the custom CSS.

Glad to hear it’s sorted.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.