ProductCart E-Commerce Solutions Homepage
Forum Home Forum Home > ProductCart > Customizing ProductCart
  New Posts New Posts RSS Feed - Customizing PC Bootstrap Theme Display
  FAQ FAQ  Forum Search   Events   Register Register  Login Login

Customizing PC Bootstrap Theme Display

 Post Reply Post Reply
Author
Message
MGatESS View Drop Down
Groupie
Groupie
Avatar

Joined: 12-July-2006
Location: United States
Status: Offline
Points: 73
Post Options Post Options   Thanks (0) Thanks(0)   Quote MGatESS Quote  Post ReplyReply Direct Link To This Post Topic: Customizing PC Bootstrap Theme Display
    Posted: 01-February-2018 at 11:08am
Have ProductCart v5.2.10 - Using Bootstrap Blue v3

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):

Screen shot of mobile view - endoscopy.com

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.
~ Mark G.

ESS, Inc. - www.endoscopy.com
Back to Top
ProductCart View Drop Down
Admin Group
Admin Group

ProductCart Team

Joined: 01-October-2003
Status: Offline
Points: 135
Post Options Post Options   Thanks (1) Thanks(1)   Quote ProductCart Quote  Post ReplyReply Direct Link To This Post Posted: 01-February-2018 at 1:09pm
Hi Mark,

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:

phoneNum = "(" & Mid(phoneNum, 1, 3) & ")" & Mid(phoneNum, 4, 3) & "-" & Mid(phoneNum, 7, 4)

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

phoneNum = "(" & Mid(phoneNum, 1, 3) & ") " & Mid(phoneNum, 4, 3) & "-" & Mid(phoneNum, 7, 4) 

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


The ProductCart Team

Home of ProductCart shopping cart software
Back to Top
 Post Reply Post Reply
  Share Topic   

Forum Jump Forum Permissions View Drop Down

Forum Software by Web Wiz Forums® version 12.04
Copyright ©2001-2021 Web Wiz Ltd.

This page was generated in 0.031 seconds.