Cascade in 60: Making Templates from HTML Pages

By Lauren Murray — Thursday, November 3rd, 2016 at 11:00am
Cascade in 60: Making Templates from HTML Pages 

In this Cascade in 60 spotlight, we walk users through creating templates using HTML. Templates are the heart and soul of how pages are built in Cascade, and they typically begin as regular HTML web pages. To begin creating a template, you will need a text editor (Coda, Notepad++, Notepad, or similar program), and your design downloaded to your computer. Get the full details below.

Check out the video on our Cascade 8 Knowledge Base here.

1. Under “Manage Site,” select “Configurations.” Click on “Go to Configurations.”

Cascade in 60 Making Templates from HTML Pages 1

2. When choosing a page type from the Configuration list, the template used is listed in the details.

Cascade in 60 Making Templates from HTML Pages 2

3. In your text editor, copy your web HTML to your computer’s clipboard. It can be from scratch, a mockup, or even a downloaded version of your current website.

Cascade in 60 Making Templates from HTML Pages 3

4. From the “Add Content” menu, click to create a new Template in your Cascade CMS site.

Cascade in 60 Making Templates from HTML Pages 4

Cascade in 60 Making Templates from HTML Pages 5

5. Paste your HTML into the editor.

Cascade in 60 Making Templates from HTML Pages 6

5.1. Add metadata tags to the <head> area of your page.

Cascade in 60 Making Templates from HTML Pages 7

Cascade in 60 Making Templates from HTML Pages 8

5.2. Visit http://www.hannonhill.com/cascadecms/8/kb/pages/system-tags.html for a full list of tags.

5.3. We use <system-region> tags as content placeholders. Here, the navigation area becomes a navigation region.

Cascade in 60 Making Templates from HTML Pages 9

Cascade in 60 Making Templates from HTML Pages 10

5.4. Keep your deleted HTML handy - you may need it later as you start to flesh out your layout.

5.5. Generally, you’ll be replacing areas of HTML you may want to change over time with system-region tags, giving you added flexibility with your content.

5.6. System-regions are responsible for sections of static content or dynamic content, by the use of Blocks and Formats.

Cascade in 60 Making Templates from HTML Pages 11

5.7. Be sure to close all of your HTML tags (<div>, <p>, <section>, etc.). If you don’t, Cascade will close them for you, but it might not be exactly how you wanted.

5.8. Your main/primary content should have a special region designation: DEFAULT. Every template must have a DEFAULT region.

Cascade in 60 Making Templates from HTML Pages 12

5.9. Continue replacing content with <system-region> tags until you’ve reached the end of your HTML file. The new Template should start to look a lot smaller than your original.

5.10. Save your Template by clicking “Save & Preview.” Now you may begin fitting it into a Page by adding it to a Configuration output.

Cascade in 60 Making Templates from HTML Pages 13

5.11. Select “Submit” to complete.

Cascade in 60 Making Templates from HTML Pages 14

 

Check out the video on our Cascade 8 Knowledge Base here.

Subscribe to our blog via RSS Download RSS

Hannon Hill Corporation

3423 Piedmont Road NE, Suite 520
Atlanta, GA 30305

Phone: 678.904.6900
Toll Free: 1.800.407.3540
Fax: 678.904.6901

info@hannonhill.com

GSA Contract Holder

JOIN OUR MAILING LIST

CONTACT US