Ecommerce Application Module

Final Design on website

2009-05-06T20:30:00.004+01:00

From what I have in the feedbacks, I am starting developing on my current design.

The original home page

I realised that my web pages have dark colours and fonts are not nice on web usability, a bit boring to attract customer so they can go away before navigating. More over, the layout of my website generally does not have product background, a customer will have no idea about what my website is selling.

+ Comparing a design with LAURA ASHLEY , and taking Jakob Nielsen advices.

Firstly, according to Jakob Nielsen ( Aspects of Design Quality, 2007, http://www.useit.com/alertbox/quality-correlations.html), there are core usability areas that a website should cover: how users get around, the content customers will find, and the features offered.

Secondly, there are also some aspects that we should consider:

Homepage usability
Accessibility
Web presence

A attractive and nice beginning will drive people to the end of the presentation, this will also apply to the layout of a website, specially, a home page is considered as an introduction for a website, it will show visitors what our website is about.

More over, a web presence is a big deal to attract online customers who are coming to shop at our website. A bad home page might make the customers turn away before navigating.

To do a better design from the old style, I have collected some good attractiveness from Lauraashley.com and based on a guideline from Jakob Nielsen (Top Ten Guidelines for Homepage Usability, 2002, http://www.useit.com/alertbox/20020512.html ) to start modifying and desgin my current website.

First of all, a gap, between web font ground and body background, can keep balance and give a nice look on usability of Lauraashley website. This is a first shot for my website design development.

Next, Accessibility is a step stone on good websites so Lauraashley has 2 types of navigation accesses: one is vertical menu which is linking to different areas of the site and another is horizental menu linking to different categories. Besides that, the navigation also let the customers know how many categories of product and what features on the site we have. The same style will be applied to my current design.

Furthermore, there should be a search box in the website, it can help a customer save their time and direct them to the items that they already know and want to buy.

On the other hand, using some images of producs on the website will make visitors interest in a product they are looking for.

Finally, I also have a cosideration on what colours to be used for the website. My final decision is against between dark colour and light colour such as a dark red colour in website background will against a colour of yellow cream in body background and again, inside the body, I use a light red colour and yellow to match each of them in order to keep balance on usability of my website layout.

I gather my research notes in my final design:

Then I test my fnal design on web browser: Firefox

and on Internet Explorer

Editing the Design Layout after getting feedbacks

2009-04-16T13:29:00.001+01:00

In general, there is not much changes in my site, I still keep my style following the advise from Ms Alli who gave me the feedback, is working for "Next" fashion clothing company.

Besides that, by comment of Mr Huy, one of 2 evaluations, I create a image slide in my home page, this will give all customers about what product I am selling on my website and I also create category navigations which help customers choose a type of clothes they want such as wedding dress or men dress or women dress.

In font page, the images slide automatically.

Before changing.

After.

In the product page, I make navigations linking to different categories as wedding dress, men dress and women dress.

original product page

After changing:

Navigation linking to different categories such as
Wedding Dress Page:

Men Dress Page:

Women Dress Page

A trick to boost Alexa Ranking

2009-04-10T21:25:00.005+01:00

At the moment, My website ranking is about 7.400.00 on the Alexa website.

To make my rank jump from the first start at 12.000.000 to 7.000.000

Firstly, I download Alexa Toolbar that are from Alexa website
are integrated with Firefox.

Secondly, I go to http://doorwaypage.com
then fill all information as below:

Afterward, I leave it process around 10 minutes

until

check the website longdressvn.com after the process finished.

Recognising longdressvn.com on SEO

2009-04-06T00:33:00.004+01:00

A few weeks later since I add my website URL on Google, Yahoo and MSN, now they publish my website.

GOOGLE

YAHOO

MSN

And my site backlinks are also published on :

YourJoker

addbacklinks

blfree

freebacklink

Register Google Analytic and Alexa Ranking

2009-03-31T21:26:00.009+01:00

I come to Google Analytic and sign up an account

After I sign up an account with my profile, I am on the way to create my website profile in Google Analytics

Then another page coming up with JavaScript

There are 2 kinds of Javascript tracking code from Google, I just pick up one in New Tracking Code (ga.js) into my default.asp

A couple day later, I come back to my Google Analytic account, there are 21 visitors coming to my "longdressvn.com" website.

By analyst from Google, I know how many visitor coming to my site, how many times for page of views and Average of Page Views.

Moreover, I can track where my visitors coming from

At the moment, there are 3 regions that are Vietnam, USA and England.

On the map, it shows me 3 countries or regions where my customers came from, are United States of America, United Kingdom and Vietnam.

It also help me to track down in which city of the regions or countries my customers are living.

The purpose of tracking is to help me find the best market in the world for my business and in which cities in the world I will have more customers interested in my products.

For example:

In England, London and Leeds are cities that my clients are from, the statistic also show how many visits they have, how many pages per visit and Average Time they spent on my site.

In Vietnam, 16 people came from different cities such as Ho Chi Minh city, Ha Noi capital and Quang Ngai city.

in the USA, there are 2 visits, one is from California and another is from Washington.

Alexa Ranking

The Last updated Analysis on Google Analytics :

Different Countries that different visitors are coming from :

And ALEXA website ranking:

Create and make Register Page work

2009-03-31T15:33:00.009+01:00

Firstly, I make a page called "register.asp" then create a form which is set up with action to "login.asp" and method to "post"

so the layout will be like:

secondly, I make a function which can help customer register an account in my website

To start with, of course, I have to create database path for the page by recordset in "Binding Panel", then switch to "Server Behaviour Panel". I drop down the server behaviour menu to choose " Insert Record"

After clicking, a box pop up with more details to fill in

"Connection" to coursework
"Insert to table" to customer
"After inserting, go to" to login.asp
"get values from" to myform

then I will get all form elements in text area of Dreamweaver automatically

Finally, I preview and test the function that I made

I fill all my information into the form then "submit"

I got a clear error message saying
"
[Microsoft][ODBC Microsoft Access Driver] Operation must use an updateable query.

/vhp0003/coursework2/register.asp, line 27"

I switch back to Code View in Dreamweaver to the cause.

However, I could not pick up any cause relevant so I post my question on different
forum.

http://www.aspfree.com

A day later , there is a reply for my question.
The cause is a permission of server so to solve it out, I follow the given link

and this is a solution to setup my permission on local host to do INSERT query in my Register Page.

Besides aspfree.com forum, I also post my query on ecommerce forum

And this is a reply I have got so far for my query.

I test my register page function

I fill "hung" in "full name" textfield
"pvhung1885@yahoo.com" in Email textfield
and my password in password textfield

After clicking "submit" button, it drives me to login page. the error page does not appear so that means the problem is solved.

However,it seems the function is not working at all, I log in with email and password that I inputted in register page but it drives me back to the same page.

So I check the database, I assume the INSERT QUERY is working, my register information will be inserted to database but as picture shown.

No data is inputted, that means the INSERT QUERY has some thing wrong

Using email to send survey question and get feedback

2009-03-31T08:28:00.006+01:00

I have an email sent to different emails of different clothing websites such as

http://aodaingonhathuy.com/

http://www.finechineseclothing.com/eng/index/index.aspx

http://thoitrangmy.com/

http://www.aodaiminhthu.com/

At the moment, I have got one feedback written by Vietnamese language from a local shop owner in Vietnam. However, the feedback is written by Vietnamese language

http://aodaingonhathuy.com/

Translation from Vietnamese to English :
"

Hello there,

I have seen your website. However, it seems that the site is a newly built one and lacks of pictures. Regarding Ao Dai Vinh, it is not possible to compare as they are a mere dressmaker’s shop. They often copy from other people’s designs so their price is very low. In my website, we create all the pictures and designs by ourselves.

Comparing your website to others, I think your should review the site because visitors don’t know what you are selling about. If you want visitors to stay, your design and pictures must be more attractive to make your visitors recommend your site to their friends. Only that can help your website become popular. I am afraid I can not rate your web! I would like to wish for your success! I hope you will ask for my permission before using my pictures. Ao Dai Vinh has stolen quite a bit of my picture designs; however, I did not have time to ask them to put down those pictures. Hope I can do it this year. Once again, I wish for your success in your job.

"
And another evaluation coming from a staff who is working on "Next", a clothing business in the UK. (http://www.next.co.uk/).

I send her an email regarding my survey question:

Later , she send me back an email for feedback:

From the feedbacks, I got an advise to make up my website as longdressvn.com

Making a Check Out Page

2009-03-30T15:35:00.010+01:00

Firstly, I make page called "checkOut.asp"

In Code View,I type some pieces of code before "" TAG.

<% ' THIS BIT DEFINES THE CONSTANTS USED IN OUR SCRIPT

CONST CARTPID = 0
CONST CARTPNAME = 1
CONST CARTPPRICE = 2
CONST CARTPQUANTITY = 3

' THIS BIT GETS THE SHOPPING CART SESSION VARIABLE

IF NOT isArray( Session( "cart" ) ) THEN
DIM localCart( 4, 20 )
ELSE
localCart = Session( "cart" )
END IF

%>

Then, I switch to Design View in order to make simple form containing Delivery Detail and product details that Customer has added to cart.

Naming the form as "myform". Set "Action" as "shop_ccard.asp" and the "Method" as "POST".

In the form, I create some textfields and give them their name respectively.

name's textfield as name
address's textfield as address
city's textfield as city
postcode 's textfield as postcode
country's textfield as country
phone's textfield as phone
email's textfield as email

Next step is to insert a button called "next", it will be replaced by image so all the form will be looked like

the form is OK for this moment. I move to next step which is to implement ASP code so that the check out page work nicely.

First of all, I insert 2 hidden textfield

Now, I am going to FORM VALIDATION by Dreamweaver

Firstly, I go to "Tag Inspector", switch to "Behavior" tab and then drop down a menu list.

I am going to choose validation form as above then a small window will pop up:

For each line in "FIELD" box, I tick "required" with "Accept" option matching.

Then at testing stage. I have got:

A error in this page is, a error message does not pop up when I click on Next button, and all fields are left blank.

so I post my query on different Forums to get a solution:

My post is on ASPFREE.COM

Ecommerce forum

After a day, I have got a reply from ASPFREE

From the solutions above, I switch back to my code view and fix it.

My result comes up successfully

Making a Shopping Cart page

2009-03-27T12:41:00.013Z

Firstly, I have typed pieces of code between"<% " at the top and " %> " in a page called "shopCart.asp" before the start of -HTML- tags.

Define Constants

CONST CARTPID = 0
CONST CARTPNAME = 1
CONST CARTPPRICE = 2
CONST CARTPQUANTITY = 3

GET THE SHOPPING CART AND OR SET UP SESSION VARIABLE

IF NOT isArray( Session( "cart" ) ) THEN
DIM localCart( 4, 20 )
ELSE
localCart = Session( "cart" )
END IF

GET THE PRODUCT INFORMATION
productID = TRIM( Request( "pid" ) )
productName = TRIM( Request( "productName" ) )
productPrice = TRIM( Request( "productPrice" ) )

ADD ITEM TO SHOPPING CART

IF productID <> "" THEN
foundIT = FALSE
FOR i = 0 TO UBOUND( localCart )
IF localCart( CARTPID, i ) = productID THEN
localCart( CARTPQUANTITY, i ) = localCart( CARTPQUANTITY, i ) + 1
foundIT = TRUE
EXIT FOR
END IF
NEXT
IF NOT foundIT THEN
FOR i = 0 TO UBOUND( localCart, 2 )
IF localCart( CARTPID, i ) = "" THEN
localCart( CARTPID, i ) = productID
localCart( CARTPNAME, i ) = productName
localCart( CARTPPRICE, i ) = productPrice
localCart( CARTPQUANTITY, i ) = 1
EXIT FOR
END IF
NEXT
END IF
END IF

UPDATE THE QUANTITIES IN THE SHOPPING CART
IF Request( "updateQ" ) <> "" THEN
FOR i = 0 TO UBOUND( localCart, 2 )
newQ = TRIM( Request( "pq" & localCart( CARTPID, i ) ) )
IF newQ = "" or newQ = "0" THEN
localCart( CARTPID, i ) = ""
ELSE
IF isNumeric( newQ ) THEN
localCart( CARTPQUANTITY, i ) = newQ
END IF
END IF
NEXT
END IF

UPDATE SESSION VARIABLE WITH ARRAY
Session( "cart" ) = localCart

Secondly, I make a form that contains a simple table

Place the "Back to Shop" button in the left cell (image/backtoshop.gif) and link it to "product.asp".

Place the "Checkout" button in the centre cell (image/checkout.gif) and link it to "shopCart.asp".

Place a standard form "Submit" button in the right cell and label it "Update Cart"

Click on the "Update Cart" button to highlight it and then click on the "Quick Tag Editor" . Change <-input-> tag to read " <-input- type-=-image -src-="buttons/update.giff">

I click inside the form, just before the "Shopping Cart" text and insert a "Hidden Field".

Name the "Hidden Field" as "updateQ" and give it a value of "1".

Afterward, I click inside the right hand cell situated below the word "Quantity" and insert a "Text Field".

In the "Name" field (left on properties window beneath TextField), I type

pq<%=localCart(CARTPID, i )%>

In the "Char Width" field enter "4"

In the "Init Val" field enter

<%=localCart(CARTPQUANTITY,i )%>

Next step is to setup the form Action to shopCart.asp and the "Method" to "POST".

Now, I type some piece of code and put them in somewhere of the form.

I type

<%orderTotal = 0%>

in just after the opening tag.

I type the code below between the end "" of the first row and the beginning "" of the second row.

<% FOR i = 0 TO UBOUND( localCart, 2 ) IF localCart( CARTPID, i ) <> "" THEN
orderTotal = orderTotal + ( localCart( CARTPPRICE, i ) * localCart( CARTPQUANTITY, i ) )
%>

Next to get cart name for product name, I put

<%=Server.HTMLEncode( localCart( CARTPNAME, i ) )%>

into the tables second row , first cell.

In Design View, I can see the code that I just put in is under "Product Name"

Again, I put

<%=formatCurrency( localCart( CARTPPRICE, i ) )%>

into the tables second row , second cell.

So there should a ASP green sign uder "Price"

I put an end for a loop by

<% END IF NEXT %>

It was put between the end "" of the second row and the beginning "" of the third row.

a given code of Order Total

<%=formatCurrency( orderTotal )%>

was put into the third cell of the third row

so in the Design View of Dreamweaver, I see a ASP green sign on the left of "Order Total"

next step is to preview and test a function of shopping cart.

In "Quantity" text field, I replace number 3 instead of 1, then click on "Update To Cart"

However, There is error when I update a number of product quantity

So I post my question on ecommerce forum

Then get a solution

From a given hint from the forum, I fix my code in shopCart.asp

Then testing a fixed code o shopping cart function.

After selecting my favorite product, I come to the shopping cart with number 1 in quantity box. In the field of Unit Total Price and Total Order Price, I can see a price of 54.5 and 57.225 respectively.

After a click on button " Update Cart" , both fields of price are changed as well as a number of product quantity are updated.

My Website is actived on SEO engine

2009-03-27T09:29:00.005Z

These are all website that I already submitted my website URL before, I can search my website now.

On Alexa Search engine

On Live Search search engine

On YAHOO

On Google

on London Stock Exchange

Moreover, I try my website ranking on Alexa and an analytic from Google.

Google Analytics

and Alexa ranking.

At the moment, there is no graph for my sites, I need to find a solution on how Google Analytic and Alexa pick up a number of visitors visiting my sites.

I post my question on different forum online to get solution.

Modify Product page and add product detail page

2009-03-26T11:45:00.005Z

From original product page in my website, I extend it a bit more.

My plan is to make a page of product details. When customer view my product page, they can only see product ID, the name and the price, if they want to see more information or want to add the product to basket online, They can click on "more details" to go on.

On product page, I input "More Details" in the cell of table as below:

then, I highlight the text and switch to Server Behavior panel of Dreamweaver. Next, I drop down a server behavior menu by clicking on a sign "+" and choose a function called "Go to Detail Page"

A pop up window appear as a picture shown below:

As the link shown as "More Details", the detailed product page is in process.
I create a new ASP page called "productDetail.asp" then upload to the hosting server. this page is to store what product a customer want to view more detail . After that, I browse and choose productDetails.asp.
If the connection is still available, the product ID will be put in a text field of "Pass URL parameter" by default, then Set Value of Recordset "the name of recordset that we created "
column is also automatically setup with product ID.
Finally, I tick URL Parameters of "Passing Existing Parameters"

My next step is to create a product detail page

at this stage, I replace a cell of "more details" with Description row

Following the tutorial from webthang , I create a form, that contains 3 hidden text fields and a submit button, is named "addForm" with action="shopCart.asp" and "POST" method.

I click on each hidden textfield and name them as pid, productName, productPrice respectively

Then clicking on the button in order to change its name to "Add to Cart"

In case, If I would like to add an image for the button, I can follow a method shown below:

On the bottom right of Dreamweaver, there is a Quick Tag Editor which can help me edit a code directly instead switching to Code View.

When it is done, I can see it like

However, it is looked badly so I make up my mind to use simple button.

Moreover, I need to do a binding technique which makes hidden textfield of "addForm" Form link to shopCart.asp

First of all, selecting a hidden textfield such as productID, then clicking on proID on Binding Panel , on a row of "Bind to", choose "input.value" then clicking on Bind button.

At final stage, I preview my work on the browser.

Unfortunately, there is a error for the form with hidden textfields. Following the hint of error message. I switch to Code View then pick up a root of error.

Finally, I post my question on forum online

then get the answer relevant to my considering queston:

Following the hint above, I fix recordset in the web page then get the working result.

Modify and add nevigation to the website

2009-03-23T02:15:00.006Z

On the home page, I draw a new layer which is called "apDiv15", input a link to login page and another to register page.

then make a effect for navigations

finally, I test it on the firefox browser.

and on the Internet Explorer version 6.

then apply the coding of navigation changing to all other pages such as product, about us, contact, etc.

In the product page, I add more to make all navigation like First, Next, Previous and Last, each of them will be changed when user point at.

after clicking on user login, by default, it will pass all kinds of user to login page which is for customer login access. The user login from other pages is changed to admin login in the login page. By this method, all customers will straitly login to their member area page and admin already know which access is for them.

In contrary to login page, admin login page does not have the text " if you are not a member yet, please register". This is beacause, admin is an owner of the website, he must know his user name and password.

If I have free time in advance, I think I will develop more extra protection on admin page.
Basically, I can add a extra text like " forget password" which guides an admin to a page that asks the user to validate extra authetication. If the authentication is past, the user can modify their password on sencond page and possibily get it from the user email.

This will help the admin who may have a lot of websites to manage, easy to get back their password when they forget , or, to prevent hackers stealing data in a short period.

More practical and more advance for preventing hacking website, I think the structure of website coding is a part of important rules, more over, SQL statement is also considered as well-known as SQL Injection.

Authentication Function for the website by Dreamweaver

2009-03-23T01:24:00.005Z

First of all, I create 3 pages which are :

login page: identifies username and password from customers
errorlogin page: will be reached if user name or password or customer account is invalid.
customerControl page: the customers will come to their member area after their account user name and password are validated.

Next, on the login page, I create a form called "my form", then create RECORDSET QUERY for customer table.

I move on to create Login Function by Dreamweaver.
On the Server Behavior, I drop down the menu to choose User Authentication then select Log In User.

Setup data so that user name and password on the form of login page can match to data in customer table.

then, I test on the browser. I try "aaa" for both user name and password then I reach to errorlogin page which show error text

If I successfully login, it will past me to customerControl page which show me some new navigations.

Moreover, I also create validation file by JavaScript, it help me validate all the text fields in login page and register page.

In the browser view, the test will show

when user try to pass without entering data on both text fields

If the user only input data in the password, the error will be caught and announced for username.

Besides that, the password error will be shown if user forget to input.

20 Ways to Increase your Alexa Rank

2009-03-14T01:05:00.001Z

Here is a collection of methods you can use to boost your Alexa Rank. Most of these tips are derived from several fellow webmasters I know who claimed to have derived positive results through their experiments with the Alexa Rankings.

Some of the other tips were derived articles and sources, which I have duly referenced at the end of this post.

Do these tips work? According to some, yes they definitely do work. But do note that most of them require active effort of some sort and hence, they will work as long as long as you are consistently performing specific actions.

To increase your Alexa rank in the long run, I would highly recommended that one focus on developing quality content which attracts and maintains a large audience instead of purely focusing on artificially increasing your Alexa Rank.

Great link-worthy content will leads to an natural increase in site traffic and is an excellent way to passively increase your Alexa rank.

It is important to emphasize that you should devote most of your efforts in growing your site audience alongside integrated implementation of any of the following tips below.

1. Install the Alexa toolbar or Firefox’s SearchStatus extension and set your blog as your homepage. This is the most basic step.

2. Put up an Alexa rank widget on your website. I did this a few days ago and receive a fair amount of clicks every day. According to some, each click counts as a visit even if the toolbar is not used by the visitor.

3. Encourage others to use the Alexa toolbar. This includes friends, fellow webmasters as well as site visitors/blog readers. Be sure to link to Alexa’s full explanation of their toolbar and tracking system so your readers know what installing the toolbar or extension entails.

4. Work in an Office or own a company? Get the Alexa toolbar or SS Firefox extension installed on all computers and set your website as the homepage for all browsers. Perhaps it will be useful to note that this may work only when dynamic or different IPs are used.

5. Get friends to review and rate your Alexa website profile. Not entirely sure of its impact on rankings but it might help in some way.

6. Write or Blog about Alexa. Webmaster and bloggers love to hear about ways to increase their Alexa rank. They’ll link to you and send you targeted traffic (i.e. visitors with the toolbar already installed). This gradually has effects on your Alexa ranking.

7. Flaunt your URL in webmaster forums. Webmasters usually have the toolbar installed. You’ll get webmasters to visit your website and offer useful feedback. It’s also a good way to give back to the community if you have useful articles to share with others.

8. Write content that is related to webmasters. This can fall in the category of domaining and SEO, two fields in which most webmasters will have the Alexa toolbar installed. Promote your content on social networking websites and webmaster forums.

9. Use Alexa redirects on your website URL. Try this: http://redirect.alexa.com/redirect?www.doshdosh.com . Replace doshdosh.com with the URL for your website. Leave this redirected URL in blog comments as well as forum signatures. This redirect will count a unique IP address once a day so clicking it multiple times won’t help. There is no official proof that redirects positively benefit your Alexa Rank, so use with caution.

10. Post in Asian social networking websites or forums. Some webmasters have suggested that East Asian web users are big Alexa toolbar fans, judging by the presence of several Asia-based websites in the Alexa Top 500. I suggest trying this only if you have the time or capacity to do so.

11. Create a webmaster tools section on your website. This is a magnet for webmasters who will often revisit your website to gain access to the tools. Aaron Wall’s webpage on SEOTools is a very good example.

12. Get Dugg or Stumbled. This usually brings massive numbers of visitors to your website and the sheer amount will have a positive impact on your Alexa Rank. Naturally, you’ll need to develop link worthy material.

13. Use PayperClick Campaigns. Buying advertisements on search engines such as Google or Exact Seek will help bring in Traffic. Doubly useful when your ad is highly relevant to webmasters.

14. Create an Alexa category on your blog and use it to include any articles or news about Alexa. This acts as an easily accessible resource for webmasters or casual search visitors while helping you rank in the search engines.

15. Optimize your popular posts. Got a popular post that consistently receives traffic from the search engines? Include a widget/graph at the bottom of the post, link to your Alexa post or use Alexa redirection on your internal URLs.

16. Buy banners and links for traffic from webmaster forums and websites. A prominent and well displayed ad will drive lots of webmaster traffic to your website, which can significantly boost your rank.

17. Hire forum posters to pimp your website. Either buy signatures in webmaster forums or promote specific articles or material in your website on a regular basis. You can easily find posters for hire in Digital Point and other webmaster forums.

18. Pay Cybercafe owners to install the Alexa toolbar and set your website as the homepage for all their computers. This might be difficult to arrange and isn’t really a viable solution for most. I’m keeping this one in because some have suggested that it does work.

19. Use MySpace . This is a little shady so I don’t recommended it unless you’re really interested in artificially inflating your Alexa Rank. Use visually attractive pictures or banners and link them to your redirected Alexa URL. This will be most effective if your website has content that is actually relevant to the MySpace Crowd.

20. Try Alexa auto-surfs. Do they work? Maybe for brand new sites. I think they are mostly suitable for new websites with a very poor Alexa rank. Note that there be problems when you try to use auto surfs alongside contextual ads like Adsense. They aren’t also long term solutions to improving your Alexa Rank so I suggest using with caution.

(resource from soft4viet.com)

Search function for Coursework 2

2009-03-11T10:13:00.012Z

Now, I am doing a search function for coursework 2. The function will help user search their products by product ID or product Name .

At first step, I have to modify search form in 4 different pages such as home, product, about us, contact us following code:

Then I create another page called search.asp which contains all code relevant to searching function.

Declare all strings:

Making a connection to database

Inputting what entities I want to display then close the connection.

Now, I test my work on web browser. I type number 11 on the textfield then click button search
the result comes up for product ID 11

I type text as "blue" then get results below:

However, When I try some sign, there are no returning message.

Moreover, when I am searching some keyword, the database is displayed over the template. Although, I used REPEAT REGION to setup 2 records displaying like product page but the function is not working.

I have posted 2 topic gathering Search fuction created by Dreamweaver and by hand coding.

Search function Question for creating by Dreamweaver

2. Search function Question for creating by Dreamweaver

Add BackLink for website

2009-03-08T17:46:00.004Z

In purpose to do advert my website in the internet, I need to create Backlinks for my site.

There are several website chosen to create backlink:

1/ InfoListing

2/ Site Library

3/ snn.gr allows users can register their URL submit and Back link of one or multiple websites

4/ Freebacklink

5/ jayde

Setup Recordset Navigation: First, Pre, Next and Last.

2009-03-06T22:20:00.005Z

A displaying function is done , now I move on next step which is to create recordset navigation. It contains 4 navigated texts such as First, Previous , Next and Last. This technique is called Recordset Paging.

A table with 1 row will be set up below multiple record displaying. In each cell, I fill in all the texts.

Firstly, I make a function for "First" navigation. My aim is when users click on the "First" navigation, they will move to the first record of database as product ID : 1.

I hightlight the text then move to Server Behavior tab, this time, I choose Recordset Paging then Move to First Record.

Applying "Move to Previous Record" of Repeat Paging to "Previous" navigation and "Move to next record" for "Next:" navigation and "Move to last record" for "Last" navigation.

The "Previous" and "Next" navigation help customers go back or go on their research on catalogue of product, the "Last" navigation help customer quickly go to the last item of database.

After setting up all functions, I preview my page for testing

However, when I am testing the page, there is a error

I check on the image path of 11th product in database, the extension of image is JPEG and the image is out of image folder. these are reasons that cause image can not be stored.

I open my database and change extension of my image from JPEG to JPG, save my database then upload to hosting. I go to my Local View, drop the image of product ID: 11 to image folder.

After fixing them, the result comes up.

for last moment now, I already finish my work on displaying multiple records and recordset navigation

Displaying Multiple Recordset and Images (Solution)

2009-03-06T22:02:00.005Z

Now I apply what I achieved so far from the pictures above to my web page as product page.

First of all, I create table and apply binding technique to the table in the web template, then drag and drop diffrent selected entities in each table cell.

To display multiple records at the same time, I highlight a whole table instead of table cells, then move on to the Server Behavior tab of Application Panel, drop down a menu to choose Repeat Region again. This is done for displaying multiple record at a time.

Next, in the image cell, I use Insert technique which I got from online forum.

After selecting Image from Insert menu of Dreamweaver, a box will come up to choose image path.

For purpose of displaying images from my database, I tick on Data Source and see a list of my tables coming from database. I choose image entity then click OK to finish.

Finally, the actual image will appear in image cell of my table in Design View.

The last step now is to preview my actual work on the web browser.
http://cctmdev2.londonmet.ac.uk/vhp0003/coursework1/product.asp

My work is done perfectly. At the moment, I am searching how to do recordset navigation such as First, Previous, Next and Last.

Designing My website Template.

2009-03-05T21:15:00.010Z

Firstly, I design my logo following a hint with http://aodaitrang.net, a simple line to draw up A style rich in image.

at Photoshop CS 2, I used the pen tool to draw lines in order to create an image of human. The yellow color which I had defined already before I drew.

Adding horizontal texts as longdressvn

Finally, I filled a background color to the image.

Secondly, I created a font page for my website with font page design in photoshop

Creating new file for enter button.

After adding some decoration for my page, I combined them all together in font page and published on the web.

The font page of my website is done now.

Thirdly, I need to design another template for my main home page and the rest of pages.

First of all, I create a new file in photoshop again for a banner, after I decorated image on the background of banner and yellow texts, I added my logo, which I already did, to the right side of banner.

A finished banner will be looked like :

Move next, I create a new file for a font ground with color of dark red, I use this background to contains all my texts and my images. I also use this image for my footer.

and another new file for back ground with yellow color.

finally, I drag all images from photoshop files that I created so far and drop them into yellow back ground step by step.

I already finish some works for designing my layout, in my Dreamweaver, I use Draw layer function to build up my pages, once, I finish setting up, I will apply one page style to the rest of pages.

However, I lack of navigation menu so I need to build.

Coming back to photoshop, I create a new file for yellow bar which contains all navigations and search menu.

I save the image bar from photoshop file to JPG. Here, I draw a new layer on yellow font ground layer , add image bar into the new layer.

I create a table inside image bar layer with vertical rows and add text for each cell such as Home, Product, About us, Contact and a form including text field with search button.

A simple navigation menu (the style of http://aodaitrang.net ) and search menu are on same line (the style of http://www.lauraashley.com/ ) are done now.

To make the navigation menu have an effect when the users move their mouse point on, I go to Code View in Dreamweaver to do coding.

As code being :

div tag for my navigation menu layer is called submit. This is used when I do CSS
I move to head tag of HTML page and code some CSS properties.

.submit a{
font: bold 14px Arial; color: black; text-decoration:none;
}
.submit a:hover{
color: white; font: bold 20px Arial, Helvetica, sans-serif; text-decoration:underline overline;
}

Finally, the navigation get effect when users move their mouse point on

for example, I move my mouse point to product navigation, the text which is black color with its size 14 px normally, changed to size of 20px with white color , over line and underline effect

Actually, my design for coursework 1 is done.

Research on Design Template.

2009-03-05T17:36:00.004Z

I have researched on 4 websites so far, each of them give me a hint to design my template.

They are:
http://www.lauraashley.com/

Laura Ashley has simple layout but nice, it has a balance of usability and has a font page for customer visits. I like this idea either, but its adverts are relevant to flash design which slows down page loading.
The navigation menu and search menu are on the same line, this idea will be applied to my design. I also like presentation of template, which has space between font ground of template and its background., makes me feel the website tidy and clear.

http://aodaivinh.com/index.html

It is a poor design layout for the website font page, it may not attract customer when they visit, but if they really visit, and they will visit to another nice web pages such as a page called “store”.

It is a nice layout but there are too many navigation menus including some unnecessary menu.
For example: There are 2 navigation of search on the same page, one with text field and button search, another one is navigated text. This can confuse customers. Moreover, it does not give a clear message about the website banner or logo or navigation menu on the top.
However, I like a function called “Advance Search” which I may include it in my coursework 2.

http://aodaitrang.net

This website has simple navigation menu and good searching menu, besides that, the template keeps balance between colors and images.

=> This website give me a hint about navigation menu with simple texts and their affects when customer point at navigation. I also like search menu, which directs customers to the items they want, is a hint for me if I do search advance function for my coursework 2.

However, it has a big banner which gets a half of web Brower, this is not convenient for customer when they load all pages, take longer time to view their chosen items. From banner with many girls dressing long dress, it gives a feeling about my logo, a simple line to draw up a charming girl.

http://www.aodaistyles.com/

When customers visit the page, they will reach at the font page first. It is nice layout with flash. A fast introduction about the web site to customers and have some navigation menu which can drive customers to the page they want.
However, it is designed by flash so it will take some minutes in order to load all information and image.
=> This website gives me an idea for font page with clear topic about my logo and what items I sell online towards my clients. I will not use flash for my design because it take quite long time for loading, for some customers, who will not wait and pass over to another website to buy. Another reason is it can break my web fundamentals such as search function or navigation object which flash are poorly interactived with and distract web'core values, it take long time to build up something which is new or updated.(Jacob Nielsen, http://www.useit.com/alertbox/20001029.html)

so from now , I have a plan to design my website layout from different hints that I have collected.

add URL to Google, Yahoo, MSN.

2009-03-04T07:36:00.006Z

I had added my site to several search engines such as:

MSN

YAHOO

GOOGLE

ASK

SUBMIT EXPRESS

Setup URL Forwarding (Solution) and META tag

2009-03-02T00:02:00.006Z

from a help in ecommerce forum, I found a solution to succeed URL Forwarding.

in @ row, I input "http://www.longdressvn.com" with RECORD TYPE as "URL Redirect"
in www row, I input "cctmdev2.londonmet.ac.uk/vhp0003/coursework1/default.asp" with RECORD TYPE as "URL Frame".

in the my web browser, after I type "www.longdressvn.com", I can preview my website with my domain name.

By the way, I aslo set up my URL Meta tag

URL Forwarding on namecheap.com

2009-02-25T11:09:00.006Z

In URL Forwarding, there are 2 rows for different setup.

in rows @ I put "cctmdev2.londonmet.ac.uk/vhp0003"
in rows www, I input my domain name as"longdressvn.com"

However, when I save, there is error message appears

This time, I try again :

longdressvn.com with @ row,
cctmdev2.londonmet.ac.uk with www

and result comes up with university hosting in my domain name as longdressvn.com

However, it is not a direction to my university hosting account, if I want to preview my web on the web browser, i have to add more text on the address bar such as vhp0003. My result will come as below.

so to fix this, I go back to "namecheap.com" and setup again.

@ row with longdressvn.com
www row with cctmdev2.londonmet.ac.uk/vhp0003/coursework1

When I save it , it give me message error saying like:

I need to find solution to set up a direction from domain to my university hosting account, I can find solution on ecommerce forum.

Setup email Forwarding

2009-02-24T12:42:00.004Z

I chose E-mail Forward Setup on E-mail Management section.

I set sale@longdressvn.com forwarded to my personal email.

Creating Vertical Menu

2009-02-24T01:13:00.010Z

I used Coding View in Dreamweaver to do my Vertical Menu

firstly, I create a list of pages I need such as home, contact, about us, product by "ul" and "li" tag.

a result of the code will be presented in the web broswer.

then I create a external CSS file which has coding lines for menu background

.menu
{ padding: 0;
width: 100%;
border-top: 5px solid #D10000; /*Highlight red color theme*/
background: transparent;
voice-family: "\"}\"";
voice-family: inherit;
}

There is nothing changed at all, then I added more codes to define "ul" tag.

.menu ul
{ margin:0;
margin-left: 40px; /*margin between first menu item and left browser edge*/ padding: 0;
list-style: none;
}

there is also nothing changed again. Next, I defined "li" tag.
.menu li
{ display: inline;
margin: 0 2px 0 0;
padding: 0;
text-transform:uppercase;
}

when I defined "li" tag, all navigation was put in vertical order as a picture shown below:

then I made navigation changed look like buttons by CSS anchor/ link states.
.menu a
{float: left;
display: block;
font: bold 12px Arial;
color: black;
text-decoration: none;
margin: 0 1px 0 0; /*Margin between each menu item*/
padding: 5px 10px 5px 10px; /*Padding within each menu item*/
background-color: lightblue; /*Default menu color*/
border-bottom: 8px solid white;
}

but there is no effect when I point my mouse point on the buttons.

If I want my navigation buttons that will be change when user move their mouse on, I will need to work with CSS hover of anchor.

.menu a:hover
{background-color: #D10000; /*Highlight red color theme*/
padding-top: 10px; /*Set padding-top value to default's padding-top + padding-bottom */
padding-bottom: 0; /*Set padding-bottom value to 0 */
border-bottom-color: #D10000; /*Highlight red color theme*/
color: white;
}

However, If I am reading information on the page that I dont know where I am, I will need make a change on my navigation so that it can tell me which page I am reading with "current" class. it was set in html navigation code.

within CSS file, I code more lines.

.verticalMenu .current a{ /** currently selected menu item **/
background-color: #D10000; /*Highlight red color theme*/
padding-top: 10px; /*Set padding-top value to default's padding-top + padding-bottom */
padding-bottom: 0; /*Set padding-bottom value to 0 */
border-bottom-color: #D10000; /*Highlight red color theme*/
color: white;
}

finally, I can know which page I am reading.

Using Recordset Repeat Region to display muitiple records(solution for displaying 1 data only)

2009-02-19T23:43:00.007Z

I found out a technique to resolve a mistake that i got before, was to display one data record only rather than multiple records.

I used REPEAT REGION to work out.

On server Behavior, I click plus button to choose Repeat Region.

Small dialog called Repeat Region appeared afterward.

as Recordset1 as the name of recordset should be used, I already created.
Show how many number of records a time I want to display, I choose number 2

Firstly, I click on Dynamic Text (Recordset1.proID) then move mouse point to (+) button in server behavior panel.

extra codes would be generated after "ok" button of REPEAT REGION was clicked.

Applying the same method with the rest :
Dynamic Text (Recordset1.price)
Dynamic Text (Recordset1.image)

Finally, I can see 2 records shown on the web browser but another problem occurs.

All data were put in the same cell of table, I wanted to separate them, each records should be in different cells of table.

so I already posted my question again on the forum.

working with RECORDSET => displaying database by dreamweaver for displaying one product only rather than a lot of products)

2009-02-19T15:10:00.005Z

After connect to DSN scuccessfully, I want to display my data records on product table.

Open the Bindings panel, if it isn't already open, by doing one of the following.

Select Window > Bindings.
Click the Application panel group's expander arrow and then select the Bindings panel.

Choosing Recordset (Query)

Recordset came up.
give a name for this recordset, connect to database connection.
After connecting scuccessfull, a list of table in database connection will appear.

I chose product table to display its entities such as proID, proName, price, image.

From binding panel, I drag each entity of product table and drop them into each chosen place as picture shown.

I preview a result within FireFox and see one product shown only.

I have got 2 mistakes and been searching for solutions

image is not shown on the web
there is one record shown only, I need to show more

For my error consideration, I post it in ecommerce forum.

Using Dreamweaver features and database connection to display product infor

2009-02-17T14:25:00.005Z

Choosing binding tab on the right hand side of Dreamweaver, I am able to create RECORDSET and display product information

connecting my site to data source which means I have made it possible for dreamweaver to write code for me that retrieves data from my database.

- I name a test recordset as Recordset1, choose connection as connection.
- Clicking on test buttn to try database connection.

when the Test SQL Statement window appears, it means my connection is successful.

To display category information. I drag catID and catName from binding panel and drop them into Design mode of Dreamweaver.

product.asp successfully show category information on IE Browser.

However, as picture shown, i can only display one image only on web browser, I want to show at least 2 records on the web. I have been searching a solution for this error.

working with Dreamweaver and Database Source Name (DSN)

2009-02-17T13:51:00.003Z

After creating "product.asp" directly on testing server, in the path "vhp0003/coursework1".
my aim is to try connecting to database file called "vhp0003cw1.mdb" on testing server by dreamweaver.

On database tab on right side of Dreamweaver, there is + button to create DSN.

After selecting DSN. I would get DSN dialog:

working with Dreamweaver and hosting (part 1 continure)

2009-02-17T13:02:00.004Z

I have found out an error that causes me can not connect to "coursework1".
My problem solving is to put " coursework1" in textfield of "what folder on the testing server do you want to store in ?"

then try "Test Connection" button

this means a connection between dreamweaver and testing server is fine now.

Finally, I am able to view all files on my testing server by Remote View.

Searching Model Design for my website template

2009-02-17T08:33:00.004Z

There are many website with different design layout on the internet, but it is difficult to choose the good quality design.
I have searched on Google for 5 formal design layouts from different 5 e-commerce websites such as ASDA, EBAY, TESCO, AMAZON and LAURA ASLEY

Among the websites, LAURA ASHLEY is well design with tidy layout, consistency, attractive icons and the main point is the website give to customers a background what the company is selling on the internet.

working with dreamweaver and hosting (part 2)

2009-02-15T17:59:00.004Z

It is a bit annoying when everytime I coded in dreamweaver then use Filezilla to drag all my my files into right place as coursework1. after playing dreamweaver for ages, I find out 1 easy way to connect direclty to university hosting, it directs every data values I coded toward to testing server, besides, I can create new folder or new web page in the hosting server without help from Filezilla. everthing gonna be easy with Dreamweaver.

Here I use FTP method to connect directly to testing server. To start with, Go on Site tab => choose Manage Sites.

A dialog box appeared and I clicked on New button, it showed me 2 options, choose FTP&RDS Server

Another dialog appeared afterward with many textfields, I fill in the name, FTP host, host directory, login and password, then click on Test button to test connection. If a box show web browser is connected scuccessfully. that is fine. but if it say FTP connection fail, a problem may be wrong login or password or wrong FTP host.

Connection is fine then on right hand side, we will see on File tab, an option button with a name of my current connected site then Option button called Local View . To see all files we have on testing server, I drop down down Local View, then select Remote View. A folder called "coursework1" that I want to work with, list all files inside.

On the final stage, my purpose is satysfied.

Create tables and their relationship entities

2009-02-12T10:26:00.007Z

Using Microsoft Access as tool to input data entry.
I created 2 tables :

"category": contains product types
"product": contains products details such as product ID, product name, etc.

In product table, I have 7 columns that are:

proID: contains a unique number for each product in the table.
proName: contains a name of a product.
proDes: contains full description of the product.
price: contains the product's current price.
image: contains a path to the picture of the product.
catID: contains the category of the product.
status : check the product is still in stock or temporarily out of stock.

Product Data entries:

In category table, there are 2 columns :

catID: contains a unique number for each product type.
catName: contains a name of a product type.

Category Data entries:

Relationship entity between category table and product table:

Week 2 - register domain name

2009-02-11T22:15:00.006Z

Firstly, I choose a website, which I can register my domain name for my website, is called "namecheap.com".

On the main page of the "namecheap.com" website, "clothesvn.com" is registered as a domain name for my e-commerce website, which is selling a specialist niche area within the product range of Vietnamese clothes.

After putting my chosen domain name and search, if the name is still available ( it has not been taken by some one, god blesses me,otherwise, I have to choose another name that can be short and easy to remember), a list of different domain appear :

As requirement of E-commerce, I like to choose .com rather than other domain name.
Next step is I must create an account :

the account registered process was done so far, I also paid a fee for my chosen domain name ~ 7 pounds per year.

after logging into my account, I have a screen of my management home page.

Unfortunately, today is not a right day to register with namecheap. its server is under maintenance, so I have to wait until 14_th Febuary 2009 (Saturday - Valintine day) to try setting up

Week 1- working with Dreamweaver and Hosting

2009-02-05T16:06:00.017Z

Open Dreamweaver MX OR Dreamweaver CS, here I am using Dreamweaver CS 3 to create my website and interact with database.
Click on "SITE" tag => new site

+ I name my site as register then give a hosting link that i already got :
http://cctmdev2.londonmet.ac.uk/

but the link is only directs me to the hosting, not in my account, so if I want to upload my sites into my account, I have to give my username account after the link, it should be :

http://cctmdev2.londonmet.ac.uk/vhp0003

set up scripting language interacting with server:
my scripting language about e-commerce is ASP so I will choose ASP VBScript

Next step is choose a path that we can store to and upload from

Week 1- use FTP Software

2009-02-04T09:34:00.007Z

use software to upload my website:
- Among FTP tools in the market, I like to use FileZilla.
- With this open-source software, I can :

Supports resume and transfer of large files >4GB
Powerful Site Manager and transfer queue
Drag & drop support
Remote file editing
Free and easy to use

Resource to download: download here