|
Once you have signed on with DesignOwnWeb
you will receive this page with all the links live.
For those interested in receiving assistance to get you up and running with a 5 page professionally designed website and for you to then take control of your own website after that, please go to:
http://www.designownweb.com/GetitBuiltForYou.html
We recommend you do it yourself as it is so easy but the service above has been provided to customers requiring additional assistance in getting you started.
We want to help you build the best website possible. This tutorial shows you how to edit your webpages, add new pages, and manage your existing pages. In short, it shows you everything you need to know about building a good website and will lay the foundation for using some of the more advanced features of the builder.
Printing This Tutorial
We recommend that you print this tutorial now and follow the tutorial with your website. To print this page, click on the print button in your browser. It often looks similar to this:
or
Click here to print this page
You can also click 'File' on your browser and click on 'Print'.
Overview
- Logging into Your Website
- Editing Your Page
- Formatting Text
- Using Photo Library Images
- Using Your Own Images
- Logging Out of Your Website
- Internet Marketing
(May take a while to down-load)
Before editing, you must be logged in to your website. Logging in is how your website identifies you as the website administrator. The website administrator is the person with the ability to edit the website.
Am I Already Logged In?
If you just built your website and see the toolbar at the top of your web page, you are already logged in.
How to Login
- Go to the DesignOwnWeb.com home page at the following URL: (Once you have signed on all the links on this page will be live)
- Click the 'Login' link at the top right of the page.The login page will appear.
- Enter your 'Website ID'. Your website ID is the website name that you chose when you signed up. It's what comes after 'www.' and before '.designownweb.com'. For example, if your website is 'www.mysite.designownweb.com' then you would enter 'mysite'.
- Enter your 'Password'. If you forgot your password, you can probably find it in the email we sent to you automatically. If you can't find it, click 'Click here if you forgot your website name or password' on the login page.
- Click the 'Login' button.
You should now be logged into your website.
Step 2. Editing Your Page
To edit a web page, go to the page you wish to edit by clicking it in the index. In this example the index appears on the left, but for your website it may appear along the top or right side of the page. Usually the first item in the index is your 'Home' page.
Once you're on the page you wish to edit, click the 'Edit Page' button in the toolbar at the top of your page.
The editing page looks something like this:
To change the layout of your web page (i.e. where the image appears on the page) click the 'Change Layout' tab. This tab only appears for the Web Page and Catalog page types.
The editing page looks something like this:
The five layouts on the top row and the one on the bottom right titled 'Center' all contain one image each and are edited in a similar manner. To select a layout, click on it. In this example, we clicked on the 'Single Left' layout.
The web page layout changes automatically to the new 'Single Left' layout. Note that the image is now aligned to the left.
Editing the Page Title and Subtitle
To edit the title and subtitle of the web page, click inside the 'Title' or 'Subtitle' box and enter a new name. You don't have to have a title or subtitle, and can keep one or both blank if you wish.
To the right of the Title and Subtitle are formatting options. You can bold, italicize, change the text size or change the color.
To change the font - click the down arrow beside 'Arial'.
To change the text size - click the down arrow beside '16'.
To bold text - checkmark the box to the left of 'B'.
To italicize text - checkmark the box to the left of 'I'.
To change text color - click the color sample square and click on the color you want. You can also choose to enter the hexadecimal color code.
Editing the Page Contents
On the editing page, you'll see a big box lower down the page with buttons at the top that look similar to those on the Microsoft Word toolbars. This is the text editor and it comes in two versions, Basic and Advanced. The Basic editor allows you to enter text, but does not allow for formatting unless you know how to use HTML. For the purpose of this tutorial, we'll be giving you instructions for the Advanced editor.
To edit the contents of your web page, click in the text editor box then type the text you want to appear on your page. The Advanced text editor works similarly to common word processing software like Microsoft Word, which makes it familiar and easy to learn. You'll learn how to use the special editor commands in Step 3 - Formatting Text
Editing the Image (more info later...)
Beside the text box there's an image with a button under it that says 'click to change'. Click this box to choose an image from our image library or to add your own pictures. This will be described in more detail in Step 4 and Step 5 of this tutorial.
Saving Changes
When you are finished making changes, click the 'Save' button at the bottom of the page. You'll now see your page with the changes displayed on your screen.
Step 3. Formatting Text
This part of this tutorial shows you how to format text using the Advanced editor. This editor has a lot of features, but in this tutorial we'll only be covering the most commonly used functions.
- Click the 'Edit Page' button on the toolbar at the top of the page you want to edit.
- Click inside the text editor box.
To format text, the text you want to format must be selected or highlighted. To select text, move your mouse cursor in front of the text you want to select. Click the mouse button and hold the mouse button down while you move your mouse to the end of the text you want to select. Release the mouse button.
Fonts and Formatting
To change the formatting of the text:
To change the font - click the down arrow beside 'Arial'.
To change the text size - click the down arrow beside the box named 'Size'.
To bold text - click the 'B' button.
To italicize text - click the 'I' button.
Alignment
You can choose to have your text to the right, left, centered, or justified on your page. To align your text to the:
Left - click the left button
Center - click the center button
Right - click the right button
Justified - click the justified button
Adding a List
To add a list to your text, select the text then click the appropriate icon in the toolbar:
Bulleted List - click the bullets icon.
Numbered List - click the icon with numbers.
Adding a Link
To put a link on your page to another page in your own website or to another website, you just have to type out the web address and it will automatically turn into a link.
Alternatively, if you would like to have the text you click on to be different from the link address, you can do the following. Type the text you want to turn into a link. Highlight it and click the 'link' icon in the toolbar:
A dialog box that looks something like this will appear:
Enter the web address of the web page you want to link to in the 'URL' field. In this example, we decided to add a link to Yahoo. Remember to include the 'http://' at the beginning of the web address. After you are done, click the 'OK' button.
How to promote our software and earn a constant income.
When it comes to promoting our software through the hyperlinks,
these are the steps to take.
After signing up to promote our software you will be sent a code
through to your e-mail from us which you need to copy and paste
into the URL space as described above. Click “OK” and the link
will be live for you to earn a constant income through this link.
To learn more about this promotional link go to:
www.DesignOwnWeb.com/Affiliate.html
(This will cover your monthly hosting fees and recoup your initial
purchase costs as well as earn you a constant income.
Set it up once and forget about it)
Changing Text Color
To change the text color, select the text you want to color then click on The 'Text Color' button and select the color you'd like.
The text is instantly changed to the color you chose.
Saving Changes
To save the changes you just made, click the 'Save' button at the bottom of the editing page.
Step 4. Using Photo Library Images
This part of this tutorial will show you how to use images from our photo library on your web page.
- Click the 'Edit Page' button on the toolbar.
- Click on the image box or on the button under the image box that says 'Click to Change' as shown below.
A window will pop up on top of your current browser window that looks something like this:
On the left side of the window you'll see a green index. These are the image categories. You can browse through images by clicking on these categories, or you can use the keyword search above the index. When you are viewing a specific category, the name of the category is a lighter shade of green in the index and appears above the thumbnail images. In the screenshot above, we're looking at the 'Business General' image category.
- When you find an image you want to put on your page, place the mouse cursor over it. The image will be highlighted. Click on it to add it to your page.
You'll now see your chosen photo in the image box on the editing page.
- Click the 'Save' button at the bottom of the page. The image now appears on your web page.
Removing an Image
- Click the 'Edit Page' button on the toolbar.
- Click on the image box or on the button under the image box that says 'Click to Change' as shown below.
- Click the 'Blank Image' button at the top of the image popup window.
The image box now has the caption 'Click to put an image here...'. This lets you know that there is no image currently in the image box.
- Click the 'Save' button at the bottom of the page.
Closing the Image Popup Window
If you decide that you don't want to change the image after you've opened the Image Popup Window, you can simply close the window by clicking the 'Close Window' button.
Step 5. Using Your Own Images
This part of this tutorial will show you how to use your own images on your web pages.
Getting the Images
Before you can put your own images on your page you'll have to get the images from somewhere. There are two basic ways to get images to use in your website.
- Digital Camera
- From The Internet
Getting Images From A Digital Camera
To get an image from your digital camera, follow the instructions that came with your digital camera. Unfortunately, each digital camera has a different way of moving the images onto your computer so we can't provide detailed instructions for this.
You'll need to resize your images to 640 by 640 pixels or less to use them on your web page. The images made from your digital camera are usually too large.
We recommend using the software program 'Easy Thumbnails' from 'Fookes' because it is both easy to use and free. This software is available here: Fookes Easy Thumbnails
Getting Images From The Internet
Before you take an image from the Internet to use on your web page, make sure that you have permission to use that image. Images that are designed for you to use on your web page are called 'clipart' or 'clip photography'.
A good starting point for finding free clipart is Web Clip Art at About.com
In our experience, the best and easiest place to find clipart is a paid clipart library. We recommend both Hemera Digital Images (our own image library is a collection of Hemera images licensed to us) and GettyWorks.com by Getty Images
Once you've found an image you like, right-click on the image and click 'Save Picture As...'.
If you have difficulty following the right-click instructions, follow these steps below:
- Put your mouse cursor over the image you want. Note that the image must be from the Internet and viewed in your web browser.
- With your cursor over the image, click the right mouse button and a menu will appear (see image above).
- Move your mouse cursor over the menu item that says 'Save Picture As...' and click on it.
A popup window will ask you where to save the file to. Remember where you saved the file because you will need it to add it to your web page.
Using Your Images
- Click 'Edit Page' on the toolbar.
- Click on the image box or on 'Click to Change'. The Image Popup Window will appear.
- Click 'Add Images' at the top of the Image Popup Window.
The Add Images page will appear.
- Click the 'Browse...' button next to the field that says 'Image 1' to select an image from your computer. Note that images larger than 640 x 640 pixels will not upload. The 'Open Window Dialog Box' will appear. Choose an image on your computer using the dialog box then click the 'Open' button in the dialog box.
You can upload up to five images at one time. Just repeat the last step for each Image field.
- When you're finished choosing image(s) to upload, click the 'Add Images to Library' button at the bottom of the Image Popup Window. The image(s) will now appear within the window. Click on an image to add it to your page.
- The image will now appear on the editing page. Click the 'Save' button at the bottom of the page. Your web page will now appear with the image.
Using Images You Already Added
Once you've uploaded pictures they stay in the image library in your 'Main Folder'. You'll find the 'Main Folder' under the title 'Your Images' at the top left of the Image Popup Window, above the green category index. Click 'Main Folder' to access your own images.
Making Custom Folders
If you are uploading a lot of pictures, you may want to organize your images in more than one folder. To add a custom folder, click 'Add Folders' at the top of the Image Popup Window and follow the directions. The next time you add images to your library, you can add them into your new folder. The new folder will appear under the 'Main Folder' in the Image Popup Window index.
Step 6. Logging Out of Your Website
When and Why to Logout
If you're using a personal computer and are the only one who uses it, you don't need to logout. This means that the next time you access your website, you will immediately be able to edit your website. However, if you share your computer with other people, we recommend that you logout before you leave your computer. This prevents others from editing your website.
You cannot be logged in to your website from two computers at the same time. If you remain logged in on one computer and then log in on another, you will automatically be logged out of the first computer. This protects you in case you forget to logout of a public computer, like one at a web cafe.
How to Logout
- Click 'Exit' on the toolbar.
- Confirm that you want to logout by clicking the 'Logout' button.
You've now successfully logged out. The next time you want to edit your website, you'll need to login again.
Step 7. Marketing Your Site
For information on how to use your 'Internet Marketing' tab as well as other helpful marketing tips, please go to Marketing Your Site
Exiting This Tutorial
If you're viewing this tutorial online, you can exit this tutorial by clicking on the 'Exit Help' button at the top right of this page. You'll be returned to the page you originally came from.
|
