Skip to main content

Integrate a CDN resource with X-Cart 4.4.x

X-Cart 4.4.x can serve skin, image, and cache assets from a Orange's CDN custom domain by editing core PHP and Smarty files. These steps apply only to X-Cart 4.4.x. X-Cart 5.x uses a different architecture and is not covered here.

Create a CDN resource before starting the integration.

Back up the site files and database before making changes. Core file edits are overwritten by X-Cart upgrades — reapply them after each upgrade if needed.

Before editing X-Cart, collect the custom domain value to use in the code samples — it typically looks like cdn.site.com. Replace every cdn.site.com occurrence with that hostname, and replace every shop.example.com occurrence with the storefront hostname:

  1. 1

    Open the CDN resource

    In the CDB Customer Portal, navigate to CDN > CDN resources and open the resource.

  2. 2

    Copy the custom domain

    Note the custom domain shown for the resource — this is the hostname to use in the X-Cart file edits. Do not use the CDB target hostname (cl-****.gcdn.co).

  3. 3

    Confirm the DNS CNAME

    Confirm that the custom domain has a CNAME record pointing to the CDB target hostname shown in the Customer Portal (cl-****.gcdn.co).

  4. 4

    Confirm SSL

    Confirm the custom domain has a valid SSL certificate so assets can load over HTTPS.

  5. 5

    Test origin asset paths

    Request a known skin file, image, and generated cache file directly from the configured origin. Use the same paths that X-Cart exposes for each file, and confirm that the responses contain the expected assets instead of 403 or 404 errors.

Then update X-Cart. Use either a dynamic or fixed skin path in smarty.php, then apply the remaining file edits.

  1. 1

    Rewrite skin and image URLs

    Open smarty.php in the X-Cart root directory. Find:

    $smarty->assign('ImagesDir', $xcart_web_dir . $smarty_skin_dir . '/images');
$smarty->assign('SkinDir', $xcart_web_dir . $smarty_skin_dir);

    Replace those lines with one of the following blocks. Both options use HTTPS because the custom domain requires an active SSL certificate:

    1. Use the dynamic skin path to keep the active $smarty_skin_dir value:
    $smarty->assign('ImagesDir', "https://cdn.site.com" . $smarty_skin_dir . '/images');
$smarty->assign('SkinDir', "https://cdn.site.com" . $smarty_skin_dir);
    1. Use the fixed skin path to hardcode the ideal_comfort skin. If the store uses a different skin, change ideal_comfort to that skin directory name:
    $smarty->assign("SkinDir","https://cdn.site.com/skin/ideal_comfort");
$smarty->assign("ImagesDir","https://cdn.site.com/skin/ideal_comfort/images");
  2. 2

    Rewrite deferred cache URLs

    Open /include/templater/plugins/function.load_defer_code.php. Find:

    $cacheWebFile = $var_dirs_web['cache'] . '/' . $label . '.' . $md5Suffix . '.' . $type;

    Replace it with the following code. It preserves $var_dirs_web['cache'], so the HTTPS URL follows the configured X-Cart cache path:

    $cacheWebFile = "https://cdn.site.com" . $var_dirs_web['cache'] . '/' . $label . '.' . $md5Suffix . '.' . $type;
  3. 3

    Rewrite the file URL location

    Open /include/func/func.files.php. Find, but don't replace:

    global $config, $sql_tbl, $xcart_dir, $current_location;

    Immediately after that line, add:

    $current_location = 'https://cdn.site.com';
  4. 4

    Rewrite category image URLs

    Open /include/templater/plugins/function.get_category_image_url.php. Find:

    return func_convert_amp(func_get_image_url($category['categoryid'], 'C', $category['image_path']));

    Replace it with the following code, using the storefront hostname in place of shop.example.com:

    return str_replace("shop.example.com", "cdn.site.com", func_convert_amp(func_get_image_url($category['categoryid'], 'C', $category['image_path'])));
  5. 5

    Rewrite banner image URLs

    Open /skin/common_files/modules/Banner_System/banner_rotator.tpl. Find:

    src="{$content.image_path|amp}"

    Replace it with:

    src="{$content.image_path|amp|replace:'shop.example.com':'cdn.site.com'}"
  6. 6

    Clear X-Cart caches

    Run the cleanup.php utility from the X-Cart root URL to clear compiled Smarty templates. Clear the contents of var/cache through the store's standard deployment process if generated application cache files remain, but retain the directory and its permissions.

  7. 7

    Confirm the integration

    1. Open the browser developer tools.
    2. Select the Network tab.
    3. Refresh the page.
    4. Confirm that static files load from the custom domain instead of the original domain.

    If the browser blocks fonts referenced by skin CSS, configure CDN responses for the font files to include an Access-Control-Allow-Origin header. Set the header to the storefront origin, or to * only when unrestricted public font access is appropriate.