FAQ

Common questions about the DreamCodes HTML Framework.

+ expand all

What is a HTML Framework?
A HTML framework is a library of HTML/CSS files that are used to make development of standards-based XHTML and CSS web pages quicker and easier. A framework typically includes a collection of pre-designed CSS styles, scripts and web apps ready for immediate use.
What are template shortcodes?
Shortcodes are pre-defined HTML/CSS codes. By adding a few line lines of codes to your webpages you can embed YouTube videos, add clickable buttons, twitter feeds or stylize your HTML tables! These are just some of the 1500+ shortcode functions available in the DreamCodes HTML Framework. To use a shortcode, simply copy the codes to your HTML document!

Shortcode Example:

Current code:

Visit Google : <a href="http://www.google.com">Visit Google</a>

To buttonize this, we include the required <CSS+JS> files and then call one of the many available "button" shortcode styles.

Updated code:
<a href="http://www.google.com" class="tsc_awb_large tsc_flat">Visit Google</a>

The browser will now render the code as:

Visit Google

How do I add shortcodes?

To add a shortcode to your page, simply toggle the "View code" link under each shortcode example.
Copy this code and paste it into your HTML document. Make sure you also add all necessary CSS/JS scripts! That's it!

Note: Make sure you include the jQuery library if any <javascript> tags are called.
<script type="text/javascript" src="dreamcodes/jquery-1.7.2.min.js"></script>

How do I add a shortcode?
To add a shortcode to your page, simply toggle the "CSS/JS files" and "View code" link under each shortcode example. Copy the codes and then paste this code into your web page. Make sure you copy and include all necessary CSS/JS scripts!

Give it a try below, press the "View code" tooggle to begin!

View code:


1. Move mouse inside this code window
2. Double click mouse to go into edit mode
3. Press Ctrl-C to copy all contents in this window.
4. The code is now in your windows clipboard. 
5. Paste this code into your web page (Ctrl-V)

         

How do I add a shortcode (visual tutorial)
In this example, we'll insert the Flat Button shortcode, found under Elements -> Flat Buttons.

1) Open the "CSS/JS files" toggle & copy its contents.
Note: Some shortcodes do not require CSS/JS files. Skip this step if code window indicates N/A.


2) Paste this code into the <HEAD> section of your web page.


3) Find desired shortcode, then open the "View code" toggle & copy its contents.


4) Paste this code into the <BODY> section of your web page.


5) That's it. Open the page in your browser to see the shortcode in action!

A shortcode is not showing up after I copy + pasted the codes!
Run through this checklist:

  • 1) Did you include/declare all necessary Javascript & CSS files for that shortcode?

  • Ensure contents under the "CSS/JS files" toggle are copied.
    e.g. DataGrid shortcode:
    <link rel="stylesheet" href="dreamcodes/datagrid/css/tsc_datagrid.css" />
    <script type="text/javascript" src="dreamcodes/datagrid/js/tsc_datagrid.js"></script>
  • 2) Did you ensure the included/declared Javascript & CSS files are placed within the <HEAD> section of your webpage?

  • 3) Did you include/declare the Javscript jQuery library file? Make sure it is called before any other JS file.
    <script type="text/javascript" src="dreamcodes/jquery.min.js"></script>
  • 4) Make sure you haven't included/declared any Javascript library files twice.

  • 5) Make sure your webpage is XHTML / HTML5 compliant. Your webpage should start with:
    <!DOCTYPE html>
    <html lang="en">
    <head>
    
  • 6) Are your file paths correct? Your web pages should be placed in the primary template folder.

    Example:
    If the dreamcodes folder is located: c:\templates\dreamcodes\
    your webpages should be placed in c:\templates\


Is there a command to clear/force a line break?
Yes, use the following codes to clear a line. This is useful in instances where <br /> fails to clear a line for a shortcode.

<div class="tsc_clear"></div> <!-- line break/clear line -->

         
Can I use this framework in other projects?
No. DreamCodes contains 3rd party code libraries that have been licensed for use only in DreamTemplate, ThemeLand & TemplateAccess products.
DreamCodes License
Reselling or redistribution strictly prohibited. See DREAMCODES-LICENSE.TXT
US copyright (protected works) filing C39843285R038, C39843415M490.


© TemplateAccess