The way the the phone number is displayed is actually set by ProductCart to remove spaces and put the area code in parentheses. If you want to change this default behavior it would require a change to the ProductCart code, but it is a very small change. First you will want to backup the file /store/includes/coreMethods/storefront.asp in case you need to revert your changes. Download the storefront.asp file and open it a text editor like Notepad (not a word processor like Microsoft Word) and look for the line that reads:

That line is what builds the phone number for the top of the mobile page (and elsewhere in ProductCart). Change that line to read:

This small change adds a space after the closing parentheses. When you upload the edited file the changes should show up after you refresh the page.

As for making the phone number a clickable link that can be a little more complicated. Each phone platform (Android, iPhone, Windows Phone) does things a little different and each browser you can install on these platforms is a little different. There may not be a solution that works on all phone that may visit you site. I've created one that works on most platforms and browsers that you try. This incorporates both the extra space after the parentheses and makes it a clickable link:

phoneNum = "<a href='tel:" & phoneNum & "'>(" & Mid(phoneNum, 1, 3) & ") " & Mid(phoneNum, 4, 3) & "-" & Mid(phoneNum, 7, 4) & "</a>"

You can try that and see if it works for you. If you have a backup you can always revert the change if it's not quite what you were looking for.

For the Phone number being above the logo, the theme you are using has padding in setup to move the  logo lower on the page. You can add a CSS rule to your theme to remove it. The best place to add a CSS rule is in your theme.css file. This file will be store/pc/theme/YOUR THEME NAME/css/theme.css . You can follow the same procedure of backing up the file then downloading the file and opening it in a text editor. At the bottom of that file you can add the flowing to remove the extra padding:

.brand{padding:0px;}

When you upload your edited file and refresh you should see the changes.

If we can provide any more information about making these  please let us know. We are happy to help.

- ProductCart Team

Having an issue when the theme shrinks to "mobile view".  First, the phone number is displayed with no space between the parenthesis of the area code, and the first three digits of the phone number - so it displays like: (845)277-1700 instead of (845) 277-1700 (which to me is more aesthetically pleasing):

If you can see the screen shot above, that is how the phone number is displayed at the top.  Any way I can correct it?  Does anyone know where the display code (or where PC pulls the phone number from) is in PC v5.2.10?

Also, I would like to make this phone number "clickable" - as in I want it to be a "tel:18452771700" hyperlink so that someone could tap it on their phone and call us.

Help is most appreciated.