Why is my eContent not working in CCH® Site Builder?

CCH Site Builder eContent with Simple iframe content will work on HTTPS. The Advanced code will work on HTTPS. However, CCH eContent cannot work in mixed mode, meaning you cannot have some content links referencing HTTP and other referencing HTTPS. If using absolute link references for CCH content snippets, find all HTTP references and change to HTTPS.

If you are experiencing technical difficulties implementing the eContent code you were provided, please check the following:

  1. Have you uploaded the eContent files/folders to your root directory? The cch_key and cch_key.txt files should be in the root public folder of your site. The folders inside the cch_econtent folder of the ZIP file (cch_js, cch_css, and cch_images) should also be in the root folder. You should be able to go to your website with the additional URL to the key files and see a key number displayed: www.mywebsite.com/cch_key (if on a linux server) or www.mywebsite.com/cch_key.txt (if on a Windows server).
  2. Have you uploaded your CCH Key to the root directory? The cch_key and cch_key.txt files should be in the root public folder of your site. The folders inside the cch_econtent folder of the ZIP file (cch_js, cch_css, and cch_images) should also be in the root folder. You should be able to go to your website with the additional URL to the key files and see a key number displayed: www.mywebsite.com/cch_key (if on a linux server) or www.mywebsite.com/cch_key.txt (if on a Windows server).
  3. Have you provided your domain/test domain to Site Builder Support? Once the site is moved to final host, any references in the code snippets need to be change to the actual domain and CCH Site Builder Support should be notified to make this change to the administration of the account as well.
  4. Have you deleted all but ONE jQuery library reference? Make sure it’s being called before/above the eContent and jQuery UI.
  5. Place the Link References in the HEAD section of the of the page.  User-added image
  6. The remaining snippet of the SCRIPT and DIV sections go into the BODY section of the page.

A word about HTTP and HTTPS.

In this day and age of webpage security, one should not use mixed or cross-platform security. All browsers generally now warn about mixed content or cross-platform coding and will block the non-secure elements.

If the page with the code snippets is an HTTPS page, then the references to explicit URLs in the code snippets must also be explicit. With the 3.5.1 version of the eContent snippets (Advanced or Simple iframe), the snippet now support security-neutral coding. See the iframe snippet in the image below.
User-added image
Sometimes the security-neutral just refuses to work. In such cases the HTTPS Explicit URL should be used as in above image). This will also apply to URLs in the Advanced snippets.

Best practice is to ALWAYS use the 3.5.1 (default) version from the Finalize page of the Site Builder wizard for eContent. Selecting 3.5.1 as the version ensures that you always have the latest (correct) version for the ZIP file and for the snippets.

The most common reasons eContent fails are:

  • no cch_key file is at the root of the public pages folder.
  • the cch_js, cch_css, and cch_images folders have not been extracted and placed at the root public folder (REQUIRED if using Advanced snip[pets).
  • Mixed or cross-platform references in coding.

Wordpress users:

  1. Have you installed a code insert plugin? Wordpress generally alters the code snippets with extra beginning and ending paragraph marks for every line when pasted into the HTML editor of Wordpress. For this reason, you should use a code insertion plugin. Look for one that has high usage rates and also has fairly recent updates. Avoid ones that haven't had updates for a year or more. Generally, these inserters provide a "shortcode" that is then inserted into the HTML editing window of the page editor. The better ones will have a button on the TinyMCE/WYSIWYG editor for inserting the shortcode from a list of defined snippets.
  2. RocketTheme, Weebly, and Wix will not work with our code.
  3. If you are hosted on GoDaddy using WordPress, know that GoDaddy provides FTP access to the "backside" of the hosting server for your account. When in your control panel, there is an option that shows SFTP and then a View link beside it. Click this link to give your credentials for the SFTP connection to the server. You will need an SFTP program such as FileZilla. You will place our files from the ZIP file downloaded from the CCH wizard into the HTML folder. The folder structure of GoDaddy Wordpress is as follows:
    • (root)
      • Home
        • (specific folder name to your account)
          • HTML
  4. You might need to use absolute paths to the files/folders extracted and uploaded for CCH. In the snippets, the statement src="cch_js/cch_econtent_js.js" is a relative path to where the folders from the ZIP were extracted. Wordpress utilizes a folder structure that is sometimes difficult to predict especially for custom Wordpress installs. You might need to use absolute paths to the resources of the ZIP.file: src="//mywebsite.com/cch_js/cch_econtent_js.js" or src="//www.mywebsite.com/cch_js/cch_econtent_js.js". Alternatively, you might find that this will work as well: src="../cch_js/cch_econtent_js.js" which goes up one level of folder. This alternative method might work in Draft or preview, but not on published pages because the preview's relative path is different from the published relative path.
  5.  It is recommended to change the statement in CCH code snippets $(function() { to jQuery(document).ready(function($) {.
If your page is displaying blank in spite of any of the above suggestions, it might be the downloaded cch_econtnet_js.js file. Attached to this case is an updated/patched .js file.
  1. Download it.
  2. Rename it with a.js extension. (Renamed because most email systems and online uploads will block .js files.)
  3. Replace the file that is in your cch_js folder on your website.
INSTRUCTION FOR Wordpress  Developers

A customer developer made some helpful suggestions for Wordpress developers
 :
  1. Add the CCH scripts to WordPress by editing the functions.php file (using a child theme is recommended).
User-added image
 
  1. Open the JS file in cch_js/cch_econtent_js.js and wrap the complete code in document ready function as shown below (this will allow code with “$” to be executed).
User-added image
 
  1. Finally, add the html to the website front end. WordPress allows you to write html code in the default editor and almost all page builder will have a HTML/Code widget
User-added image

 
  Solution Tools
 Solution Id 000197484/sw42196
 Direct Link
To provide feedback on this solution, please login.

Your feedback about this article will help us make it better. Thank you!