| Introduction |
HammerKit is a complete solution to the challenge of creating and deploying websites. The difference with HammerKit is that you build using components inside a visual interface, rather than code with HTML. This tutorial is designed to get you familiar with the interface and the methods for building new websites.
To get the best out of this tutorial, sign-up for your own HammerKit Studio at www.hammerkit.com |
|
Step 1 - Create a new site
|
First, lets create a brand new site so we can begin from a blank canvas. To do this, log into your HammerKit Manager site at [yoursitename].hammerkit.com. Use the administration name and password you received when you signed up for HammerKit.
Once you have logged in, click SITES to see a list of the current sites you have. Next, click the �NEW SITE� button and follow the steps to create a completely new site. Once you have done this, go back to the SITES list and click on the admin link next to the site you created.
Now lets move to Step 2 and add our first component. |
|
Step 2 - Add your first component
|
| Once you have clicked the admin button next to the site name you will arrive in the studio tool for that site. From here you can create and develop your site, edit content, control user access - in fact you can control everything related to the way your web site will function.
What makes HammerKit unique is that we do not use HTML to create web sites - we use components.
To add a component, click CONTENTS from the top menu bar to open the content editor screen. On the left hand side is where the components are stored. To create a new component click the button on the left side of the screen. The screen should look like this:
Give the component a name, untick the access control selection and leave the chooser for type of component saying �Page�. You can change the name of the component later by typing the new name in the title bar of the component and pressing save.
Now we can begin to add elements to the component in Step 3.
|
|
Step 3 - Add your first element
|
Now we can add our first element to the component. To do this, select the text element by pressing the button that looks like this on the button bar.This will open a text editor window that looks like this.
Type a message in the text area. You can use the formatting buttons and styles to alter the look and style of the text. When you have finished adding text click DONE to return to the component. You will now see your element displayed in the component with a small green box next to it. This is the control box - to edit the element, double click the control box.
Once you have saved the element we are ready to preview it. Lets move to Step 4.
|
|
Step 4 - Saving and previewing your component
|
Now press SAVE to store your component and click VIEW PAGE under the COMPONENT MENU at the top of the page.
This will display your component in a new browser window. You have now created a new web page with a single component and a single element.
The text element is one of 8 basic elements in HammerKit. Try experimenting with the other elements. To do this, click on the name of your component shown on the left-side of the screen and try adding another element.
They are, from the left: Text, Picture, Link, File, Table, Form, Module, Line Break
|
|
Step 5 - Using components
|
The heart of HammerKit is the ability to embed components inside other components. To test this, add a second component by following steps 1 & 2. Now click the component include button in the element button bar. It looks like this:
Click the symbol in the element button bar. This is the component include element and it will open a window that looks like this:
Choose the component to include by clicking BROWSE and selecting the first component you created. Click DONE when you have completed this. Your screen should look something like this:
Now press SAVE to store the new component and ciick VIEW PAGE from the component menu to see the results. You have created a new page simply by including the first component you created. There was no need to add the elements again, and if you edit the first component, the second one is automatically updated to. This is the foundation for HammerKit, and it is what we believe makes our approach more efficient than traditional editors and HTML coding.
That's really all there is to creating sites, adding components, adding elements and using components with HammerKit. Now it is just up to you and your creativity to work with the elements and components and build yourself new sites and services. |
|
Finished!
|
Five Steps to creating your first pages with HammerKit
So, to summarise:
- add a site with the HammerKit manager
- add a component
- add a simple element, like text, image or link
- save and preview the page
- embed the component inside another component
If you have any questions about this, or would like some help, post your question on designer.hammerkit.com and one of the team will assist you. |
|
