How to stop apple replacing a symbol with an emoji?

Hello!  I've just noticed that on apple mobile and tablet OS's the symbol I am using in my Scrolling Marquee header is changing to some horrendous emoji.  See the example below:

How it normally looks: 

how it looks on apple devices (not desktop)

So, I believe I should be about to fix this with some CSS.  But what I've tried (and what I've asked ChatGPT for) doesn't seem to work.  

What I've tried is this:

 /* Prevent Apple devices from using Apple emojis for .Marquee */
.Marquee * {
    font-family: 'officially_funkyregular'
}

(Officially Funky is a custom font I've added.)

Do I need a .no-emoji { section to be added?  that doesn't seem to do anything either unless I'm doing it wrong....

Do I need to have code injection to fix this do you think?

Helpfully someone can help point me in the right direction 🙂

Can you share site url? We can check problem easier.

Thanks!  Yes so here is a good example: https://www.newtondesign.co/timmy-shot-me

You'll see on desktop computers, or android mobile devices the start in the scrolling header renders as it should. But when you look on an iOS device, apple swaps that for a horrible emoji! lol.

I've had a chat with a friend how says it's probably not possible to fix.  So it might very well be I need to just remove the star shape which will be a shame.

I've put in a request for the ability to add an image to the scrolling bar, then we can add our own custom symbols etc.

On 6/24/2024 at 9:28 PM, NewtonDesignCo said:

Thanks!  Yes so here is a good example: https://www.newtondesign.co/timmy-shot-me

You'll see on desktop computers, or android mobile devices the start in the scrolling header renders as it should. But when you look on an iOS device, apple swaps that for a horrible emoji! lol.

I've had a chat with a friend how says it's probably not possible to fix.  So it might very well be I need to just remove the star shape which will be a shame.

I've put in a request for the ability to add an image to the scrolling bar, then we can add our own custom symbols etc.

You can try this approach to add icon to Scrolling Block

Gosh thank you, I'll give that a go an report back!