HotDoodle Logo
Custom Theme: Layouts

Layouts are preprocessed HTML files with callouts to replaceable content. The site chooses a layout that is the default for all pages, but each page gets to choose a layout variation if needed. These choices really just affect which HTML file will be preprocessed and used to present the page.

Example: Having a sidebar on one side, on both, or not at all generates unique sets of basic HTML structure for the site.

  • This is the only part of the Template that has an advanced feature that allows you to change any of the HTML that makes up a site. All other HTML is generated by the HotDoodle engine and cannot be edited.

HotDoodle offers two options for modifying the Layout and the structure within the Layout:

  • Configuring your layout allows you to choose where to implement sidebars, footers, headers, etc.
  • Fine-tuning your layout allows you to choose what Block content is available in the Header, Sidebar, Footer, etc.

To configure Layout:

  1. The CSS can be edited directly in the text field, or copied out and back in if you have a different text editor you prefer using.
  2. When changes are complete, click Save as a Custom Look button and preview it.
  3. On Control Bar, click either Return to main page or New Window, whichever you prefer for previewing.
  • Select Theme button | Save this Theme and Layout if you like it
  • Or, Select Theme button | Cancel Theme and Layout previewing if you don’t
  • Or, Select Theme button | Configure Layout to go back to the list of Layouts and choose another

To fine tune Layout:

  1. Make sure you are in Edit Mode, if not, click the Edit button on the HotDoodle Toolbar to enter Edit Mode. More buttons will appear on the HotDoodle Toolbar.
  2. Click on "Appearance" -> "Select Layout"
  3. Your current Layout is labeled *Current Layout, click the thumnail for the layout you would like to preview
  4. Click "Save Theme" on the HotDoodle Toolbar if you like the layout changes, or click "Cancel Preview" if you want to return to your Layout without saving changes. 

Note: Recommend making note of your original choice, just in case you go back to it.

Example of what can be set via Fine Tune Your Layout:

  • What goes in the header (logo + text, a navigation bar, a picture block, or a general block, etc.)
  • What goes in each sidebar
  • If the main area has a built in You Are Here block
  • What goes in the footer

If none of the pre-build Layouts work, you can make a copy of the current Layout or the Layout closest to your needs, and then customize the HMTL. To do this:

  1. Search the page for the Layout marked “Current Layout”
  2. Click on “Copy and Customize this Layout” link below the Layout thumbnail image
  3. Enter a name for your new Layout, and click the "Save this as a new custom layout button"
  4. Once it is saved, you can edit the HTML directly and then preview your changes

Note: Layouts have a few things such as the control bar that really should be present. Other things like the headers generally should be present but might be omitted if the layout is intended for use as a pop-up.

© 2006 - 2015 Metabyte, Inc., All Rights Reserved, Patents Pending, HotDoodle™ Custom Web Design and Quality Affordable Website Designers for Small Businesses and Professionals
Powered by, HotDoodle™ Custom Web Design and Quality Affordable Website Designers for Small Businesses and Professionals
Quality Affordable Website Design Templates Site Map