Phone Number

Add your phone number to the header of your webstore so that people can easily contact you.

Wireframe

Phone Number

Preparation Checklist

Before you start this tweak, it's a good idea to run through our preparation checklist below:

  • Read through the Getting Started to get a better sense of how the Control Panel, Database and Front End store interact.
  • Learn our recommended Simple Workflow. This makes the implementation process as easy as possible.
  • Create a new Staging Theme for this tweak. This allows you to preview any changes before they are visible to live customers.

Coding Instructions

Step 1: Open the header template

Navigate to the header file /httpdocs/assets/themes/[THEME-NAME]/templates/header/template.html.

Step 2: Add the code into the template

Paste the following code into the header template where you would like this element to appear:

[%if [@CONFIG:COMPANY_PHONE@]%]
    <div class="footer-phone my-1"><i class="fa fa-phone mr-2"></i><a href="tel:[@CONFIG:COMPANY_PHONE@]" target="_blank">[@CONFIG:COMPANY_PHONE@]</a></div>
[%/if%]

Step 3: Edit the phone number

The phone number can be edited from your control panel: Settings & Tools > Business Details

Was this article useful?

Be notified when this page is updated. Optional.