Undefined Alert Message

Are You Seeing “Undefined” In Your Store Alert Messages?

Recently, we had a client contact us with a peculiar problem in their Bigcommerce store. They noticed a significant drop in orders over a 2 day period and naturally, wanted to find out the cause. Our development team investigated the issue and discovered that customers were seeing an “Undefined” message in alert boxes during the checkout process. Normally, these alert boxes give the user important and time-sensitive messages. These messages typically pop-up when the user’s immediate attention is needed, for example:

  • An invalid value was entered into a form field – In our client’s specific case, users were clicking on the “Continue” button during Step 4 (Shipping Methods) without first selecting the available shipping methods.
  • When an error has occurred
  • Session timeout

They say knowledge is power and at Redhead Labs we are all about empowering Bigcommerce store owners! If you are experiencing this issue with your Bigcommerce store, please read below to see what caused the issue and how we solved it.

The Culprit

Redhead Labs has designed & developed hundreds of Bigcommerce stores. This experience gives our team a serious advantage on troubleshooting bugs, such as this one. We all know that history typically repeats itself and in this particular case, that adage rang true. The issue with the “undefined” alert message has popped up a few times in the past, so we had a good idea on where to start looking.

Bigcommerce uses a lang variable to store the context of that is used in the alert pop-ups. We’ve seen cases in the past where the lang variable is re-initialized during the execution of a certain script in a store’s template files. When this occurs, Bigcommerce does not know what text to place in the alert messages. As was mentioned previously, we’ve seen this numerous times before, usually when a store owner adds a 3rd party application (Norton Website Security is notorious for this) or implements a new script that sets the lang variable to something other than what Bigcommerce is using.

Through some searching, we discovered that the newer GeoTrust Secured Seal our client had implemented in their footer was the culprit.

Bigcommerce exclusively partners with GeoTrust to provide SSL Certificates for all of their stores that are on private (custom) domains. When a store owner purchases an SSL, they are given a script that displays the GeoTrust Secured Seal on the website.

The GeoTrust script overwrites the content of the lang variable set by Bigcommerce. This effectively erases any dynamic alert messages that Bigcommerce generates in the store. We were able to solve this issue rather easily which is explained in the next section. At the end of this article, there is a code snippet that contains the additional code our developers implemented. We’ve pasted an example of the default GeoTrust Secured Seal code here for easy reference (don’t copy this one, copy the second one!)

Original GeoTrust Secured Seal code:

[sourcecode language=”html”]
<table width="135" border="0" cellpadding="2" cellspacing="0" title="Click to Verify – This site chose GeoTrust SSL for secure e-commerce and confidential communications.">
<tr>
<td width="135" align="center" valign="top">
<script type="text/javascript" src="https://seal.geotrust.com/getgeotrustsslseal?host_name=yourdomainhere.com&amp;size=M&amp;lang=en"></script>
<a href="http://www.geotrust.com/ssl/" target="_blank" style="color:#000000; text-decoration:none; font:bold 7px verdana,sans-serif; letter-spacing:.5px; text-align:center; margin:0px; padding:0px;"></a> </td>
</tr>
</table>
[/sourcecode]

The Solution

While the following solution may not be the most eloquent one, it is simple and effective. To address the issue, we simply created a variable that stores the original contents of the lang variable. Then we allow the GeoTrust script to execute. Finally, we take the contents of lang that was stored in our previous variable and assign them back to Bigcommerce’s lang variable.

If you are experiencing this same issue with your GeoTrust seal, simply copy the code below and place it in the location you desire the seal to display.

Note: You will need to replace the yourdomainhere.com (on line 7 in the snippet below) language with your actual domain provided in your script. If you have a GeoTrust SSL and need the security badge, you can create one here.

Revised GeoTrust Secured Seal Code:

[sourcecode language=”html”]
<script>
var tmpLang = lang || {};
</script>
<table width="135" border="0" cellpadding="2" cellspacing="0" title="Click to Verify – This site chose GeoTrust SSL for secure e-commerce and confidential communications.">
<tr>
<td width="135" align="center" valign="top">
<script type="text/javascript" src="https://seal.geotrust.com/getgeotrustsslseal host_name=yourdomainhere.com&amp;size=M&amp;lang=en"></script>
<a href="http://www.geotrust.com/ssl/" target="_blank" style="color:#000000; text-decoration:none; font:bold 7px verdana,sans-serif; letter-spacing:.5px; text-align:center; margin:0px; padding:0px;"></a>
</td>
</tr>
</table>
<script>
lang = tmpLang;
</script>
[/sourcecode]

Of course, if you are not comfortable with editing code we would be more than happy to assist you! If you would like to put our awesome development staff to work for you, simply contact us.