Display telephone number in header under shop icons

samr66 · ‎06-27-2025

Hi,

I would like to add my telephone number in the header of my website underneath shop icons (basket, search, wishlist, account) to display only on desktop device and central with logo and menu,

Call: 0333 335 6188

I want to display this in a black box with white text. I did have a custom code but I have lost it. Can anyone help me with this?

url - thescentedmeltshop.com - password is: shop90.

Many thanks,

Sam

The_ScriptFlow · ‎06-27-2025

Hey @samr66,

In order to show the phone number on the header required to do the custom code. Would you like to share the collab code in the p/m or via the detail in the signature below so that I can take a look and add the custom code to show the phone number.

Thanks

- Need a Shopify Specialist? Chat on WhatsApp Or Email at info@thescriptflow.com
- For any custom section queries, bug fixing please visit: Level 2 Fiverr Profile
- Buy Me a Coffee? Nah… Let’s Upgrade to a Car
- If my solution was helpful, mark it as a solution and hit the like button!

samr66 · ‎06-27-2025

Hi,

I have sent you a private message with the code.

Thanks,

Sam

Guleria · ‎06-27-2025

Hello Sam,

Great idea to add telephone number in the header.

Please check the theme settings if there is any option available there to add it.

Alternatively you have to go with a developer because it needs customization.

Regards
Guleria

- Elevate Your Store with Expert Shopify Services. Email: guleriathakur43@gmail.com - Need a quick fix or a tailored customization? I’ve got you covered.
- Looking to enhance your pages? Try GEMPAGES- a powerful drag & drop page builder.
- Let’s make your store stand out. Get in touch today!
- My Apps: Productify Groups – Smart product grouping made easy.

AiTrillion · ‎06-27-2025

Hi @samr66 ,

Please paste the below code and phone number will appear below the icons

<details-modal class="header__search">
<details>
<summary class="header__icon header__icon--search header__icon--summary link focus-inset modal__toggle" aria-haspopup="dialog" aria-label="Product Search" role="button">
<span>
<span class="svg-wrapper"><svg fill="none" class="icon icon-search" viewBox="0 0 18 19"><path fill="currentColor" fill-rule="evenodd" d="M11.03 11.68A5.784 5.784 0 1 1 2.85 3.5a5.784 5.784 0 0 1 8.18 8.18m.26 1.12a6.78 6.78 0 1 1 .72-.7l5.4 5.4a.5.5 0 1 1-.71.7z" clip-rule="evenodd"></path></svg>
</span>
<span class="svg-wrapper header__icon-close"><svg xmlns="http://www.w3.org/2000/svg" fill="none" class="icon icon-close" viewBox="0 0 18 17"><path fill="currentColor" d="M.865 15.978a.5.5 0 0 0 .707.707l7.433-7.431 7.579 7.282a.501.501 0 0 0 .846-.37.5.5 0 0 0-.153-.351L9.712 8.546l7.417-7.416a.5.5 0 1 0-.707-.708L8.991 7.853 1.413.573a.5.5 0 1 0-.693.72l7.563 7.268z"></path></svg>
</span>
</span>
</summary>
<div class="search-modal modal__content gradient" role="dialog" aria-modal="true" aria-label="Product Search">
<div class="modal-overlay"></div>
<div class="search-modal__content search-modal__content-bottom" tabindex="-1"><predictive-search class="search-modal__form" data-loading-text="Loading..."><form action="/search" method="get" role="search" class="search search-modal__form">
<div class="field">
<input class="search__input field__input" id="Search-In-Modal" type="search" name="q" value="" placeholder="Product Search" role="combobox" aria-expanded="false" aria-owns="predictive-search-results" aria-controls="predictive-search-results" aria-haspopup="listbox" aria-autocomplete="list" autocorrect="off" autocomplete="off" autocapitalize="off" spellcheck="false">
<label class="field__label" for="Search-In-Modal">Product Search</label>
<input type="hidden" name="options[prefix]" value="last">
<button type="reset" class="reset__button field__button hidden" aria-label="Clear search term">
<span class="svg-wrapper"><svg fill="none" stroke="currentColor" class="icon icon-close" viewBox="0 0 18 18"><circle cx="9" cy="9" r="8.5" stroke-opacity=".2"></circle><path stroke-linecap="round" stroke-linejoin="round" d="M11.83 11.83 6.172 6.17M6.229 11.885l5.544-5.77"></path></svg>
</span>
</button>
<button class="search__button field__button" aria-label="Product Search">
<span class="svg-wrapper"><svg fill="none" class="icon icon-search" viewBox="0 0 18 19"><path fill="currentColor" fill-rule="evenodd" d="M11.03 11.68A5.784 5.784 0 1 1 2.85 3.5a5.784 5.784 0 0 1 8.18 8.18m.26 1.12a6.78 6.78 0 1 1 .72-.7l5.4 5.4a.5.5 0 1 1-.71.7z" clip-rule="evenodd"></path></svg>
</span>
</button>
</div><div class="predictive-search predictive-search--header" tabindex="-1" data-predictive-search="">

</div>
</div>

<a href="https://account.thescentedmeltshop.com?locale=en&region_country=GB" class="header__icon header__icon--account link focus-inset small-hide" rel="nofollow"><account-icon><span class="svg-wrapper"><svg xmlns="http://www.w3.org/2000/svg" fill="none" class="icon icon-account" viewBox="0 0 18 19"><path fill="currentColor" fill-rule="evenodd" d="M6 4.5a3 3 0 1 1 6 0 3 3 0 0 1-6 0m3-4a4 4 0 1 0 0 8 4 4 0 0 0 0-8m5.58 12.15c1.12.82 1.83 2.24 1.91 4.85H1.51c.08-2.6.79-4.03 1.9-4.85C4.66 11.75 6.5 11.5 9 11.5s4.35.26 5.58 1.15M9 10.5c-2.5 0-4.65.24-6.17 1.35C1.27 12.98.5 14.93.5 18v.5h17V18c0-3.07-.77-5.02-2.33-6.15-1.52-1.1-3.67-1.35-6.17-1.35" clip-rule="evenodd"></path></svg>
</span></account-icon><span class="visually-hidden">Account Login</span>
</a>
<a class="iwishDrawer header__icon" href="#" title="Wishlist">
<svg viewBox="0 0 256 256" class="iwishOutline" xmlns="http://www.w3.org/2000/svg" width="2.4rem" height="2.4rem"><rect fill="none" height="256" width="256"></rect><path d="M128,216S28,160,28,92A52,52,0,0,1,128,72h0A52,52,0,0,1,228,92C228,160,128,216,128,216Z" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="13"></path></svg>
<div class="iw-count-show" style="display:none;">
<span class="iwish-counter iwish-count-bubble">0</span>
</div>
</a>

<a href="/cart" class="header__icon header__icon--cart link focus-inset" id="cart-icon-bubble" role="button" aria-haspopup="dialog">

<span class="svg-wrapper"><svg xmlns="http://www.w3.org/2000/svg" fill="none" class="icon icon-cart-empty" viewBox="0 0 40 40"><path fill="currentColor" fill-rule="evenodd" d="M15.75 11.8h-3.16l-.77 11.6a5 5 0 0 0 4.99 5.34h7.38a5 5 0 0 0 4.99-5.33L28.4 11.8zm0 1h-2.22l-.71 10.67a4 4 0 0 0 3.99 4.27h7.38a4 4 0 0 0 4-4.27l-.72-10.67h-2.22v.63a4.75 4.75 0 1 1-9.5 0zm8.5 0h-7.5v.63a3.75 3.75 0 1 0 7.5 0z"></path></svg>
</span>

<span class="visually-hidden">Shopping Basket</span></a>
</div>
</div><div>
Call: 0333 335 6188

</div>

</div>

Remove the below code

<details-modal class="header__search">
<details>
<summary class="header__icon header__icon--search header__icon--summary link focus-inset modal__toggle" aria-haspopup="dialog" aria-label="Product Search" role="button">
<span>
<span class="svg-wrapper"><svg fill="none" class="icon icon-search" viewBox="0 0 18 19"><path fill="currentColor" fill-rule="evenodd" d="M11.03 11.68A5.784 5.784 0 1 1 2.85 3.5a5.784 5.784 0 0 1 8.18 8.18m.26 1.12a6.78 6.78 0 1 1 .72-.7l5.4 5.4a.5.5 0 1 1-.71.7z" clip-rule="evenodd"></path></svg>
</span>
<span class="svg-wrapper header__icon-close"><svg xmlns="http://www.w3.org/2000/svg" fill="none" class="icon icon-close" viewBox="0 0 18 17"><path fill="currentColor" d="M.865 15.978a.5.5 0 0 0 .707.707l7.433-7.431 7.579 7.282a.501.501 0 0 0 .846-.37.5.5 0 0 0-.153-.351L9.712 8.546l7.417-7.416a.5.5 0 1 0-.707-.708L8.991 7.853 1.413.573a.5.5 0 1 0-.693.72l7.563 7.268z"></path></svg>
</span>
</span>
</summary>
<div class="search-modal modal__content gradient" role="dialog" aria-modal="true" aria-label="Product Search">
<div class="modal-overlay"></div>
<div class="search-modal__content search-modal__content-bottom" tabindex="-1"><predictive-search class="search-modal__form" data-loading-text="Loading..."><form action="/search" method="get" role="search" class="search search-modal__form">
<div class="field">
<input class="search__input field__input" id="Search-In-Modal" type="search" name="q" value="" placeholder="Product Search" role="combobox" aria-expanded="false" aria-owns="predictive-search-results" aria-controls="predictive-search-results" aria-haspopup="listbox" aria-autocomplete="list" autocorrect="off" autocomplete="off" autocapitalize="off" spellcheck="false">
<label class="field__label" for="Search-In-Modal">Product Search</label>
<input type="hidden" name="options[prefix]" value="last">
<button type="reset" class="reset__button field__button hidden" aria-label="Clear search term">
<span class="svg-wrapper"><svg fill="none" stroke="currentColor" class="icon icon-close" viewBox="0 0 18 18"><circle cx="9" cy="9" r="8.5" stroke-opacity=".2"></circle><path stroke-linecap="round" stroke-linejoin="round" d="M11.83 11.83 6.172 6.17M6.229 11.885l5.544-5.77"></path></svg>
</span>
</button>
<button class="search__button field__button" aria-label="Product Search">
<span class="svg-wrapper"><svg fill="none" class="icon icon-search" viewBox="0 0 18 19"><path fill="currentColor" fill-rule="evenodd" d="M11.03 11.68A5.784 5.784 0 1 1 2.85 3.5a5.784 5.784 0 0 1 8.18 8.18m.26 1.12a6.78 6.78 0 1 1 .72-.7l5.4 5.4a.5.5 0 1 1-.71.7z" clip-rule="evenodd"></path></svg>
</span>
</button>
</div><div class="predictive-search predictive-search--header" tabindex="-1" data-predictive-search="">

</div>
</div>

<a href="https://account.thescentedmeltshop.com?locale=en&region_country=GB" class="header__icon header__icon--account link focus-inset small-hide" rel="nofollow"><account-icon><span class="svg-wrapper"><svg xmlns="http://www.w3.org/2000/svg" fill="none" class="icon icon-account" viewBox="0 0 18 19"><path fill="currentColor" fill-rule="evenodd" d="M6 4.5a3 3 0 1 1 6 0 3 3 0 0 1-6 0m3-4a4 4 0 1 0 0 8 4 4 0 0 0 0-8m5.58 12.15c1.12.82 1.83 2.24 1.91 4.85H1.51c.08-2.6.79-4.03 1.9-4.85C4.66 11.75 6.5 11.5 9 11.5s4.35.26 5.58 1.15M9 10.5c-2.5 0-4.65.24-6.17 1.35C1.27 12.98.5 14.93.5 18v.5h17V18c0-3.07-.77-5.02-2.33-6.15-1.52-1.1-3.67-1.35-6.17-1.35" clip-rule="evenodd"></path></svg>
</span></account-icon><span class="visually-hidden">Account Login</span>
</a>
<a class="iwishDrawer header__icon" href="#" title="Wishlist">
<svg viewBox="0 0 256 256" class="iwishOutline" xmlns="http://www.w3.org/2000/svg" width="2.4rem" height="2.4rem"><rect fill="none" height="256" width="256"></rect><path d="M128,216S28,160,28,92A52,52,0,0,1,128,72h0A52,52,0,0,1,228,92C228,160,128,216,128,216Z" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="13"></path></svg>
<div class="iw-count-show" style="display:none;">
<span class="iwish-counter iwish-count-bubble">0</span>
</div>
</a>

<a href="/cart" class="header__icon header__icon--cart link focus-inset" id="cart-icon-bubble" role="button" aria-haspopup="dialog">

<span class="svg-wrapper"><svg xmlns="http://www.w3.org/2000/svg" fill="none" class="icon icon-cart-empty" viewBox="0 0 40 40"><path fill="currentColor" fill-rule="evenodd" d="M15.75 11.8h-3.16l-.77 11.6a5 5 0 0 0 4.99 5.34h7.38a5 5 0 0 0 4.99-5.33L28.4 11.8zm0 1h-2.22l-.71 10.67a4 4 0 0 0 3.99 4.27h7.38a4 4 0 0 0 4-4.27l-.72-10.67h-2.22v.63a4.75 4.75 0 1 1-9.5 0zm8.5 0h-7.5v.63a3.75 3.75 0 1 0 7.5 0z"></path></svg>
</span>

<span class="visually-hidden">Shopping Basket</span></a>
</div>

If you stuck somewhere, feel free to message me or reply here.

Sachin D | Shopify Growth Expert @ AiTrillion

- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- 10+ Years of eCommerce experience.
- 1400+ Stores Designed on Shopify.
- All in One Marketing App on Shopify AiTrillion Marketing Automation
.
- 13+ Shopify Apps launched on app store.