Support » Plugin: Advanced Custom Fields: Font Awesome Field » Upgrading to FontAwesome 6 icons!

  • Plugin Author Matt Keys

    (@mattkeys)


    Version 4.0 of this plugin brings along with it support for FontAwesome 6 icons. If you are an existing user of this plugin there are a couple considerations you may want to think about when you upgrade.

    Backwards Compatibility with FontAwesome 4.x/5.x Icons

    The team at FontAwesome did an amazing job on their end with FontAwesome 6 backwards compatibility. If you already have icons from a previous version displaying on the frontend of your site, they will continue to work after upgrading.

    However with this plugin there are some extra complexities to consider. In the latest version of this plugin changes needed to be made in how your icon selections are stored in WordPress. This means that icon selections you made prior to switching to FontAwesome 6 need to be updated in the database. This update would need to happen when you are updating one of your post/pages that are using an icon selected with and older version of this plugin.

    ACF Font Awesome Compatibility Mode

    To make this migration easier there is a new “Compatibility Mode” which is enabled by default for users who are upgrading from a previous version of this plugin and using FontAwesome 6 icons. When compatibility mode is enabled, and you visit an admin page using an icon that needs updating, it will automatically attempt to update the icon to the newest format. These changes will be saved when the post/page is saved and the update will not need to happen again for that icon.

    However there are some cases where it may not be able to automatically update these icons

    1. The most common reason an update might not happen automatically, is that due to some limitations of the FontAwesome APIs, I am only able to update the ‘free’ icons. Pro icons will need to be manually updated.
    2. If there is no longer a direct match for an older icon in the latest version of FontAwesome (pretty rare as there are only a couple icons no longer present in FontAwesome 6)

    ACF Font Awesome Reselect Icon

    In the case that an icon is not able to be fixed automatically, this plugin will highlight the icon to let the editor know that it needs to be updated. Whenever possible it will also output the ‘style’ and the ‘name’ of the previously selected icon to help you find the best match in FontAwesome 6.

    Using FontAwesome Kits

    With FontAwesome 5.x icon sets, this plugin used the FontAwesome Pro CDN for delivering these pro icons to WordPress. Starting with FontAwesome 6.x this CDN will no longer be receiving updates for Pro icons.

    Going forward this plugin uses FontAwesome Kits which are available for both Free and Pro accounts. These kits give you additional control over how you want your FontAwesome icons loaded. And in the case of Pro accounts it gives you access to all of your Pro-only icons, and the ability to upload and use your own custom icons.

    To enable your kits in this plugin:

    1) Enter your API Key from your FontAwesome Account page into the FontAwesome Settings of this plugin:

    ACF Font Awesome API Key

    ACF Font Awesome API Key

    2) After savings your settings the page will validate your API key, and load any available kits you’ve created.

    ACF Font Awesome Kits

    3) Select the kit that you want to use with this plugin.

    Active Icon Sets

    ACF Font Awesome Icon Sets

    After upgrading to FontAwesome 6.x, it is worth revisiting your Advanced Custom Field settings for your FontAwesome icon fields. Specifically you should look at the Icon Sets option.

    This plugin will attempt to automatically enable the same icon sets you may have been using with FontAwesome 5.x. However FontAwesome 4.x users will not have made those selections.

    Additionally FontAwesome 6.x has a couple of new icon set choices available. ‘Thin’ icons, as well as the ability to use ‘Custom’ icons uploaded through your FontAwesome Pro account.

    Icon Set Builder

    ACF Font Awesome Icon Sets

    The icon set builder is now upgraded to use the new icon search tool just like the FontAwesome fields in ACF. This tool will make loading the FontAwesome settings page much quicker, and should make it easier to find the icons you are looking for.

    The icon sets created with this tool are unique to each FontAwesome version, and are not automatically converted when switching to a new version of FontAwesome. After switching to FontAwesome 6.x icons you will need to recreate any custom icon sets you want to continue using.

    • This topic was modified 3 months, 2 weeks ago by Matt Keys.
Viewing 2 replies - 16 through 17 (of 17 total)
  • Plugin Author Matt Keys

    (@mattkeys)

    Hi @twilocreative sorry you are having issues. I haven’t run into that issue yet with other users of this plugin. This plugin calls out to the FontAwesome GraphQL API with the API key you provide it. If successful it gets a token we can use to make requests. If unsuccessful you get the error you are seeing.

    I’d like to help you figure this out. However this announcement thread for the new version of this plugin is getting long/unfocused for solving new support issues. It also makes it hard for people with the same issue as you to find the conversation/support.

    Would you mind creating a new support thread for this?

    Alguma resolução para esse problema?

    Estou passando por algo bem semelhante onde a pesquisa não aparece nada, aparecendo um erro de script ao tentar listar os icones.
    “E esta aparecendo o seguinte erro: Uncaught Error: No select2/compat/dropdownCss”

    ——————————-

    Estou com problemas, meu ACF pro esta atualizado com a ultima versão e além disso, uso o Poly lang + loco translate para fazer a tradução do meu site, tudo esta funcionando normal ja dessa forma. Talvez depois de alguma atualização do ACF ou com a ultima versão mesmo do plugin 4.0.1, parou de carregar a lista de ícones para conseguir selecionar.
    Ja exclui todos que estavam dando mensagem de incompatibilidade para fazer manualmente porém não esta funcionando do mesmo jeito.

    Já coloquei minha API token, e selecionei meu kit cadastrado com a V6 no site, e tbm selecionado no plugin… porém não consegui achar nenhum script de carregamento pelo inspecionar também e continua sem chamar meus ícones salvos no banco, só mostra se eu colocar via código mesmo a cdn etc… Pela opção do ACF não consegui deixar para carregar o script no footer nas paginas que aparecerem os ícones para testarem , devido a essa problema de não carregar a listagem

    Em meu console esta carregando todos os arquivos do plugin normalmente, então acredito que não seja problema com a tradução.

    E esta aparecendo o seguinte erro: Uncaught Error: No select2/compat/dropdownCss

    Não tenho como mandar link, por que o problema é na pagina de ACF options, criada para definir algumas coisas do tema, como as redes sociais que não aparecem os ícones.`

Viewing 2 replies - 16 through 17 (of 17 total)
  • You must be logged in to reply to this topic.