Developer's Guide for Creating Templates for the Breeze Website Builder™

Building template-ready websites is easy.  Just create your website in the Breeze Website Builder™ using the following guidelines:

Template Builders Guide

<img src="/images/logo.gif" id="logo" alt="Our Logo" />

Wrong: <div id="tagline"><p>My Tagline</p></div>

Correct: <div><p id="tagline">My Tagline</p></div>

You will want your template to be as "read-to-go" as possible such that users can install your template and just add content.  Defining your content classes is important to eliminate the need to manually format text and so forth. We recommend that (as a minimum) you create the following sub-classes and define the styles for:

Other things to consider:

You will want to click Load Browser Reset CSS is the CSS editor for the site style sheet. This will help ensure that your template looks the same no matter what browser is being used to see the site. Also, many sites are centered in the browser window to accommodate the various screen sizes available. You can click Setup For Centered Sites is the CSS editor for the site style sheet to do this automatically. And if you want your template to have sticky footers (a footer bar the remains at the bottom of the browser window no matter if there is a vertical scroll bar or not), then you can click Setup For Sticky Footer is the CSS editor for the site style sheet.

Your template should work for mobile devices as well. Be sure to setup mobile styles and menus. If you want the website to flow (wrap items down when horizontal space is limited) you should uncheck Use Table Structures and Use Table Structures on Mobile under Change Site Options. This will cause the table structures to not show up in the page template layout files, and your site may be designed 100% div based.

If you want to store pages with plugins, such as a splash page with a horizontal-scrolling slideshow, note that the system (as of this time) will not support more than one plugin per page. You should recall any plugin that has an associated style sheet IF you do not have any custom styling specific to your template for that plugin. This will ensure that the plugin styles are taking from the latest stock styles bundled with the plugins rather than some outdated or modified styles that happen to be in your Breeze installation.

 

Available Page Names in the Wizard

Available Page Name

Submitting Backup Files for Template

To send us your template you can use the Breeze Website Builder's built-in Backup and Restore feature. Just backup the site and download that back. Also send a screenshot of your template. But to reduce the number of things that we would need to do to get your template into the repository, make sure that you use these settings in the /connect/config.php file:

// *** Site Base Folder ***
// Do not include leading or trailing slashes. For web root level leave empty.
// Examples:
// Webroot: ''
// Folder: 'mywebsitefolder'
// Nested folders: 'mywebsitefolder/mywebsitesubfolder'
define('BWB_BASE_DIR', '');

// *** Webpage Folder ***
// Leave empty for webroot, i.e. ''
define('BWB_WEBPAGE_DIR', '');

// *** Image Folder ***
// Cannot be empty.
define('BWB_IMAGE_DIR', 'images');

// *** CSS Folder ***
// Cannot be empty.
define('BWB_CSS_DIR', 'css');

// *** Flash Folder ***
// Cannot be empty.
define('BWB_FLASH_DIR', 'flash');

// *** Media Folder ***
// Cannot be empty.
define('BWB_MEDIA_DIR', 'media');

// *** Scripts Folder ***
// Cannot be empty.
define('BWB_SCRIPTS_DIR', 'scripts');

// *** Library Folder ***
// Cannot be empty.
define('BWB_LIB_DIR', 'php');

// *** Fonts Folder ***
// Cannot be empty.
define('BWB_FONTS_DIR', 'fonts');

// *** Table Prefix ***
// You may want to use a table prefix, especially if the Breeze Website Builder must share the same database as another application.
// Include an underscore if your table names will have a prefix with an underscore. This is more typical of table prefixes.
// i.e. 'BWB_'
define('BWB_TABLE_PREFIX', 'bwb_');