Thursday, March 22, 2012

Tutorial/FAQ for our site


Welcome to WebCreate.com. Thank you for trying our product, and we hope that you are finding everything you need to make your website your own. In the event that you are new to website creation and how to use tools like these, hopefully this tutorial will be everything you need to get started creating your own website.


Step 1. Create a new project.

This phase is crucial because it is here that you begin your quest for ultimate website
creation. When you first log in you will be prompted to either choose an existing project or start a new project.

Step 2. A new beginning

When you first bring up the editor you will notice a few things at a glance. To your left you
will see the main toolbar for your project. Here all your editing tools are conveniently located for easy access and instant creation. We will break down each of these tools individually later in the tutorial.
As we continue on, in the middle of the page you will see your site creation canvas. This is where you will be placing all the elements that will eventually populate your website. You will notice three tabs at the top of the screen. The first is the master template tab. This tab like all others contains a header, body, and footer, but what is different about this one is that when edited, you will notice that the styles objects and items that you add into this pane will populate across all other created panes. This is important because it is here that you set up your main style the site. But the caveat is that this page will not overwrite any other changes made to subsequently created pages, and the styles added here may only be edited from this page.
Next you will see the the index tab, this is a re-nameable tab is the homepage for
your website, this will be the first thing that customers and visitors will see when navigating to your website, so it is crucial to make this page pop out and make people want to come back here.

Continuing on, we see the New Tab option, here once clicked you will be prompted to enter a page name, this name translates to the name of the page within your site you will be navigating to.
Looking towards the middle of the screen you will see that the pane is divided up into three sections, these sections are denoted as the header the body, and the footer, each of these sections bounds whatever elements that are added into them to that individual pane. thereby splitting your page up into three separate parts, each of these panes can be re sized and modified to fit your individual needs
Finally, on the right side of the page, you will see the properties panel, this panel allows you to modify any of the objects that you have placed into your website, from color to opacity, to positioning, this is the one-stop-shop for all your modification needs.

Step 3. A list of commands

As you begin to use this tool, you may or may not know about all the different options for editing objects within your development environment. Here you will learn all about how modify the objects that you have placed into each canvas.

Top Tab Set( the tabs that denote the various pages in your website)
Master template tab
click: selects tab
Created tab
click: selects tab
right-click: edits tab name
hover, click the x, allows for tab to be deleted( Cannot be undone)
add tab:
click: creates a new tab

Text Editor
click: selects editor, once selected you can move and re-size the editor
right click: edits text

Divs
click: selects div, once selected you can move and re-size the div

Images
click: selects image, once selected you can move and re-size the image

Menu Bar
click:selects the menu bar, once selected you can move the bar
(currently sub menu’s are not supported by this tool)

Forms (advanced tool)
once you bring down the list of items to be added to the form, you drag from the
menu, into the list of form elements to add an element to the form. Once this is
done you will be prompted to give a title to the form item.
the major thing about this tool is that we DO NOT provide the PHP/Perl code to take the information added into these forms and place it anywhere, we leave that up to the discretion of the user to hire someone to write this code for them.

Step 4. Putting it all together

Now that you have information on all the pieces of the puzzle required for ultimate website creation prowess, the next step is to take all the information here and apply it to creating your first website. We suggest that you begin your journey by taking the following steps:

First: Decide what the “theme” of your website is going to be, what color scheme are you
going to use, what is your target audience, and so on.  

Second: Map out all the pages you are going to require for this site: Ex. Home, Contact, Blog, Photos, etc.

Third: Create your master template. This is important because the feel that you create here will translate to all of your other pages. It is important to add the menu bar here and any Text that you want to translate onto every other page, common places for this kind of text are in the footer and header.

Fourth: Begin adding content and customizing the individual pages. In this step you will be adding images, text, forms, and other miscellany that will be constrained only to individual pages.

Fifth: Publish your page! Take the code that was generated and add into the public_html folder that is provided to you by your web-hosting company and Voila! You have created your very own website in just 5 simple steps.  

No comments:

Post a Comment