Part 3 of your Free Guide to Building a Website
By now you should have the hang of adding pictures and editing text in the existing text boxes. You should also know how to add new pages to the site by adding them to the menu (see previous tutorial). Now let’s look at adding extra elements to a page and adding pages without them appearing in the menu – it’s the next step to help you create your own website using Webeden. Lets do it – here’s 10 steps to adding extra elements to your pages
Step 1
Click on Files to open the File Manager and then select the Library tab and click on Animations / Handwritten. Click on “Circle it” and select Use this. The animation will be added to the page. By default, the line drawn is white. Select the animation object and in the Editor dialog click on the Style tab and change the colour to black. You can also resize and rotate the animation on the Info tab (see previous page). Position the circle over the top of an area of the page that you want to draw attention to, like a picture.
Step 2
Now add the arrow from the Handwritten section in the same way. Use the Rotate feature on the Info tab to enable freehand rotation using the object’s handles. When you add a page to your site, you can choose from a list of different page types. There are different templates readily available so you don’t have to design a complicated page from the ground up, which makes for a handy shortcut when you’re website building. For example, the blog/news page will create a ready made weblog for you, together with an integrated editor to allow you to add items.
Step 3
You can also add links only, so a button appears in the menu, but no page is created (the opposite of adding a page, but not having it visible). There’s even an image gallery – one tip with images you upload is to ensure the dimensions aren’t larger than you need to keep download times down, somthing you should take not of when you create your own website.
Step 4
Now click on Insert and select Button Link. This will add a bevelled image to the page. Move it to within the left column. Click on the Link tab in the Editor dialog and enter the URL you want to link to, like http://www.webeden.co.uk/. Click on Apply and you’ll see that the text on the button changes also. Click on the Style tab and you can now change the text on the button. Do it in this order, as changing the link will overwrite the text.
Step 5
The next step on your website building fast track is to click on the More arrow in the Editor dialog (top right) and select Body Text Box (you can hover over each icon to get a tooltip). Drag the text box to the left column, underneath the button we just inserted. Use the handles at the corners and bottom of the text frame to resize it to fit within the column. Now select the Style tab and click on the Background button to enable a background for the text frame, and select a colour from the drop down menu to the right, and do the same for the border.
Step 6
An alterative when you make your own website to using the text frame’s background and border is to add a background frame, such as a shape with bevelled edges from the Library, and then add a text box on top, which will show the frame beneath it through it.
Step 7
Now go to Insert / New page and click on the Add new page button; just make it a blank page. Label the page “Chat” and then disable the radio button in the Page visible column. This will add the page to the site without it being added into your automatically generated menu. We will add a link to this new page within the master page, but to do this, you must create the page first as you cannot add a link to a non-existent page, even if you know what you are going to call it. You can still access the page to edit it from the Pages menu – a perfect website building tip.
Step 8
On the new page, double click in the title text box to edit the text and change it to “Chat to other user online” and then single click on the main text box and click on the Delete icon.
Step 9
Now click on the Files button to bring up the File Manager and from the library, select Functional and add the Chat object to the page. Close the File Manager and then resize the chat object to fill the content element of the page underneath the headline. Click on Design / Page master and remember to save the page when it asks you. Always remember this if you want to quickly build your own website!
Step 10
Add a new button link and drag it to the top right of the page, above the date. With the button selected, choose the Link tab in the Editor and select the Pages icon (it looks like horizontal lines). This allows you to link to a page on your site. Select Chat from the drop down menu and click Apply. As before the button’s text will change.
Step 11
In the Style tab change the button text to “Chat to other users”. Click on Save and Exit.
Step 12
Change to the View my site, so you can see the site as a user, rather than editing it, and you will see that we have added a fully featured chat feature to our site, all within the space of a few clicks. What an amazing what to create a website that looks professional and advanced.
Expert tip
When you add a page to WebEden, you can choose from a list of different page types. There are different templates readily available so you don’t have to design a complicated page from the ground up. For example, the blog/news page will create a ready made weblog for you, together with an integrated editor to allow you to add items. You can also add links only, so a button appears in the menu, but no page is created (the opposite of adding a pgae, but not having it visible, as we did in Step 3). There’s even an image gallery – one tip with images you upload is to ensure the dimensions aren’t larger than you need to keep download times down.
That’s all for now
Check in for part 4 to find out how to add some really cool stuff to make sure that you can build a website, and it’s the best one possible!
