Khóa Học Thiết Kế Website Bằng WordPress Miễn Phí

Không cần phải nói quá nhiều về tầm quan trọng của website trong kỷ nguyên số hiện nay. Vấn đề là không phải ai cũng biết cách tạo 1 trang web ra sao, đặc biệt là khi không có kiến thức về lập trình hoặc hạn chế về ngân sách. Nếu bạn đang muốn làm website một cách dễ dàng và tiết kiệm mà chưa biết bắt đầu từ đâu thì Khóa Học Thiết Kế Website Bằng WordPress Miễn Phí do Thầy Lương Ngọc Bích ★ Nhà Giáo Dục Chuyển Hóa Số dày công xây dựng này sẽ giúp bạn thực hiện điều đó.

WordPress là một nền tảng linh hoạt, cho phép xây dựng và quản lý website mà không cần phải biết code. Ban đầu, WordPress được tạo ra để hỗ trợ viết blog cá nhân, nhưng về sau đã mở rộng để phục vụ nhiều mục đích khác nhau, từ trang tin tức cho đến trang web bán hàng thương mại điện tử. Bây giờ, hãy bắt tay vào việc xây dựng trang web cho riêng mình bằng cách nghiên cứu và thực hiện theo từng bước hướng dẫn làm web bằng WordPress chi tiết dưới đây.

1. Mỗi website bắt buộc phải có những gì?

1.1. Hosting (Dịch vụ lưu trữ):

Hosting là nơi lưu trữ toàn bộ dữ liệu của website như hình ảnh, tài liệu, mã nguồn… Các yếu tố như dung lượng (storage) và băng thông (bandwidth) là những khía cạnh quan trọng khi lựa chọn hosting.

Dung lượng (storage) là không gian lưu trữ mà nhà cung cấp dịch vụ Hosting phân bổ, đơn vị tính là Gigabyte (GB). Bạn cần ước lượng xem trang web của mình cần bao nhiêu dung lượng. Ví dụ, nếu website dự tính đăng nhiều hình ảnh chất lượng cao hoặc nội dung đa phương tiện, hãy chọn gói có dung lượng lớn để tránh tình trạng đầy bộ nhớ, có thể làm làm gián đoạn hoạt động của trang.

Băng thông (bandwidth) là lượng dữ liệu được truyền tải qua lại giữa trang web và người dùng trong một khoảng thời gian nhất định (thường tính theo tháng). Mỗi lần người dùng truy cập vào trang web, dữ liệu (chẳng hạn như mã nguồn, hình ảnh) sẽ được tải xuống thiết bị của họ, đó chính là lưu lượng băng thông. Nếu trang web có lượng truy cập cao, dữ liệu truyền tải lớn (nhiều hình ảnh, video), bạn sẽ cần gói Hosting với băng thông đủ lớn để tránh tình trạng nghẽn hoặc lỗi khi quá giới hạn băng thông.

Như vậy, Hosting phù hợp không chỉ giúp website phát triển ổn định, mà còn nâng cao uy tín của website với người truy cập. Khi mới bắt đầu, bạn có thể dùng Shared Hosting với ưu điểm rẻ và dễ sử dụng. Nhà cung cấp dịch vụ thường cài đặt sẵn các phần mềm quản trị như cPanel, DirectAdmin hay Plesk (trong khóa học này sử dụng cPanel), giúp bạn dễ dàng xây dựng và quản lý trang web dù không có nhiều kiến thức kỹ thuật. Vì thế, đây là giải pháp lý tưởng cho cá nhân và doanh nghiệp nhỏ mong muốn xây dựng sự hiện diện trên Internet.

Do chi phí thấp, loại hình này có hạn chế về hiệu suất và tùy biến do chia sẻ tài nguyên với nhiều người dùng khác. Khi lượng truy cập tăng, bạn có thể cân nhắc nâng cấp lên các giải pháp lưu trữ cao như như VPS hoặc Cloud Hosting.

1.2. Domain (Tên miền):

Mỗi hosting được “định vị” bằng một địa chỉ IP (Internet Protocol). Địa chỉ IP này giống như số nhà trên Internet, giúp các máy tính khác kết nối và xem nội dung trên website của bạn. Mặc dù hữu ích cho máy tính, nhưng địa chỉ IP không thực sự thân thiện với con người vì đó là một chuỗi số khó nhớ (một bộ gồm 4 số từ 0 đến 255). Và đó là lúc tên miền phát huy tác dụng.

Domain chính là “tên” của trang web, được quản lý thông qua hệ thống DNS (Domain Name System). DNS sẽ liên kết domain với địa chỉ IP, nhờ đó bạn chỉ cần nhập một tên miền đơn giản thay vì gõ những con số phức tạp. Cách làm này không chỉ giúp việc truy cập trang web trở nên thuận tiện hơn, mà còn giúp tạo dấu ấn thương hiệu và tăng mức độ tin cậy trong mắt người dùng.

Tên miền gồm 2 thành phần chính là tên website (second-level domain) và tên miền cấp cao (top level domain) phân cách bởi dấu chấm. Tên miền cấp cao có nhiều loại như: Tên miền quốc gia (.vn, .us, .uk…) hay Tên miền quốc tế (.com, .net, .org…). Ví dụ tên miền của website này là luongngocbich.com thì tên website là luongngocbich và tên miền cấp cao là .com.

Đến đây thì chắc rằng bạn đã nắm rõ địa chỉ website là gì hay tên miền website là gì rồi đúng không? Nhưng phải nhớ thêm là để tối ưu chuẩn SEO, bạn cần chọn tên miền ngắn gọn, đơn giản, đảm bảo tiêu chí dễ nhớ, dễ đọc, dễ viết (dễ gõ phím). Tên miền nên chứa thương hiệu, từ khóa, vị trí địa lý và tránh sử dụng chữ số hay dấu gạch nối.

Hosting và Domain thường cần được mua và duy trì hằng năm, là hạng mục ngân sách không thể thiếu trong chi phí duy trì website 1 năm.

Có rất nhiều nhà cung cấp uy tín trong và ngoài nước, bạn có thể tìm hiểu và mua ở nhà cung cấp nào cũng được. Bản thân tôi đã trải nghiệm sử dụng hầu hết các đơn vị nổi tiếng trong nước cũng như quốc tế.

Tuy nhiên, nếu đây là lần đầu tiếp xúc với những công việc này thì bạn nên mua Hosting và Domain ở cùng một nhà cung cấp để thuận tiện cho việc yêu cầu hỗ trợ. Chẳng hạn như kết nối Hosting và Domain nếu việc này không được tự động hóa. Khi Hosting và Domain đã hoạt động, đó là lúc chúng ta bắt đầu làm việc với WordPress.

2. Cách làm website bằng WordPress

Như đã đề cập ở trên, khóa học này sử dụng Hosting cPanel để hướng dẫn làm web bằng WordPress. Thật ra, nếu bạn sử dụng Plesk hoặc DirectAdmin thì cũng không có quá nhiều khác biệt nên cứ an tâm nhé.

2.1. Bảo mật với chứng chỉ SSL

Kéo xuống dưới phần Security, chọn SSL/TLS Status

Trong cửa số mới hiện ra, nếu thấy vòng tròn màu xanh lá cây và ổ khóa đóng như hình dưới là đã kích hoạt tính năng thành công, không cần làm gì thêm, thoát ra ngoài để tiếp tục. Nếu thấy màu đỏ, thì nhấn chọn tất cả rồi nhấp vào Run AutoSSL (ở vị trí mũi tên) và chờ trong giây lát để hệ thống chạy kích hoạt.

Nếu vẫn không kích hoạt thành công mặc dù đã thử nhiều lần và chờ lâu thì nhắn tin nhờ hỗ trợ kích hoạt SSL cho tên miền đã đăng ký

2.2. Cài đặt WordPress

Kéo xuống dưới cùng chọn biểu tượng WordPress

Trong cửa sổ mới hiện ra chọn Install (hoặc Custom Install)

Phần Choose Protocol, chọn https:// hoặc https://www (chỉ hoạt động khi đã cài đặt chứng chỉ SSL thành công ở bước trên).

Phần In Directory để trống, Choose the version chọn phiên bản mới nhất.

Tiếp theo, bạn kéo xuống dưới và nhập đầy đủ các thông tin như sau:

• Site Name: tên trang web (thương hiệu)
• Site Description: mô tả ngắn (khẩu hiệu, slogan…)
• Admin User: tên đăng nhập quản trị
• Admin Password: mật khẩu
• Admin Email: địa chỉ thư điện tử đang sử dụng
• Select Language: nên chọn ngôn ngữ tiếng Việt (Vietnamese) để dễ thao tác

Nếu muốn cấu hình nâng cao, bạn có thể tiếp tục thiết lập tại phần Advanced Options gồm:

• Database Name: tên cơ sở dữ liệu
• Table Prefix: tiền tố trước tên bảng cơ sở dữ liệu

Hai phần này có thể giữ nguyên như mặc định, có thể lựa chọn thêm tính năng tự động cập nhật (Auto Upgrade)

Thiết lập xong kéo xuống dưới cùng nhấn nút Install (Không cần chọn Select Themes, sẽ hướng dẫn cụ thể ở phần sau). Chờ trong giây lát để quá trình cài đặt hoàn tất. Chúc mừng bạn đã public web server ra internet thành công.

Xuất hiện như hình dưới là thành công. Nhấn vào tên miền để xem trang web, nhấn vào tên miền/wp-admin/ (Administrative URL) để vào trang quản trị.

Giao diện mặc định của trang web (truy cập vào tên miền)

Giao diện trang quản trị (truy cập vào tên miền/wp-admin/)

Như vậy là bạn đã có được website của riêng mình rồi đó. Cũng không quá khó khăn phải không nào? Bây giờ, chúng ta cùng tùy chỉnh trang web cho đúng ý mình nhé.

2.3. Thiết lập cơ bản

Chọn Cài đặt => Tổng quan

Có thể điều chỉnh Tên và Khẩu hiệu website 

Chọn Múi giờ Việt Nam (UTC +7), Định dạng ngày tháng và thời gian. Nhấn Lưu thay đổi để hoàn tất.

Tiếp tục chọn Cài đặt => Đường dẫn tĩnh.

Chọn Cấu trúc đường dẫn tĩnh ngắn gọn, đơn giản (Có thể như hình dưới) và nhấn Lưu thay đổi.

2.4. Cài đặt Plugin

Chọn Plugin => Add New Plugin

Gõ tên Plugin vào ô Tìm kiếm gói mở rộng, tìm được rồi thì nhấn nút Cài đặt, hoàn tất cài đặt thì tiếp tục nhấn nút Kích hoạt. Nhấn vào Plugin đã cài đặt để xem danh sách Plugin đang có. 

Chú ý chỉ nên cài đặt và kích hoạt những Plugin cần thiết để tiết kiệm dung lượng Hosting. Một số Plugin cơ bản như, bạn có thể tìm kiếm và cài đặt như hình bên dưới.

2.5. Cài đặt Theme (Giao diện)

Chọn Giao diện => Giao diện.

Chọn Thêm giao diện mới.

Ở đây, tôi sẽ hướng dẫn sử dụng giao diện Flatsome để xây dựng website bán hàng để làm mẫu. Nếu bạn muốn sử dụng các giao diện khác thì cũng thao tác tương tự là được.

Chọn Tải giao diện lên.

Chọn tệp đã lưu trong máy tính (nãy mới tải về), xong nhất Cài đặt và chờ trong giây lát.

Cài đặt thành công, nhấn Kích hoạt.

Sau khi đã được kích hoạt, một số giao diện như Flatsome sẽ xuất hiện thêm phần thiết lập ban đầu theo nhu cầu sử dụng. Để thực hiện bạn nhấn Let’s Go! Hoặc nhấn Not Right Now để cấu hình sau. Ở đây mình sẽ tiến hành luôn.

Tiếp theo là bước nhập mã kích hoạt bản quyền giao diện để được cập nhật tự động khi có phiên bản mới nhất và nhận sự hỗ trợ trực tiếp từ nhà phát triển. Sau khi nhập xong nhấn Activate. Nếu chưa muốn nhập mã ngay lúc này thì nhấn Skip this step để qua bước kế tiếp.

Bạn sẽ được hỏi có muốn sử dụng Child Theme (giao diện con) hay không. Nếu muốn thì nhấn Create and Use Child Theme. Nếu chưa muốn sử dụng thì nhấn Skip this step để qua bước kế tiếp.

Trong bước kế tiếp, chúng ta sẽ cài đặt những plugin mặc định đi kèm với giao diện Flatsome. Nhấn Countinue và chờ trong giây lát để hệ thống cài đặt.

Sau đó, chúng ta tiếp tục nhập vào những nội dung mẫu (Demo Content). Chỉ cần nhấn Countinue và chờ một chút là xong.

Ở đây, bạn có thể:

• Upload Logo: Nhấn Upload New Logo để tải logo đã thiết kế lên
• Select Preset: chọn giao diện mẫu tùy thích

Khi đã hoàn tất, nhấn Continue để tiếp tục.

Cuối cùng, nhấn Agree and Continue để hoàn tất quá trình thiết lập nhé.

Khi màn hình này xuất hiện, nghĩa là bạn đã cài đặt Flatsome thành công. Hãy nhấn View your new website để xem thành quả nhé.

Lúc này, khách truy cập sẽ thấy website của bạn trong hình hài như hình bên dưới.

Mọi thứ vẫn còn khá sơ khai phải không nào. Bởi vậy, chúng ta cần phải tiếp tục tùy chỉnh. Vào Giao diện, chọn Begin Installing plugins.

Mục đích của hành động này là để cài đặt những plugin cần thiết nếu như bạn chưa thực hiện ở phần cấu hình ban đầu lúc nãy. Nhấn vào Hành động, chọn Install rồi chọn cài đặt các plugin đi kèm bằng cách chọn vào hộp vuông ở trước tên plugin như hình dưới. Sau đó nhấn Áp dụng và chờ trong giây lát để quá trình cài đặt hoàn tất.

Tiếp tục thực hiện tương tự nhưng chọn Activate và nhấn Áp dụng để kích hoạt các plugin. Nếu quá trình này có trục trặc thì thao tác thủ công từng plugin.

Sau khi kích hoạt thành công, chọn Tùy biến ở trong phần Giao diện. 

Tiến hành tùy biến website theo ý muốn ở chức năng này bằng cách thao tác với menu ở bên trái. Chỉnh sửa xong nhấn Đăng (góc trên bên phải của menu) để lưu. Sau khi lưu thành công thì nút Đăng sẽ chuyển thành Đã xuất bản. Để thoát ra thì nhấn dấu X ở bên góc trái phía trên.

Dưới đây là một số hạng mục chính mà bạn nên tùy chỉnh để có website như ý muốn, góp phần xây dựng và đồng bộ nhận diện thương hiệu.

– Thêm Biểu tượng site (Favicon): Vào Header ⇒ Logo & Site Identity ⇒ Kéo xuống dưới cùng.

– Thay đổi màu sắc: Vào Style => Colors

– Thay đổi kiểu chữ: Vào Style => Typography. Tham khảo các kiểu chữ tiếng Việt tại https://fonts.google.com/?subset=vietnamese

– Thay đổi phương thức thanh toán: Vào WooCommerce => Payments Icons

– Thay đổi văn bản cuối trang: Vào Footer, kéo xuống phần Bottom Text – Primary, thay UX Themes thành tên thương hiệu hoặc bất kỳ nội dung nào bạn mong muốn.

Để giúp bạn thiết kế trang web dễ dàng và nhanh chóng, Flatsome đã tích hợp sẵn công cụ UX Builder. Sử dụng hình thức kéo và thả rất đơn giản và trực quan, UX Builder cho phép bạn dễ dàng tạo ra các trang web, bài viết, trang giới thiệu sản phẩm đẹp mắt và dễ sử dụng mà không gặp khó khăn. Tính năng xem trước trực tiếp giúp bạn thấy ngay các thay đổi khi chỉnh sửa, nhờ đó tiết kiệm được rất nhiều thời gian và công sức.

Bạn có thể sử dụng công cụ này bằng cách truy cập vào trang chủ (hoặc trang bạn muốn điều chỉnh) và chú ý thanh menu ở trên cùng, chọn Sửa trang, Edit with UX Builder.

Bằng cách này, bạn có để điều chỉnh bố cục trang web theo ý muốn. Muốn thay đổi phần nào thì chỉ cần nhấp vào phần đó rồi tùy chỉnh. 

Ví dụ điều chỉnh banner đầu trang thì nhấn trực tiếp vào banner, hoặc nhấn vào Slider ở menu bên trái, rồi chọn từng banner để thao tác. Nhấp vào biểu tượng bánh xe sẽ hiện ra menu, chọn Options để tùy chỉnh chi tiết.

Thay đổi ảnh Nền như hình dưới. Chú ý thiết kế đúng kích thước để hiển thị đầy đủ, không nên ghi chữ trên banner vì khi xem trên điện thoại có thể bị che mất. Thay vào đó, gõ chữ trong UX Builder và điều chỉnh để có thể tự động tương thích với từng kích thước màn hình.

Thay đổi câu từ và nút bấm trên banner. Các phần khác thực hiện tương tự. 

Có thể thêm bớt các phần nếu muốn bằng cách nhấn vào Add Elements. Điều chỉnh xong nhấn Update ở dưới cùng bên trái để lưu lại.

Các thành phần không chỉnh được trong UX Builder này thì quay lại trang quản trị, chọn UX Blocks, rê chuột vào thành phần muốn chỉnh (chẳng hạn như Footer) và chọn Edit with UX Builder để kích hoạt trình chỉnh sửa riêng cho thành phần đó.

Thêm vào đó, còn có các phần mở rộng gọi là Widget, giúp bạn có thể chỉnh sửa Sidebars (thanh bên) và Footers (chân trang). Để thực hiện việc này, hãy vào Giao diện và chọn Widget.

Muốn thay đổi phần nào thì nhấp chọn phần đó và tùy chỉnh theo ý muốn. Có thể kích hoạt menu hỗ trợ bằng cách nhấn dấu 3 chấm ở thanh công cụ. Nếu muốn xóa thì nhất Delete. Nhấn Cập nhật ở góc trên bên phải để lưu.

Nhấp vào dấu + để thêm các thành phần khác nếu muốn. Sau khi chỉnh sửa xong Trang chủ thì làm tương tự với các trang khác.

2.6. Tạo Menu

Menu là tập hợp các liên kết được sắp xếp một cách có tổ chức để giúp người dùng điều hướng, truy cập các khu vực nội dung quan trọng trên trang web của bạn. Thông thường, Menu được hiển thị ở các vị trí như đầu trang (header), thanh bên (sidebar), chân trang (footer), hoặc những khu vực tùy biến khác (tùy vào giao diện đang sử dụng).

Menu là công cụ quan trọng giúp khách truy cập hiểu rõ cấu trúc website của bạn và điều hướng đến nội dung cần thiết một cách nhanh chóng. Thành phần của Menu bao gồm

• Trang (Pages): Các trang tĩnh như “Giới thiệu”, “Liên hệ”…
• Bài viết (Posts): Tạo liên kết đến các bài viết cụ thể.
• Chuyên mục (Categories): Liên kết đến các trang liệt kê bài viết của một chuyên mục nào đó.
• Thẻ (Tags): Ít dùng hơn, nhưng vẫn có thể tạo liên kết đến trang hiển thị các bài viết theo thẻ.
• Liên kết tùy chỉnh (Custom Links): Dẫn đến bất kỳ URL nào (có thể là liên kết đến một trang web bên ngoài).

Trong đó, cả Page (trang) và Post (bài viết) đều là các loại nội dung cơ bản, nhưng chúng có một số điểm khác biệt quan trọng về mục đích sử dụng, cách tổ chức và hiển thị:

• Mục đích và nội dung:

– Page thường dùng cho các nội dung tĩnh, ít thay đổi, có tính “lâu dài” và không liên quan chặt đến mốc thời gian. Ví dụ: trang “Giới thiệu”, “Liên hệ”, “Điều khoản dịch vụ” hay “Chính sách bảo mật”.

– Post hay được dùng để xuất bản các nội dung theo dòng thời gian, mang tính cập nhật, tin tức hoặc bài viết blog. Khi thêm bài viết mới, các bài cũ sẽ được đẩy xuống phía dưới theo thứ tự thời gian.

• Phân loại:

– Page: Không được phân loại bằng Categories (Danh mục/Chuyên mục). Thay vào đó, Page có thể được sắp xếp theo dạng cha – con với tính năng Page Attributes. Điều này hữu ích nếu bạn cần tổ chức nhiều trang có mối quan hệ hoặc cấu trúc phân cấp.

– Post: Có thể gán Categories để giúp người dùng phân loại và tìm kiếm nội dung dễ hơn. Tính năng này phù hợp với các trang blog, tin tức, nơi nội dung được cập nhật thường xuyên.

• Sử dụng trong thực tế

– Page: Các trang giới thiệu công ty, sản phẩm, dịch vụ, liên hệ, chính sách, điều khoản.

– Post: Các bài tin tức, thông báo, bài viết chia sẻ kinh nghiệm, mẹo vặt, hướng dẫn…

Để thêm các thành phần vào Menu, bạn truy cập trang quản trị và chọn Giao diện ⇒ Menu.

Thay đổi menu theo ý muốn (dựa vào sơ đồ trang web đã vẽ). Hoàn tất công việc nhấn Lưu menu ở phía dưới màn hình. Dưới đây là video hướng dẫn chi tiết.

3. Cách lập trang web bán hàng với WooCommerce

WooCommerce là một plugin được thiết kế chuyên dụng cho việc xây dựng và quản lý cửa hàng trực tuyến. Với WooCommerce, bạn có thể dễ dàng xây dựng website thương mại điện tử, quản lý sản phẩm, đơn hàng, thanh toán, vận chuyển… chỉ với vài thao tác đơn giản. Dưới đây là video tổng quan về WooCommerce và cách để bắt đầu xây dựng trang web bán hàng bằng plugin này:

Hiện nay, WooCommerce đang là lựa chọn phổ biến nhất để xây dựng website bán hàng trên nền tảng WordPress nhờ tính linh hoạt, miễn phí cốt lõi và đa dạng tiện ích mở rộng.

4. Hướng dẫn làm SEO web chuẩn với Yoast SEO

Trong video bên dưới, bạn sẽ biết được cách cài đặt và cấu hình plugin hỗ trợ tối ưu SEO web WordPress hàng đầu thế giới hiện nay là Yoast SEO.

Bên cạnh đó, video cũng hướng dẫn cách tích hợp công cụ đo lường Google Analytics và Google Search Console giúp bạn theo dõi thành quả website của mình thu được.

Ở phần cuối, mình có chia sẻ chi tiết cách tối ưu bài viết với Yoast SEO, các bạn cùng xem và thực hiện nhé.