Numbers instead of icons on recordings

  • Hi,

    I encounter a strange issue on my website. Sometimes when I watch recordings of visitors on my website (mostly from mobile users), I can see that some arrow icons on my website are being replaced with numbers (for example the page switching arrows on category pages or dropdown arrow from product sort form).

    The strange thing is that this never happens to me when I am browsing the site. I also tried to reproduce this error on 3 other mobile phones and did not manage to. Could this be a rendering issue from the recording plugin (Mouseflow) or this display issue really exists and it randomly shows up? How can I find this out?

    If this issue really exists, I think it might be related to the fact that my theme offers the possibility to deactivate some icon packs on the website in order to speed it up. I am currently using this feature, but why some people can see the icons correctly though? Can you see the arrows or numbers if you are browsing from mobile?

    Here is an example

    EDIT: I found out that if I browse my website through this tool, I can also see numbers instead of arrows: https://ready.mobi/

    • This topic was modified 3 years, 1 month ago by popos93.
    • This topic was modified 3 years, 1 month ago by popos93.
    • This topic was modified 3 years, 1 month ago by popos93.
    • This topic was modified 3 years, 1 month ago by popos93.

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)

  • Hi @popos93, the problem is not strictly related to WordPress. I tested your page and I found your theme is using a font-face for the arrow icons for example.

    An icon font-face is like any other font but instead of having the traditional characters (a,b,c,etc…), it has icon shapes linked to a particular character. In your case, you are using the ‘Elegant Icons’ font. The back arrow is ‘represented’ by the character ‘4’ and the next arrow is linked to the ‘5’ character.

    To display the desired arrow shapes the font should be loaded in the browser. If the font-face is not loaded yet you will see the ‘4’ and ‘5’. This normally happens quickly so you don’t see the ‘4’ and ‘5’ but if for some reason the font hasn’t loaded yet you will see those characters, mobile devices are generally slower so they take more time to download and display the fonts.

    You have several options to improve/change that. The possible optimizations goes from speeding up the loading of this font in some way, to removing it for those buttons and use the just the ‘<‘ and ‘>’ characters instead of an icon for that.

    I hope this helps!

Viewing 1 replies (of 1 total)
  • The topic ‘Numbers instead of icons on recordings’ is closed to new replies.