Cornerstone Custom Icons - X 6.2.1 Pro 2.2.1

Support
#1

Hi Themeco,

Wordpress 4.9.7
Cornerstone Custom Icons 0.1.5

Just testing the latest update of X 6.2.1 and Pro 2.2.1.

Using the Cornerstone Custom Icons by Michael Bourne. When I add the icons following instructrions they seem to install. However when try to view them on Cornerstone Custom Icons page it displays the below error and none of the icons are avialable in the X icon selector.

Warning: Invalid argument supplied for foreach() in wp-content/plugins/cornerstone-custom-icons/includes/template.options.page.php on line 197

I’ve cleared cache, deleted and re-added the icons multiple times.

I understand you don’t make this plugin - just wondered if you have any idea what caused this as it worked before the update.

#2

Hi There,

Font Awesome being updated on this release, this involved changing markup CSS, and file locations, that could be it or another update related changes. Regretfully, we cannot provide support for third-party plugins due to the fact that there is simply no way to account for all of the potential variables at play when using another developer’s plugin. Because of this, any questions you have regarding setup, integration, or troubleshooting any piece of functionality that is not native to X will need to be directed to the original developer.

Pro 2.2.0, X 6.2.0, Cornerstone 3.2.0 – Notes

Thank you for your understanding.

#3

Hi Themeco,

Testing the latest update of X 6.2.2 and Pro 2.2.2.

I figured out how to get Cornerstone Custom Icons working with a change in fontello. However I am experiencing a very strange problem and would welcome any ideas as to the cause.

The custom icons only work in Safari Browser (MacOS 10.13.6) or (iOS 11.4) and in no other browser.

The custom icons DO appear in the X/Pro Icon Selector Tool in all browsers however:

  1. The custom icons do NOT appear once icon is selected from the selector tool - its just a plain white box.
  2. The custom icons do NOT appear In any of X/Pro builders header, footer, content, elements - only empty outline square boxes.
  3. The custom icons do NOT appear in the fromtend of any browser - only empty outline square boxes.

I’ve tested on the following, clearing all caches, restarting etc.

  • MacOS 10.13.6 with Google Chrome, Opera, Firefox - all updated to latest.
  • Windows 10 with Edge, Google Chrome, Opera, Firefox - all updated to latest.
  • Android 8.1.0 with Google Chrome

As I’ve said I’ve contact Michael but would welcome any input.

#4

Hello There,

Glad you have contacted the author of the plugin. As an input, usually if the icon is not showing, either the source is not loaded properly or not the defined. For example, see this screencast: https://screencast-o-matic.com/watch/cFiqjcFEKc. We know that the source of the font fontawesome is loaded properly. So the moment is declaration disabled, it will still not loaded properly. I am not sure how the plugin was coded but usually that how it works with fontawesome icon.

Hope this helps.

#5

Updated to X 6.2.3 and Pro 2.2.3.

I’ve found the cause.

The ethos stack generates ethos.css sets

[data-x-icon-s] {
    font-family: "FontAwesome";
    font-weight: 900;
}

It is the font-weight: 900; causing any Cornerstone Custom Icons not to display in all browsers except Safari.

Is this style set by X / Pro?

#6

Hi @strobley,

Yes, it does from the latest version of Pro/X. I can confirm this too on my Safari, I’ll add this to our issue tracker. For now, you may stick to the workaround that you implemented :slight_smile:

Update: It works on my end, it’s just cache (built-in icons). So perhaps, the plugin author for custom icons needs a different integration for the latest version of theme and FontAwesome.

Thanks!

#7

This will be fixed in the next plugin release.

@alexander has been in touch with me and will be making a small edit to the icon picker markup to make it easier for me target and get those icons appearing in all locations.

After the next Pro release, my plugin will be fully compatible.

#8

Thanks ever so much Michael.

As I’m sure you’re aware data-x-icon-s does actually require font-weight: 900; - https://fontawesome.com/how-to-use/on-the-web/referencing-icons/basic-use

Style - Availability - @font-face weight
Solid - Free - 900
Regular - Pro Required - 400
Light - Pro Required - 300
Brands - Free - 400

For now I’ve just set the style inline.

#9

Hi @strobley,

Good point, and glad that you added the styling inline at the moment… Please stay tuned for the upcoming releases of the theme and Michael’s plugin.

Thank you.

#10

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