Constructing a HTML Template
HTML templates can be constructed or altered by a web designer. Templates are not edited with the web editor included with the Center Dynamics software, but are instead edited locally with web or text editing software.
The template is a regular HTML file, with a few special substitution elements included to allow dynamic content to be inserted.
Center Dynamics support can place these for you by emailing them to support@centerdynamics.com. We can make test slots so that you can see new templates without interfering with the existing templates.
To edit the html template, any html editing software may be used, as can a general text editor. In either case, a knowledge of HTML is required to be able to properly set it up.
The following is a list of the required html tags and elements to include in the html template.
- The head tag must have the following at the end, before the closing </head>
- {{ HeadContent }}
- Stylesheets are linked from the head section. There are special classes that should be covered in your CSS for dynamically generated content
- See the html for Events.aspx and other pages for details on these classes
- Many of the dynamic pages utilize jQuery. Include a link to this file in the head. Below is an example of a Google hosted version:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
- The content area should be specified as such:
{{ MainContent }} -
The copyright footer is automatically generated with the current year, and can be placed near the bottom of the page
{{ FooterLicense }} -
Optional: You may dynamically switch page content, based on if the customer is signed in, by using the following code tags:
{{ if SignedIntoDashboard }}
<li><a href="dashboard.aspx">My Dashboard</a></li>
<li><a href="default.aspx?signout=y"><b>Sign Out</b></a></li>
{{ else }}
<li><a href="dashboard.aspx"><b>Sign In</b></a></li>
{{ end }}
- If you are using a JavaScript analytics package, such as Google Analytics, please remember to include it in the html template.
- Important note: Since our server is 100% SSL, all absolute links to external resources, (images/css/jss/etc) must be SSL (https) or browsers will not be able to load them for security reasons.
If you are making a 'dual site', meaning Center EX will serve as a sister, parallel site to a different web server, you will need to either:
- Reproduce all content (images/css/js) in the Center EX folders
- Or, Link absolutely with SSL back to the main site
- For example, if your center ex site is centerex.sbdc.com, and your main public site is sbdc.com, an absolute link to an image or css or js must be https://sbdc.com/image
- Since Center EX uses SSL, 100% of the links to other sites (such as the sister parallel site) must also be SSL.
The following are recommendations for optimal master pages
- We highly recommend images go in a /images folder, css in a /css folder, and scripts in a /js folder.
- These special locations are will be in the future be accessible by the built in editing tools and these folder names will not collide with our internal code.
- Be sure to leave enough width to prevent horizontal scrollbars for the dynamically constructed pages.
- The mapresults.aspx page in particular contains a dynamic map and needs quite a bit of width, so be sure to check your design with this and other dynamic pages.
Public Site Overview