Thiết kế website (part 1)

Web động, web tĩnh là gì ? => Web động tĩnh khác nhau ở đâu ? Web thương mại điện tử là gì ? Cài đặt wordpress Cài đặt Themes ⇒ simple blog Update dữ liệu Tùy biến giao diện ⇒ Có 2 cách để tùy chỉnh giao diện (M1: Appearance Customise; M2: Click on the “customise” button on website)

Trang 1

THIẾT KẾ WEBSITE

ThS Dương Đắc Quang Hảo

Giảng viên

Đại học Kinh tế - Đại học Huế

Huế, 02/2019

Trang 2

NỘI DUNG

1. Các khái niệm cơ bản

2. Thị trường điện tử

3. Lợi ích & Giới hạn

4. Xu hướng phát triển

2

Trang 3

1 Một số khái niệm cơ bản

Website là gì?

Domain + Hosting là gì ?

DNS là gì ? => 4 bước xử lý để truy cập website

Thanh toán điện tử - ThS Dương Đắc Quang Hảo 3

Trang 4

Web động, web tĩnh là gì ?

=> Web động/ tĩnh khác nhau ở đâu ?

Web thương mại điện tử là gì ?

Trang 5

Website responsive là gì?

Cross Browser là gì ?

Retina display là gì ?

Trang 6

SEO Ready là gì ?

Trang 7

CMS là gì ?  Content Management System

Check CMS & other tools: 1 Builtwith; 2 Similartech

CMS có mấy loại? gồm loại gì ?  Wordpress

Trang 8

Ưu điểm và nhược điểm của wordpress ?

Ưu điểm

Dễ cài đặt (5 mins for setting up), quản lý & update

Sử dụng cho mục đích làm web hoặc viết blog cá nhân đều được

Hằng năm có hàng nghìn thiết kế giao diện cho wordpress - cả bản free và trả tiền (e.g trang rất nổi tiếng:

https://themeforest.net/search/$2)

Số lượng plugin nhiều không cần thuê code cũng có thể làm web mình mong muốn

Free: https://wordpress.org/plugins/tags/free/

Buy: https://codecanyon.net/

Cộng đồng sử dụng wp rộng và nhiều

wp được hướng tới giao diện cho di động

wp là một bộ mã nguồn mở free

Dễ search trên google

Có phần soạn thảo dễ sử dụng với giao diện như office

Trang 9

Ưu điểm và nhược điểm của wordpress ?

Nhược điểm

Bảo mật.

WordPress là mã nguồn mở nên hacker dễ dàng tìm thấy kẽ hở và điểm yếu về bảo mật.

WordPress thiếu khả năng quản lý người dùng cơ bản và phân chia vai trò

WordPress cũng đã được báo cáo là có hiệu suất thấp trong việc xử lý các cơ sở dữ liệu dung lượng lớn và multisite

Theme của WordPress khó chỉnh sửa.

Rất nhiều WordPress themes và plugins miễn phí không được cập nhật và hỗ trợ.

Trang 10

2 Cài đặt wordpress

Method 1: Phương pháp truyền thống, cài trên local host

1 Cài Server (local host) trên máy để cài đặt chỗ lưu trữ dữ liệu (cài ⇒

wamp)

Wamp Services: http://www.wampserver.com/en/

2 Download wordpress: https://wordpress.org/download/

Method 2: Instant wordpress - phương pháp cài đặt nhanh

Vào trang https://instantwp.com/downloads/ để tải & cài đặt

Note: cách này khi làm web bán hàng sẽ có 1 chút lỗi tiếng việt

1 Cài đặt local host và tải wordpress

Trang 11

Trong folder C:\wamp64\www, tạo thư mục để lưu trữ dữ liệu (Giải nén folder

wordpress, đổi tên folder => ex Web1)

vào trang http://localhost/phpmyadmin/ (User: root; PW: …)  database, tạo

CSDL online Vào trang localhost/web1 để tạo website

B3 Nhập thông tin website (tên CSDL: web1; ID: root; PW: …)

2 Tạo website

Trang 12

Hai Kiểu dữ liệu trong wordpress là gì ?

Bài viết (post)  vnexpress.net Trang (page)  contact, about, FAQs,…

Note: Kiểu dữ liệu post có phần danh mục, còn page thì không

Trang 13

Themes?

Có 2 cách để add theme:

Method 1: download, giải nén xong up lên

Method 2: ấn nút “Add new”

Widget?

Menu?

Plugin? Ex Contact form 7

Wordpress tools (import/ export)?

Trang 14

Exercise 1

→ Thực hành tạo 1 web đặt tên là web1

Tùy chỉnh theme mặc định trên wordpress:

viết bài: 5 post test

Tạo Trang: 5 trang test

Sửa Menu: thêm trang vào menu

Cài contact form 7: thêm vào bài viết

Nhập xuất dữ liệu wordpress

Nhập 20 sản phẩm mẫu

Hoàn thành xong 1 trang vozexpress hoàn chỉnh: gồm 5 bài viết , 5 trang

Trang 15

3 Thiết lập web bán hàng

Purpose: Tự bán hàng và quản lý hàng, đơn hàng, dịch vụ ship hàng

Process:

Step 1 - Set up wordpress & woocommerce

Step 2 - Set up các thông số cho woocommerce

Step 3 - add new products

Step 4 - add & adjust menu

Step 5 - add themes + import the existing data

Step 6 - Thiết lập quản trị (check order, set promotion code, report, setting general business info)

Trang 16

Exercise 2

→ Cài mẫu web mới đặt tên là web2

Cài xong, cài thêm plugin woocommerco

Thêm demo 10 sản phẩm : đầy đủ hình ảnh, giá , chi tiết sản phẩm

Thêm tất cả trang vào menu: giỏ hàng, tài khoản, cửa hàng , trang chủ

Trang 17

Exercise 3

→ Cài 1 web mới đặt tên là web3:

Cài theme: storefront

Import dữ liệu từ web2

Sửa lại web3 cho đẹp

Thiết lập web trong phần quản trị , giao hàng,

Trang 18

Exercise 4

→ Web tin tức: Cài mẫu web mới đặt tên là webnews

Cài đặt wordpress

Cài đặt Themes simple blog⇒

Update dữ liệu

Tùy biến giao diện Có 2 cách để tùy chỉnh giao diện (M1: Appearance/ ⇒

Customise; M2: Click on the “customise” button on website)

Cài thêm các plugin

Ex Facebook comment; Contact Form 7

Định dạng
Số trang	18
Dung lượng	1,93 MB