To add phone, email icon to Header Social Icons, you can follow these.
#1. Edit Site Header
#2. Click to edit Social Icons
#3. Click Add Social Link
#4. Use this format to add Phone
tel:0123456789
and this format to add Email
mailto:[email protected]
We will have
#5. Use this code into Code Injection > Header (If your plan doesn’t support Code Injection, you can add it via Code Block in Site Footer)
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css" integrity="sha512-KfkfwYDsLkIlwQp6LFnl8zNdLGxu9YAA1QvwINks4PhcElQSvqcyVLLD9aMhXd13uQjoXtEKNosOWaZqXgel0g==" crossorigin="anonymous" referrerpolicy="no-referrer" />
#6. Use this code to Custom CSS box
header#header a[href*="tel"]:before { content: "\f095"; font-family: "Font Awesome 6 Free"; font-weight: bold; font-size: 20px; } header#header a[href*="mailto"]:before { content: "\f0e0"; font-family: "Font Awesome 6 Free"; font-weight: bold; font-size: 20px; } header#header a[href*="tel"] svg, header#header a[href*="mailto"] svg { display: none; }
#7. Result