Phone Icon in Header

kris
Inactive member
Topic Author
New Member

1 year 10 months ago #50202 by kris

Phone Icon in Header was created by kris

Want to change from the Phone contact to the email icon and details in the header... can't see where / how to change this. I can change the actual number, but don't know how to swap the phone icon for an email. Thanks!

Please Log in to join the conversation.

milos
Support Staff
Moderator

1 year 10 months ago #50203 by milos

Replied by milos on topic Phone Icon in Header

Hello,

The phone icon is defined in the file /media/templates/site/pub/css/custom.css here:

Code:

.mp_top1 p::after {
    content: "\f095";
    font-family: "Font Awesome 5 Free";
    font-weight: 700;
    display: inline-block;
    width: 40px;
    height: 40px;
    margin-left: 15px;
    background: #fff;
    border-radius: 50%;
    line-height: 40px;
    text-align: center;
    color: var(--sparkycolor2);
}

So, you can change the "content" line to use a different icon. All Font Awesome icon codes are listed here: fontawesome.com/v5/search

Click any icon and copy Unicode in the "content" line. Don't forget quotes and \ before the icon code.

Regards,
Milos

Please Log in to join the conversation.

Time to create page: 0.167 seconds