LexiConn News » All Posts https://support.lexiconn.com/news/forums/forum/tutorials/feed/ Sat, 18 Apr 2026 09:01:56 +0000 http://bbpress.org/?v=2.5.3-5249 en-US https://support.lexiconn.com/news/forums/topic/google-global-site-tag-gtag-js-integration-with-shopsite/#post-49461 <![CDATA[Google Global Site Tag (gtag.js) integration with ShopSite]]> https://support.lexiconn.com/news/forums/topic/google-global-site-tag-gtag-js-integration-with-shopsite/#post-49461 Mon, 30 Jul 2018 21:25:53 +0000 lexiconn What is Google Global Site Tag?

Google’s global site tag (gtag.js) is a javascript library that integrates tracking between several Google products (Analytics, Adwords, etc).  If you add this library to your site, it replaces any existing analytics tracking scripts you have in place, including Analytics code added automatically by ShopSite under Merchandising -> Google Services -> Analytics.  There is no automated integration of gtag.js by ShopSite at this time, but it may be an option in a future update.  At this time, you should only consider changing to the global site tag if it is required by Google for tracking.

Integration gtag.js with ShopSite:

1. The first step is to remove any Google Analytics code from your templates, and turn off Google Analytics tracking under Merchandising -> Google Services -> Analytics.  Otherwise you will have duplicate tracking for all of your pages.

2. Next, you will need to add the following code as high in the <head> of the page as possible in the [-- DEFINE PAGE --] section of your page templates, in the [-- DEFINE MORE_INFO_PAGE --] section of your product templates, and in the [-- DEFINE ShoppingCart --] and [-- DEFINE Shipping --] section of your shopping cart template:

<script async src="https://www.googletagmanager.com/gtag/js?id=GA_TRACKING_ID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'GA_TRACKING_ID');
 
  ga('send', 'pageview');
 
</script>

(of course, replace GA_TRACKING_ID in both locations with your GA tracking id).

3. Add the following code to the [-- DEFINE ThankYou --] section of your shopping cart template:

<script async src="https://www.googletagmanager.com/gtag/js?id=GA_TRACKING_ID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'GA_TRACKING_ID');
 
  ga('send', 'pageview');
  ga('require', 'ecommerce');

  ga('ecommerce:addTransaction', {
          'id': ss_ordernum,
          'affiliation': '[-- STORE.Name {JS_ENCODE} --]',
          'revenue': ss_ordertotal,
          'shipping': ss_shipping,
          'tax': ss_tax
   });

   for(n=0; n<ss_sku.length; n++){
           ga('ecommerce:addItem', {
                  'id': ss_ordernum,
                  'name': ss_name[n],
                  'sku': ss_sku[n],
                  'price': ss_price[n],
                  'quantity': ss_quantity[n]
                });
   }

   ga('ecommerce:send');

</script>

(again, replace GA_TRACKING_ID in both locations with your GA tracking id).

4. Regenerate your site (Utilities -> Publish – Regenerate) to apply the new code to all pages on your site.

]]> https://support.lexiconn.com/news/forums/topic/shopsite-templates-and-images/#post-49148 <![CDATA[ShopSite Templates and Images]]> https://support.lexiconn.com/news/forums/topic/shopsite-templates-and-images/#post-49148 Thu, 02 Jul 2015 17:15:08 +0000 lexiconn Interested in all there is to know about using images in ShopSite custom templates?

Check out our latest Knowledgebase article:

Working with Images in ShopSite Templates

- LexiConn Support

 

]]> https://support.lexiconn.com/news/forums/topic/manually-adding-universal-analytics-to-your-site/#post-49006 <![CDATA[Manually Adding Google Universal Analytics To Your Site]]> https://support.lexiconn.com/news/forums/topic/manually-adding-universal-analytics-to-your-site/#post-49006 Wed, 21 May 2014 16:40:52 +0000 lexiconn If you are looking to use Google Universal Analytics to track your ShopSite store and you’re using ShopSite to generate all your pages you can configure ShopSite to add the tracking code for you automatically (requires version 12.0.2). This can be done in the ShopSite back office under Merchandising > Google Services > Analytics.

The feature has a wizard which will step you through the process of configuring the settings and when you publish your store ShopSite will automatically add (or update existing) tracking code to the store and shopping cart pages.

If you have pages generated outside of ShopSite or you have a need for customized Universal Analytics tracking code you will need to add the code manually to your site. In this tutorial we’ll step through the details on how to do that and will provide sample tracking code as well.

For an in-depth look at the features included with Universal Anaytics you can visit:

https://support.google.com/analytics/answer/2790010?hl=en

To upgrade your Google account to Universal Analytics, follow the instructions at:

https://developers.google.com/analytics/devguides/collection/upgrade/

Page View Tracking

If you have your own SSL certificate for your domain name, then you will use the following code:

Universal Analytics Code

<!-- BEGIN: Google Universal Analytics -->
<script type="text/javascript">
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
  ga('create', 'UA-XXXXXX-Y', 'auto');
  ga('send', 'pageview');
</script>
<!-- END: Google Analytics -->

If your store is hosted with us and uses our shared SSL to secure pages, then you will need to use the following code:

Universal Analytics Code (Cross-Domain Tracking)

<!-- Google Analytics -->
<script type="text/javascript">
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga'); function __utmLinkPost(a){return true;}function __utmLinker(a){window.location=a;}
ga('create', 'UA-XXXXXX-Y', 'auto', {'allowLinker': true});
ga('require', 'linker');
ga('linker:autoLink', ['your-domain.com', 'secure-host.com']);
ga('send', 'pageview');
</script>
<!-- END: Google Analytics -->

NOTE: Be sure to change the “UA-XXXXXX-Y” text to your “UA” tracking code provided by Google. Also, “your-domain.com” should be replaced with your domain name.

For further reading about cross-domain tracking, Google has details here:

https://developers.google.com/analytics/devguides/collection/analyticsjs/cross-domain

The tracking code selected above goes on every page of your site, including cart pages.  For the tracking code to work, it must be placed before the closing “</head>” tag.  For the shopping cart, the tracking code should be added to the following sections only:

[-- DEFINE ShoppingCart --]
[-- DEFINE Shipping --]
[-- DEFINE Confirmation --]
[-- DEFINE ThankYou --]

Ecommerce Tracking (optional)

In order to track conversion details using Universal Analytics, the following code will need to be added to the [-- DEFINE ThankYou --]  section of your shopping cart template.  The  ecommerce code must be added after the page view tracking code and should be located between the opening “<body>” and closing “</body>” tags.

<!-- BEGIN: Google Universal Analytics Ecommerce Tracking Code -->
<script type="text/javascript">
document.write('<script type=\"text/javascript\">');
document.write("ga('require', 'ecommerce', 'ecommerce.js');");
document.write("ga('ecommerce:addTransaction', {" + "'id':'" + ss_ordernum +"', 'affiliation':'" + ss_associate + "','revenue':'" + ss_ordertotal + "','shipping':'" + ss_shiptotal + "','tax':'" + ss_taxtotal + "'});");
     for (var p = 0 ; p < number_products ; p++) { 
     document.write("ga('ecommerce:addItem', {" + "'id':'" + ss_ordernum +"', 'name':'" + ss_name[p] + "','sku':'" + ss_sku[p] + "', 'category': 'product', 'price':'" + ss_price[p] + "','quantity':'" + ss_quantity[p] + "'});");      } document.write("ga('ecommerce:send');"); document.write('<\/scr'+'ipt>'); </script> <!-- END: Google Analytics Ecommerce Tracking Code -->

Tip:  For conversions to be reported, your Google Analytics account must be upgraded to Universal Analytics and Ecommerce Tracking enabled.

Instructions for enabling Ecommerce Tracking in your Google Analytics account can be found at:

https://support.google.com/analytics/answer/1009612?hl=en

Google has additional details on the eCommerce tracking features of Universal Analytics here:

https://developers.google.com/analytics/devguides/collection/analyticsjs/ecommerce

]]> https://support.lexiconn.com/news/forums/topic/make-product-view-selection-global-in-responsive-templates/#post-48883 <![CDATA[Make Product View Selection Global in Responsive Templates]]> https://support.lexiconn.com/news/forums/topic/make-product-view-selection-global-in-responsive-templates/#post-48883 Tue, 10 Dec 2013 16:13:14 +0000 Anonymous ShopSite V12 provides nine new themes (Brownie, Composer, Content Focus, Deskman, Floating Page, Response, Shower, Stripped Down, and Underline) all built on the same responsive templates (Full-Page/Full-Product.sst). The Full-Page.sst template allows customer to toggle the product layout between grid/image and list/detail view dynamically:

When a customer selects the product view they prefer, this setting does not persist once they leave the page. Here is a method that will make a customer’s product-view selection persistent across all of your product pages so that selecting “View Products By Detail List” or “View Products By Image” changes the view for all of your pages.

1. This method requires some PHP code on all of your product pages, so first you must make certain that .html and .htm pages are parsed for PHP by entering the following line on the .htaccess file in your /www directory (let us know if you need any help with this and we can put this in place for you).

AddType application/x-httpd-php .php .php3 .htm .html

2. Add the first include before the opening HTML tag on each page:

<?php>
if(array_key_exists("listType", $_COOKIE)){
$body_class = $_COOKIE;
} else{
$body_class = 'primg';
}
?>

In the Full-Page.sst page template, this will look like this:

[-- DEFINE PAGE --]

<?php>
if(array_key_exists("listType", $_COOKIE)){
$body_class = $_COOKIE;
} else{
$body_class = 'primg';
}
?>

[-- VAR.Type "page" --][-- VAR.Secure "no" --][-- IF PAGE.LinkName --][-- VAR.LinkName PAGE.LinkName --][-- ELSE --][-- VAR.LinkName PAGE.Name --][-- END_IF --][-- VAR.FileName PAGE.FileName --][-- IF PAGE.LinkColumns "Five columns" --][-- VAR.LinkCols "5" --][-- ELSE_IF PAGE.LinkColumns "Four columns" --][-- VAR.LinkCols "4" --][-- ELSE_IF PAGE.LinkColumns "Three columns" --][-- VAR.LinkCols "3" --][-- ELSE_IF PAGE.LinkColumns "Two columns" --][-- VAR.LinkCols "2" --][-- ELSE --][-- VAR.LinkCols "1" --][-- END_IF --][-- IF PAGE.Columns "Five columns" --][-- VAR.Cols "5" --][-- ELSE_IF PAGE.Columns "Four columns" --][-- VAR.Cols "4" --][-- ELSE_IF PAGE.Columns "Three columns" --][-- VAR.Cols "3" --][-- ELSE_IF PAGE.Columns "Two columns" --][-- VAR.Cols "2" --][-- ELSE --][-- VAR.Cols "1" --][-- END_IF --][-- INCLUDE Full-VARs-DOCTYPE.sst PROCESS --][-- IF PAGE.SearchProductField --][-- ELSE --][-- VAR.DisplaySearch "no" --][-- END_IF --]

3. Add the following class to the opening body tag in templates:

<body id="listType" class="<?php echo $body_class; ?>"[-- IF PageLinks.Left --] onload="leftLinks();"[-- END_IF --]>

In the Full-Page.sst template you will be changing the line:

to:

<body id="listType"[-- IF PageLinks.Left --] onload="leftLinks();"[-- IF PageLinks.Left --] onload="leftLinks();"[-- END_IF --]>

4. Add the following javascript before the closingtag in the page templates:

<script type="text/javascript"> 


function set_cookie(name, value, expirationDays) {
var cookie = name + "=" + value;
var exdate=new Date();
exdate.setDate(exdate.getDate()+expirationDays);
cookie = cookie + (";expires="+exdate.toGMTString());
document.cookie = cookie;
}

function get_cookie(c_name) {
if (document.cookie.length>0)
{
var c_start=document.cookie.indexOf(c_name+"=");
if (c_start != -1)
{
c_start=c_start + c_name.length+1;
var c_end=document.cookie.indexOf(";",c_start);
if (c_end==-1)
c_end=document.cookie.length;
var cookie = unescape(document.cookie.substring(c_start,c_end));
return cookie;
}
}
return null;
}

var list_pref = get_cookie("listType");
if(list_pref != undefined && list_pref != null){
document.getElementById("listType").setAttribute("class", list_pref);
} else{
document.write('<body id="listType" class="prtxt" onload="leftLinks();">
}

</script>

In the Full-Page.sst template this will look like:

.
.
.

[-- INCLUDE Full-Footer.sst PROCESS --]

<script type="text/javascript"> 


function set_cookie(name, value, expirationDays) {
var cookie = name + "=" + value;
var exdate=new Date();
exdate.setDate(exdate.getDate()+expirationDays);
cookie = cookie + (";expires="+exdate.toGMTString());
document.cookie = cookie;
}

function get_cookie(c_name) {
if (document.cookie.length>0)
{
var c_start=document.cookie.indexOf(c_name+"=");
if (c_start != -1)
{
c_start=c_start + c_name.length+1;
var c_end=document.cookie.indexOf(";",c_start);
if (c_end==-1)
c_end=document.cookie.length;
var cookie = unescape(document.cookie.substring(c_start,c_end));
return cookie;
}
}
return null;
}

var list_pref = get_cookie("listType");
if(list_pref != undefined && list_pref != null){
document.getElementById("listType").setAttribute("class", list_pref);
} else{
document.write('<body id="listType" class="prtxt" onload="leftLinks();">
}

</script>

 

]]> https://support.lexiconn.com/news/forums/topic/disable-wheel-scroll-in-dropdowns-on-checkout/#post-48875 <![CDATA[Disable wheel scroll in dropdowns on checkout]]> https://support.lexiconn.com/news/forums/topic/disable-wheel-scroll-in-dropdowns-on-checkout/#post-48875 Wed, 25 Sep 2013 18:12:13 +0000 Anonymous In Internet Explorer, dropdown boxes on the Checkout page (such as the credit card expiration date dropdowns) remain active after making a selection, and when selected, the values may change when you scroll with your mouse wheel. This can result in a customer inadvertently selecting an invalid expiration date if they try to scroll on the page while the dropdown is still active.

The following script can be used on your Checkout page to force the dropdown boxes on the page to be deselected after a selection is made:

<script type="text/javascript">
ss_jQuery("select").change(function(e){
e.target.blur()
})
</script>

You can add the script before the closing tag in the [-- DEFINE Shipping --] section of your Shopping Cart template, or you could add it in Commerce Setup -> Order System -> Checkout Screen – Text at the bottom
of the Checkout screen, if your template supports it.

]]> https://support.lexiconn.com/news/forums/topic/update-price-as-ordering-options-are-selected/#post-48802 <![CDATA[Update Price as Ordering Options are Selected]]> https://support.lexiconn.com/news/forums/topic/update-price-as-ordering-options-are-selected/#post-48802 Wed, 28 Sep 2011 17:24:08 +0000 Anonymous If you are using custom pricing rules for your ordering options, you may want the product price on the MoreInfo page to update as a customer selects various options to reflect the actual price of the product.

An example of this functionality can be found on the following demo page:

http://shopsite-demo.lexiconn.com/product_options_change_price.html

This can be accomplished very easily using some javascript on your MoreInfo page:

1. Set or Add the name=”add_to_cart” attribute to your Add to Cart form element:

<form name="add_to_cart" action="[path-to-your-shopping-cart]/order.cgi" method="post">

2. Insert a hidden input field into the body of your MoreInfo page template that has an id of “base_price” and a value of your product’s base price:

<input type="hidden" id="base_price" name="base_price" value="[-- PRODUCT.Price --]" />

3. Wrap the ShopSite PRODUCT.Price template tag with a span element with an id of “product_price”:

<span id="product_price">[-- PRODUCT.Price --]</span>

4. Add the following javascript to the body of your MoreInfo page, preferably near the closing body tag:

<script type="text/javascript">

window.onload = function(){

basePrice = parseFloat(document.getElementById("base_price").value.substr(1).replace(',',''))
modifiedPrice = null
productID = document.add_to_cart.itemnum.value
priceAdjustment = new Array()
var optionCount = 0

var option_regex = /.*:finopt:.*/
var value_regex = /.*;[+*-][0-9]{0,4}.[0-9]{1,2}||.*;[+*-][0-9]{0,4}/
var modifiedPrice_regex = /.*;.*/

var commaFormat = function(amount){
var delimiter = ","; // replace comma if desired
var a = amount.split('.',2)
var d = a[1]
var i = parseInt(a[0])
if(isNaN(i)) { return ''; }
var minus = ''
if(i < 0) { minus = '-'; }
i = Math.abs(i)
var n = new String(i)
var a = []
while(n.length > 3){
var nn = n.substr(n.length-3)
a.unshift(nn)
n = n.substr(0,n.length-3)
}
if(n.length > 0) { a.unshift(n); }
n = a.join(delimiter)
if(d.length < 1) { amount = n; }
else { amount = n + '.' + d; }
amount = minus + amount
return amount
}

var currencyFormat = function(price) {
var i = parseFloat(price)
if(isNaN(i)) { i = 0.00; }
var minus = ''
if(i < 0) { minus = '-'; }
i = Math.abs(i)
i = parseInt((i + .005) * 100)
i = i / 100
s = new String(i)
if(s.indexOf('.') < 0) { s += '.00'; }
if(s.indexOf('.') == (s.length - 2)) { s += '0'; }
s = minus + s
var c_format = commaFormat(s)
return c_format
}

adjustPrice = function(currentPrice, optionValue){
var optionSplit = optionValue.split(";")
var operator = optionSplit[1].charAt(0)
var increment = parseFloat(optionSplit[1].substr(1))

switch(operator){

case '+':
return increment
break

case '-':
return (0 - increment)
break

case '*':
increment = currentPrice * increment
return increment
break

case '/':
currentPrice = currentPrice / increment
return currentPrice
break

default:
return 0
break

}
}


calculateModifiedPrice = function(){
modifiedPrice = basePrice
for(n=0; n<optionCount; n++){
var inc = adjustPrice(basePrice, priceAdjustment["'"+productID+":finopt:"+n+"'"])
modifiedPrice = modifiedPrice + inc
}
}

var s_option = document.getElementsByTagName("select")

//cycle through all <select> elements on page
for(x=0; x<s_option.length; x++){
//If this select matches an ordering option by name (/.*:finopt:.*/)
if(s_option[x].name){
if(option_regex.test(s_option[x].name)){
//increment count of ordering options
optionCount++
//Get current value of this ordering option (on page load)
var s_option_value = s_option[x].options[s_option[x].selectedIndex].value

//If this option has any incremented value
if(modifiedPrice_regex.test(s_option_value) && s_option_value!=';n'){
priceAdjustment["'"+s_option[x].name+"'"] = s_option_value

} else if(s_option_value!=';n') {
priceAdjustment["'"+s_option[x].name+"'"] = 'n;+0'
} else {
priceAdjustment["'"+s_option[x].name+"'"] = 'n;+0'
}

for(n=0; n<s_option[x].length; n++){

s_option[x].onchange=function(){

var s_option_value = this.options[this.selectedIndex].value

//If this option has any incremented value
if(modifiedPrice_regex.test(s_option_value) && s_option_value!=';n'){
priceAdjustment["'"+this.name+"'"] = s_option_value

} else if(s_option_value!=';n') {
priceAdjustment["'"+this.name+"'"] = 'n;+0'
} else {
priceAdjustment["'"+this.name+"'"] = 'n;+0'
}
calculateModifiedPrice()
var e_price = "$"+currencyFormat(modifiedPrice)
document.getElementById("product_price").innerHTML = e_price
}
}

} else{
//Do nothing
}
}
}

calculateModifiedPrice()
var e_price = "$"+currencyFormat(modifiedPrice)
document.getElementById("product_price").innerHTML = e_price
}
</script>

Now all that you will need to do is regenerate your site and the prices of your products will update on the moreinfo page as the customer chooses options that raise/lower the price.

]]> https://support.lexiconn.com/news/forums/topic/lightbox-and-zoom-image-tutorial-for-shopsite/#post-48800 <![CDATA[Lightbox and Zoom Image Tutorial for ShopSite]]> https://support.lexiconn.com/news/forums/topic/lightbox-and-zoom-image-tutorial-for-shopsite/#post-48800 Tue, 27 Sep 2011 18:47:16 +0000 Anonymous If you would like to implement the Lightbox or the Image-Zoom effect on your MoreInfo pages with multiple MoreInfo images, the following script will make it much easier.

You can view examples of each of these effects on the following demo store pages:

Lightbox Example:

http://shopsite-demo.lexiconn.com/lightbox_test.html

Zoom-Image Example:

http://shopsite-demo.lexiconn.com/zoom_image_test.html

We have provided the scripts you will need to make either of these work in a single zip file:

http://support.lexiconn.com/more_info_image.zip

1. Unzip and upload the contents of this file to your /www directory. If you need to upload the files to another directory on your site, you will need to adjust the path for each of the javascript and CSS includes.

2. Add the following code to theregion of your MoreInfo template (or put the code in a ShopSite include and call that include in the head region):

 

<link media="screen" rel="stylesheet" href="/more_info_image/colorbox.css" />
<link href="/more_info_image/cloud-zoom.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="/more_info_image/jquery.js"></script>
<script src="/more_info_image/jquery.colorbox-min.js"></script>
<script type="text/JavaScript" src="/more_info_image/cloud-zoom.1.0.2.min.js"></script>

 

Replace the [-- PRODUCT.MoreInformationGraphic --] and [-- MoreInfoImageRow --] section of your MoreInfo template with the following code (or put the code in a ShopSite include and call that include in place of those tags):

 

 [-- VAR.MoreInfoImageType 'Lightbox' --] 
 #set to 'Lightbox' or to 'ZoomBox' 
 <script type="text/javascript"> 
     //override default javascript popup function 
     window.open = function(url, name, props) {} 
 
     var MoreInfoImage = { 
         image_source: '', 
         image_title: '', 
         image_extension: '', 
         image_id: '', 
         image_id_stem: 'more_info_image_', 
         tld_regex: /\.com|\.net|\.org|\.edu|\.biz|\.gov/, 
         img_extension_regex: /\.jpg$|\.jpeg$|\.png$|\.gif$/i, 
         
         zoom_config: { 
             zoom_suffix: '_zoom',  //suffix that your larger images will use, for example, image.jpg and image_zoom.jpg 
             image_class: 'cloud-zoom', 
             gallery_class: 'cloud-zoom-gallery', 
             preview_id: 'zoom1', 
             thumb_image_width: 125, 
             zoom_image_source: '', 
             options:{ 
                 zoomWidth: "auto", 
                 zoomHeight: "auto", 
                 position: "inside", 
                 adjustX: 0, 
                 adjustY: 0, 
                 tint: false, 
                 tintOpacity: 0.5, 
                 lensOpacity: 0.5, 
                 softFocus: false, 
                 smoothMove: 3, 
                 showTitle: true, 
                 titleOpacity: 0.5 
             } 
         }, 
         
         lightbox_config: { 
             default_lightbox_width: 500, 
             options:{ 
                 title: '', 
                 transition: "elastic", //`elastic`, `fade`, or `none` 
                 speed: 350, //transition speed in ms. 
                 initialWidth: 300, //initial width of the Lightbox Window 
                 initialHeight: 100, //initial height of the Lightbox Window 
                 width: false, //force a width of the Lightbox Window (outer width of the entire window) 
                 height: false, //force a height of the Lightbox Window (outer height of the entire window) 
                 innerWidth: false, //force a width of the Lightbox Window (inner width of the entire window) 
                 innerHeight: false, //force a height of the Lightbox Window (inner height of the entire window) 
                 maxWidth: false, //set a maximum width for the window 
                 maxHeight: false, //set a maximum height for the window 
                 scalePhotos: true, //whether to scale images if a maxWidth, maxHeight, innerWidth, innerHeight, width, or height have been defined 
                 scrolling: true, //whether to generate scrolling content if the image size exceed the size of the window 
                 opacity: 0.85, //Opacity of the screen overlay (range: 0 to 1) 
                 loop: true, //whether to allow a next link back to the first image after the last image is reached 
                 slideshow: false, //whether to generate a slideshow 
                 slideshowSpeed: 2500, //transition speed for slideshows in ms. 
                 slideshowAuto: true, //whether the slideshow should automatically begin 
                 slideshowStart: "Start Slideshow", //Text for the Slideshow Start control 
                 slideshowStop: "Stop Slideshow",  //Text for the Slideshow Stop control 
                 previous: "Previous", //Text for the previous image button 
                 next: "Next", //Text for the next image button 
                 close: "Close", //Text to close the window 
                 top: false, //Controls vertical positioning of window 
                 bottom: false, //Controls vertical positioning of window 
                 left: false, //Controls horizontal positioning of window 
                 right: false, //Controls horizontal positioning of window 
                 fixed: false  //Sets a fixed position for the window 
             } 
         }, 
 
         genID: function(){ 
             var rand_id = Math.floor(Math.random()*400); 
             this.image_id = this.image_id_stem + rand_id; 
         }, 
         
         generateID: function(){ 
             this.genID(); 
             if(document.getElementById(this.image_id) != undefined){ 
                 this.genID(); 
             } 
         }, 
         
         parseSource: function(){ 
             var p_image = this.image_source.split(this.img_extension_regex); 
             var p_image = p_image_source.split(this.tld_regex); 
             var p_z_image = p_image_source.split(this.img_extension_regex); 
             this.image_extension = p_image_source.match(this.img_extension_regex); 
             this.zoom_config.zoom_image_source =  p_z_image[0] + this.zoom_config.zoom_suffix + this.image_extension; 
         }, 
         
         generateZoomBoxImage: function(src, title){ 
             this.image_source = src; 
             this.parseSource(); 
             this.generateID(); 
             var output = '<a href="' + this.zoom_config.zoom_image_source + '" class="'  + this.zoom_config.image_class + '" id="' + this.zoom_config.preview_id + '" rel="position: \'' + this.zoom_config.options.position + '\', showTitle: true, adjustX: 10, adjustY:-4\">[-- PRODUCT.MoreInformationGraphic JS_ENCODE --]</a>'; 
             return output; 
         }, 
         
         generateZoomThumb: function(src, title){ 
             this.image_source = src; 
             this.image_title = title; 
             this.parseSource(); 
             this.generateID(); 
             var output = '<a href="' + this.zoom_config.zoom_image_source + '" class="'  + this.zoom_config.gallery_class + '" id="' + this.image_id + '" title="' + this.image_title + '" rel="useZoom: \'' + this.zoom_config.preview_id + '\', smallImage: \'' + this.image_source + '\', zoomWidth: \'' + this.zoom_config.options.zoomWidth + '\', zoomHeight: \'' + this.zoom_config.options.zoomHeight + '\', position: \'' + this.zoom_config.options.position + '\', showTitle: \'' + this.zoom_config.options.showTitle + '\', adjustX: ' + this.zoom_config.options.adjustX + ', adjustY:' + this.zoom_config.options.adjustX + ', tint: ' + this.zoom_config.options.tint + ', tintOpacity: \''+ this.zoom_config.options.tintOpacity + '\', lensOpacity: \'' + this.zoom_config.options.lensOpacity + '\', softFocus: \'' + this.zoom_config.options.softFocus + '\', smoothMove: \'' + this.zoom_config.options.smoothMove + '\', titleOpacity: \'' + this.zoom_config.options.titleOpacity + '\'"><img src="' + this.image_source + '" width="' + this.zoom_config.thumb_image_width + '" title="' + this.image_title + '" /></a>'; 
             return output; 
         }, 
 
         generateLightbox: function(){ 
           $(document).ready(function(){ 
               
              $('td[class="small_img"] > a').each(function(e){ 
                   $(this).removeAttr("onmouseover"); 
              }); 
 
               $('td[class="small_img"] > a > img').each(function(i){ 
                     $(this).parent().attr("href", this.src.replace(/ss_size\d\//, "")); 
                     $(this).parent().attr("rel", "16"); 
                     this.image_title = $(this).attr("title") != undefined ? $(this).attr("title") : '[-- PRODUCT.Name --]'; 
                     MoreInfoImage.lightbox_config.options.title = this.image_title; 
                    $(this).parent().colorbox(MoreInfoImage.lightbox_config.options); 
               }); 
                 
               $('img[name="prod_img"]').click(function(){ 
                     var current_src = ($(this).attr("src")); 
                     $('td[class="small_img"] > a').each(function(i){ 
                          if($(this).attr("href") == current_src){ 
                               $(this).click(); 
                          } 
                     }); 
               }); 
       }); 
         } 
     }    
 
 </script> 
 [-- IF VAR.MoreInfoImageType 'ZoomBox' --] 
 <div class="zoom_image_block" style="width: 550px; height: 425px;"> 
     <div id="zoom_large_image" style="float: left; height: 425px;"> 
       <span id="more_info_graphic" style="display: none;">[-- PRODUCT.MoreInformationGraphic --]</span> 
       <script type="text/javascript"> 
         var p_image_source = $("#more_info_graphic > img").attr("src"); 
         var p_image_title = $("#more_info_graphic > img").attr("title"); 
         document.write(MoreInfoImage.generateZoomBoxImage(p_image_source, p_image_title)); 
         </script> 
     </div> 
 <div id="zoom_image_row" class="scroll-pane" style="float: right; width: 225px; height: 425px; overflow: auto; border-right: 1px solid #ccc;"> 
 <table align="center" width="175" id="zoom_image_table"> 
 <tr> 
   <td> 
 <div class="preview_image" > 
       <span id="more_info_image_0" style="display: none;">[-- PRODUCT.MoreInformationGraphic --]</span> 
       <script type="text/javascript"> 
         var p_image_source = $("#more_info_image_0 > img").attr("src"); 
         var p_image_title = $("#more_info_image_0 > img").attr("title"); 
         document.write(MoreInfoImage.generateZoomThumb(p_image_source,  p_image_title)); 
         </script> 
 </div> 
   </td> 
 </tr> 
 [-- IF PRODUCT.MoreInfoImage1 --]  
 <tr> 
   <td> 
 <div class="preview_image" > 
       <span id="more_info_image_1" style="display: none;">[-- PRODUCT.MoreInfoImage1 --]</span> 
       <script type="text/javascript"> 
         var p_image_source = $("#more_info_image_1 > img").attr("src"); 
         var p_image_title = $("#more_info_image_1 > img").attr("title"); 
         document.write(MoreInfoImage.generateZoomThumb(p_image_source,  p_image_title)); 
         </script> 
 </div> 
   </td> 
 </tr> 
 [-- END_IF --] 
     
 [-- IF PRODUCT.MoreInfoImage2 --] 
 <tr> 
   <td> 
 <div class="preview_image"> 
    <span id="more_info_image_2" style="display: none;">[-- PRODUCT.MoreInfoImage2 --]</span> 
       <script type="text/javascript"> 
         var p_image_source = $("#more_info_image_2 > img").attr("src"); 
         var p_image_title = $("#more_info_image_2 > img").attr("title"); 
         document.write(MoreInfoImage.generateZoomThumb(p_image_source,  p_image_title)); 
         </script> 
 </div> 
   </td> 
 </tr> 
 [-- END_IF --] 
 [-- IF PRODUCT.MoreInfoImage3 --] 
 <tr> 
   <td> 
 <div class="preview_image"> 
     <span id="more_info_image_3" style="display: none;">[-- PRODUCT.MoreInfoImage3 --]</span> 
       <script type="text/javascript"> 
         var p_image_source = $("#more_info_image_3 > img").attr("src"); 
         var p_image_title = $("#more_info_image_3 > img").attr("title"); 
         document.write(MoreInfoImage.generateZoomThumb(p_image_source,  p_image_title)); 
         </script> 
 </div> 
   </td> 
 </tr> 
 [-- END_IF --] 
 [-- IF PRODUCT.MoreInfoImage4 --] 
 <tr> 
   <td> 
 <div class="preview_image"> 
     <span id="more_info_image_4" style="display: none;">[-- PRODUCT.MoreInfoImage4 --]</span> 
     <script type="text/javascript"> 
         var p_image_source = $("#more_info_image_4 > img").attr("src"); 
         var p_image_title = $("#more_info_image_4 > img").attr("title"); 
         document.write(MoreInfoImage.generateZoomThumb(p_image_source,  p_image_title)); 
     </script> 
 </div> 
 </td> 
 </tr> 
 [-- END_IF --] 
 [-- IF PRODUCT.MoreInfoImage5 --] 
 <tr> 
   <td> 
 <div class="preview_image"> 
     <span id="more_info_image_5" style="display: none;">[-- PRODUCT.MoreInfoImage5 --]</span> 
     <script type="text/javascript"> 
         var p_image_source = $("#more_info_image_5 > img").attr("src"); 
         var p_image_title = $("#more_info_image_5 > img").attr("title"); 
         document.write(MoreInfoImage.generateZoomThumb(p_image_source,  p_image_title)); 
     </script> 
 </div> 
 </td> 
 </tr> 
 [-- END_IF --] 
 [-- IF PRODUCT.MoreInfoImage6 --] 
 <tr> 
   <td> 
 <div class="preview_image"> 
     <span id="more_info_image_6" style="display: none;">[-- PRODUCT.MoreInfoImage6 --]</span> 
     <script type="text/javascript"> 
         var p_image_source = $("#more_info_image_6 > img").attr("src"); 
         var p_image_title = $("#more_info_image_6 > img").attr("title"); 
         document.write(MoreInfoImage.generateZoomThumb(p_image_source,  p_image_title)); 
     </script> 
 </div> 
 </td> 
 </tr> 
 [-- END_IF --] 
 [-- IF PRODUCT.MoreInfoImage7 --] 
 <tr> 
   <td> 
 <div class="preview_image"> 
     <span id="more_info_image_7" style="display: none;">[-- PRODUCT.MoreInfoImage7 --]</span> 
     <script type="text/javascript"> 
         var p_image_source = $("#more_info_image_7 > img").attr("src"); 
         var p_image_title = $("#more_info_image_7 > img").attr("title"); 
         document.write(MoreInfoImage.generateZoomThumb(p_image_source,  p_image_title)); 
     </script> 
 </div> 
 </td> 
 </tr> 
 [-- END_IF --] 
 [-- IF PRODUCT.MoreInfoImage8 --] 
 <tr> 
   <td> 
 <div class="preview_image"> 
     <span id="more_info_image_8" style="display: none;">[-- PRODUCT.MoreInfoImage8 --]</span> 
     <script type="text/javascript"> 
         var p_image_source = $("#more_info_image_8 > img").attr("src"); 
         var p_image_title = $("#more_info_image_8 > img").attr("title"); 
         document.write(MoreInfoImage.generateZoomThumb(p_image_source,  p_image_title)); 
     </script> 
 </div> 
 </td> 
 </tr> 
 </table> 
     </div> 
 </div> 
 [-- END_IF --] 
 [-- IF PRODUCT.MoreInfoImage9 --] 
 <tr> 
   <td> 
 <div class="preview_image"> 
     <span id="more_info_image_9" style="display: none;">[-- PRODUCT.MoreInfoImage9 --]</span> 
     <script type="text/javascript"> 
         var p_image_source = $("#more_info_image_9 > img").attr("src"); 
         var p_image_title = $("#more_info_image_9 > img").attr("title"); 
         document.write(MoreInfoImage.generateZoomThumb(p_image_source,  p_image_title)); 
     </script> 
 </div> 
 </td> 
 </tr> 
 </table> 
     </div> 
 </div> 
 [-- END_IF --] 
 [-- IF PRODUCT.MoreInfoImage10 --] 
 <tr> 
   <td> 
 <div class="preview_image"> 
     <span id="more_info_image_10" style="display: none;">[-- PRODUCT.MoreInfoImage10 --]</span> 
     <script type="text/javascript"> 
         var p_image_source = $("#more_info_image_10 > img").attr("src"); 
         var p_image_title = $("#more_info_image_10 > img").attr("title"); 
         document.write(MoreInfoImage.generateZoomThumb(p_image_source,  p_image_title)); 
     </script> 
 </div> 
 </td> 
 </tr> 
 </table> 
     </div> 
 </div> 
 [-- END_IF --] 
 [-- ELSE_IF VAR.MoreInfoImageType 'Lightbox' --] 
 <div class="zoom_image_block" style="width: 550px; height: 425px;"> 
 [-- MoreInfoImageRow --] 
 </div> 
 <script type="text/javascript"> 
    MoreInfoImage.generateLightbox(); 
 </script> 
 [-- END_IF --]

 

3. Set the VAR.MoreInfoImageType variable to either ‘Lightbox’ or ‘ZoomBox’:

[-- VAR.MoreInfoImageType 'Lightbox' --]

or

[-- VAR.MoreInfoImageType 'ZoomBox' --]

4. Configure options for whichever effect you are using:

=======================================================
For Lightbox, the following options may be customized in the lightbox_config section of the script (a value of ‘false’ should be used if no value is set):

default_lightbox_width: width of the lightbox window (default = 500)
transition: elastic|fade|none (default = elastic)
speed: transition speed (default = 350ms)
initialWidth: initial width of the Lightbox Window [in pixels or percent] (default = 300px)
initialHeight: initial height of the Lightbox Window [in pixels or percent] (default = 100px)
width: force a width of the Lightbox Window using the outer width of the entire window [in pixels or percent] (default = false)
height: force a height of the Lightbox Window using the outer height of the entire window [in pixels or percent] (default = false)
innerWidth: force a width of the Lightbox Window using the inner width of the entire window [in pixels or percent] (default = false)
innerHeight: force a height of the Lightbox Window using the inner height of the entire window [in pixels or percent] (default = false)
maxWidth: set a maximum width for the window [in pixels or percent] (default = false)
maxHeight: set a maximum height for the window [in pixels or percent] (default = false)
scalePhotos: whether to scale images if a maxWidth, maxHeight, innerWidth, innerHeight, width, or height have been defined [true|false] (default = true)
scrolling: whether to generate scrolling content if the image size exceed the size of the window [true|false] (default = true)
opacity: Opacity of the screen overlay [range: 0 to 1] (default = 0.85)
loop: whether to allow a `Next` link back to the first image after the last image is reached (default = true)
slideshow: whether to generate a slideshow [true|false] (default = false)
slideshowSpeed: transition speed for slideshows in ms. (default = 3500)
slideshowAuto: If slideshow is enabled, whether the slideshow should automatically begin [true|false] (default = false)
slideshowStart: Text for the Slideshow Start control (default = “Start Slideshow”)
slideshowStop: Text for the Slideshow Stop control (default = “Start Slideshow”)
previous: Text to display for the `Previous` image button (default = ‘Previous’)
next: Text to display for the `Next` image button (default = ‘Next’)
close: Text to display to close the window (default = ‘Close’)
top: Set top vertical positioning of window [in pixels] (default = false)
bottom: Set bottom vertical positioning of window [in pixels] (default = false)
left: Set left horizontal positioning of window [in pixels] (default = false)
right: Set right horizontal positioning of window [in pixels] (default = false)
fixed: Sets a fixed position for the window [true|false] (default = false)

=======================================================
For ZoomBox, you will need to create a large version of your products images and name them the same as the corresponding product image but with a particular suffix, for example, using the default suffix “_zoom”:

the large version of:

product_image.jpg

would be called

product_image_zoom.jpg

If you change this suffix to something other than the default of _zoom, you will need to update the zoom_suffix value zoom_config section of the script:

zoom_suffix: ‘_zoom’

to:

zoom_suffix: ‘_your_custom_suffix’

The following options may be customized in the zoom_config section of the script (a value of ‘false’ should be used if no value is set):

zoomWidth: width of the zoom window in pixels (default = “auto”)
zoomHeight: height of the zoom window in pixels (default = “auto”)
position: the position of the zoom window relative to the small image (default = “inside”)
adjustX: fine tune the x-position of the zoom window in pixels (default = 0)
adjustY: fine tune the y-position of the zoom window in pixels (default = 0)
tint: set a tint color to cover the small image. Colors should be specified in hex format, such as ‘#aa00aa’ (does not work with softFocus)
tintOpacity: opacity of the tint [range: 0 to 1] (default = 0.5)
lensOpacity: opacity of the mouse pointer lens [range: 0 to 1] (default = 0.5)
softFocus: set to true to apply a soft blur to the regions of the image outside of your mouse magnifier [true|false] (default = true)
smoothMove: smoothness of the zoom effect as you move your mouse lens over the image [1 = no smoothing, higher integers = more smoothing] (default = 3)
showTitle: show the title tag of the image (default = true)
titleOpacity: opacity of the title [range: 0 to 1] (default = 0.5)

5. After this code is in place in your template, be sure to regenerate (Utilities -> Publish -> Regenerate). This code supports up to 10 extra product images.

]]> https://support.lexiconn.com/news/forums/topic/limiting-the-length-of-shopsite-checkout-fields/#post-48797 <![CDATA[Limiting the Length of ShopSite Checkout Fields]]> https://support.lexiconn.com/news/forums/topic/limiting-the-length-of-shopsite-checkout-fields/#post-48797 Mon, 12 Sep 2011 16:33:03 +0000 Anonymous You can use the following javascript on your checkout page to limit the length of text fields. It can be entered in:

Commerce Setup > Order System > Checkout Screen – Text at the bottom of the Checkout screen:

 

<script type="text/javascript"> 
 
 window.onload = function(){ 
   var LimitCheckout = { 
     useBilling: document.billing.usebilling.checked, 
     commentsBox: document.billing.Comments, 
     commentsLimit: 0, 
     billing_fields:[{ 
         Email: 0, 
         Title: 0, 
         First: 0,    
         Middle: 0, 
         Last: 0, 
         Suffix: 0, 
         Company: 0, 
         Address: 0, 
         Address2: 0, 
         City: 0,    
         Zip: 0, 
         Phone: 0 
    }], 
     shipping_fields:[{ 
         ShipTitle: 0,    
         ShipFirst: 0,      
         ShipMiddle: 0, 
         ShipLast: 0, 
         ShipSuffix: 0, 
         ShipCompany: 0,    
         ShipAddress: 0,    
         ShipAddress2: 0,    
         ShipCity: 0, 
         ShipZip: 0,            
         ShipPhone: 0 
     }], 
     limitCommentBox: function(l_val){ 
         document.billing.Comments.onkeyup = function(){ 
           if (document.billing.Comments.value.length > l_val) { 
             document.billing.Comments.value = document.billing.Comments.value.substring(0, l_val); 
           } 
         } 
 
         document.billing.Comments.onkeydown = function(){ 
            if (document.billing.Comments.value.length > l_val) { 
               document.billing.Comments.value = document.billing.Comments.value.substring(0, l_val); 
            } 
         } 
     }, 
     setFieldLimit: function(l_field, f_limit){ 
         var limit_field = document.getElementsByName(l_field); 
         for(m=0; m<limit_field.length; m++){ 
             limit_field[m].maxLength = f_limit; 
         } 
     }, 
     limitFields: function(){ 
         
         for(var b_index in LimitCheckout.billing_fields[0]) { 
           if(LimitCheckout.billing_fields[0][b_index] > 0){ 
                LimitCheckout.setFieldLimit(b_index, LimitCheckout.billing_fields[0][b_index]); 
            } 
         } 
         for(var s_index in LimitCheckout.shipping_fields[0]) { 
           if(LimitCheckout.shipping_fields[0][s_index] > 0){ 
               
                LimitCheckout.setFieldLimit(s_index, LimitCheckout.shipping_fields[0][s_index]); 
            } 
         } 
 
         if(LimitCheckout.commentsBox != undefined){ 
             if(LimitCheckout.commentsLimit > 0){ 
                 LimitCheckout.limitCommentBox(LimitCheckout.commentsLimit); 
             } 
         } 
     } 
         
 } 
 
     LimitCheckout.limitFields(); 
 } 
 </script>

 

You will notice the script contains a list of billing fields (billing_fields) and shipping fields (shipping_fields) with a zero after each. Any field with a value of zero is not limited in length by this script. You can set any fields you would like to be restricted to the maximum number of characters you would like to allow for the field and the field will be restricted. You can also restrict the length of the text in the Customer Comments box (if you are using one on your checkout page) using the:

commentsLimit: 0

variable in the script.

]]> https://support.lexiconn.com/news/forums/topic/prevent-entering-po-box-as-shipping-address-in-shopsite/#post-48796 <![CDATA[Prevent Entering PO Box as Shipping Address in ShopSite]]> https://support.lexiconn.com/news/forums/topic/prevent-entering-po-box-as-shipping-address-in-shopsite/#post-48796 Thu, 01 Sep 2011 15:27:30 +0000 Anonymous Javascript can be used to prevent entering a PO box in the shipping address fields when items cannot be shipped to a post office box.

To prevent entering PO Boxes in the shipping address, you can enter the following script in:

Commerce Setup > Order System > Checkout Screen – Text at the bottom of the Checkout screen

<script type="text/javascript">

var post_office_message = "We are unable to offer shipping to Post Office addresses for this order.  Please enter your street address for the shipping address."

var po_regex = /^po.*box.*|^p.o..*box.*/i

function checkShipAddress(address){
if(po_regex.test(address)){
alert(post_office_message)
}
}

window.onload - function(){
document.billing.ShipAddress.onchange = function(){
checkShipAddress(this.value)
}

document.billing.ShipAddress2.onchange = function(){
checkShipAddress(this.value)
}
}

</script>

and the following code to:

Commerce Setup > Order System > Checkout Screen – Javascript added at start of built-in CheckIt function

var post_office_message = "We are unable to offer shipping to Post Office addresses for this order.  Please enter your street address for the shipping address."

var po_regex = /^po.*box.*|^p.o..*box.*/i

if(po_regex.test(document.billing.ShipAddress.value)){
alert(post_office_message)
return(false)
}

if(po_regex.test(document.billing.ShipAddress2.value)){
alert(post_office_message)
return(false)
}

This will display the message defined as post_office_message in the script if a PO box is entered in the shipping address 1 or shipping address 2 fields and prevent the customer from checking out until it is removed. This message can be customized.

If you need to prevent the use of Box as well as PO Box (or P.O. Box) you can replace each instance of the line:

var po_regex = /^po.*box.*|^p.o..*box.*/i;

with:

var po_regex = /^box.*|^po.*box.*|^p.o..*box.*/i;

]]> https://support.lexiconn.com/news/forums/topic/using-a-pointed-domain-with-shopsite-pages/#post-48775 <![CDATA[Using a pointed domain with ShopSite pages]]> https://support.lexiconn.com/news/forums/topic/using-a-pointed-domain-with-shopsite-pages/#post-48775 Fri, 25 Feb 2011 17:59:29 +0000 Anonymous ShopSite has the ability to publish files into a folder, and when combined with pointing a domain name to a folder on your hosting account you can use ShopSite to easily create pages for multiple websites at once.

Step 1 – The Pointed Domain
To use this method, a folder needs to be created in your /www/ folder (or in the folder ShopSite publishes to) with permissions of “777″. This permission setting allows ShopSite to publish files into the folder.

Example: /home/primary-account/www/new-folder/

You would create the folder and set it’s permissions using FTP, but if you’re not familiar with FTP just let us know the name of the folder and we can create it for you.

When you have the folder created just email us it’s name along with the name of the new domain name and we’ll configure the domain to point to the new folder.

NOTE: For the new domain to point to your account with us, the domain’s name servers will need to be updated to the following: ns.serverhost.net, ns2.serverhost.net, ns3.serverhost.net. That change would be made at the registrar where you purchased the domain name. We can assist with this change if you’re unfamiliar with how to do it.

Step 2 – Publishing Files
ShopSite can publish files into a folder just by changing the filename for the page. Whether it’s a regular page (Edit Page Content > Advanced Info > File Name field) or a More Information page (Edit Product Info> More Info Pages > More Info Page File Name field) you can insert the folder name before the filename.

Example: new-folder/filename.html

TIP: Use just the folder name and a “/” after it, do not put a “/” at the beginning of the folder name.

Now when you publish your site, pages with a folder in front of their name will be created in the specified folder.

TIP: Be sure one of your pages has a filename of “new-folder/index.html” so when someone visits your domain name a default home page appears. (Otherwise a filename will need to be entered when they visit the URL.)

Step 3 – Extra Files & Links

When you have a domain running from a folder on your account that folder doesn’t have any of your additional folders inside of it such as the /media/ or /published/ folders. The HTML code for your pages may try to load images or CSS files from these folders that do not exist.

A way to get around this is to sym-link these folders from your main /www/ folder into the pointed domain folder. We can setup these sym-links for you upon request. Additional folders may be needed as well, and your website designer will be able to tell you if your design uses any additional folders which should be sym-linked.

Advanced Options
If you’re going to use ShopSite’s “Assign Items” feature and let it build links to pages or products, your templates would need to be updated because ShopSite will use your primary domain name and the folder name when it builds links.

For example: http://www.primary-account.com/new-folder/file-name.html
But you want it to use: http://www.pointed-domain.com/file-name.html

An option to avoid this is to use a custom page template for the pages on your pointed domain and change this line in the “[--DEFINE LINK_TO_PAGE--]” section:

Change it to use your pointed domain name and an extra Page Field for the filename:

In this example we’re using Extra Page Field #1 to store the filename (be sure to fill it in when you create the page) and that will allow links to be built correctly when ShopSite publishes.

If you assign products with More Info pages to pages on your pointed domain the same can be done with a custom product template and an extra product field.

Another option would be to use a custom perl script which strips the folder-name out of the URL at the time the page is created and call the script in the template. This would require the creation of a perl script and a custom template but you would no longer need to use an extra field to store the filename. We can provide the script and syntax if you choose to go that route.

…

That’s all it takes – a pointed domain, folders in your filenames, and a sym-link or two – and now you can use ShopSite to publish pages under a different domain name. You can use this method to create a landing page highlighting a specific product, some regular content pages for a small website, or anything that comes to mind which you want to create with ShopSite.

]]>