topic Re: fa-chevron-up displays in grey before website loads in CMS Development

fa-chevron-up displays in grey before website loads

Jo-S — Mon, 17 Apr 2017 21:07:43 GMT

Hi Guys

Our website uses Skyline theme and before it loads, it always displays some grey lettering that includes fa-chevron-up.

Any clues as to how we can stop that from happening before the actual website displays?

https://www.lollipoplocal.co.uk

Re: fa-chevron-up displays in grey before website loads

kejoff — Tue, 18 Apr 2017 14:50:50 GMT

You should have a look at your CSS and in particular the .fa-chevron-up class to remove it.

Re: fa-chevron-up displays in grey before website loads

DaniellePeters — Tue, 18 Apr 2017 15:23:14 GMT

There is JavasScript that grabs the short code [fa-chevron-up] and changes it to be

<i class="fa fa-chevron-up"></i> so that the Font Awesome icon renders. The issue here is that the load time is relatively long, so you briefly see the shortcode before the icon is rendered. The fix here would be to go into the Custom HTML module labeled Back to Top in the global group called Skyline Footer and update the code from

<a href="#">[fa icon="chevron-up"]</a>

<a href="#"><i class="fa fa-chevron-up"></i></a>

For future reference, it appears that the current version of the Skyline theme has been updated with this same fix.

Re: fa-chevron-up displays in grey before website loads

Jo-S — Wed, 19 Apr 2017 09:22:17 GMT

Many thanks @DaniellePeters - this worked a treat. For anyone else REMEMBER to apply the fix to ALL clones of your footer. That had us cussing for a while 😮

As an aside, if there are updates to the main Skyline theme, is there a way to apply these to our old css without breaking our existing site?

Re: fa-chevron-up displays in grey before website loads

Jo-S — Wed, 19 Apr 2017 09:22:59 GMT

Thanks @kejoff - See @DaniellePeters solution as that worked for us.