Wednesday, July 19, 2017

Hướng dẫn tạo Menu ngang và Menu dọc cho Blogspot

Hướng dẫn tạo Menu ngang và Menu dọc cho Blogspot

Giúp trang Blogspot của bạn trông đẹp hơn, gọn gàng hơn và chuyên nghiệp hơn



Thực ra các hướng dẫn này Sơn Nguyễn đã có ở Bài 1: Hướng dẫn tạo Blogspot chi tiết từ căn bản đến nâng cao và Bài 38: Hướng dẫn tạo Menu Categories danh mục cho Blogspot nhưng đến giờ này vẫn có nhiều bạn vẫn "hỏi thăm" nhờ hướng dẫn thêm -.-

Mà cũng lâu rồi ko hướng dẫn về thủ thuật Blogger nên hôm nay Sơn Nguyễn tổng hợp lại 3 cách tạo menu cho Blogspot đơn giản để các bạn mới dễ hình dung hơn nhé
  1. Tạo Menu ngang cơ bản cho Blogspot
  2. Tạo Menu ngang chứa nhiều bài viết cho Blogspot
  3. Tạo Menu dọc cho Blogspot

Ps: bên thanh sidebar bên phải đã có mục Serie các bài hướng dẫn Blogspot đã được sắp xếp sẵn từ bài đầu tiên đến bài cuối nhất, các bạn chịu khó từ từ tham khảo thêm nhé

#1: Tạo Menu ngang cho Blogspot (cơ bản)

Ví dụ như tạo Blogspot về Bất động sản thì phần menu ngang gồm các Trang sau: CHỦ ĐẦU TƯ, QUY MÔ, VỊ TRÍ, TIỆN ÍCH, MẶT BẰNG, PTTT, NGÂN HÀNG, LIÊN HỆ ...v...v...
(Xem hình minh họa)

Cách làm như sau:

Vào Bố cục --> Trang -->  Trang mới --> tiến hành tạo các trang Menu ngang cho Blogspot


(nếu làm như hình minh họa trên thì cần tạo các Trang lần lượt có tên: CHỦ ĐẦU TƯ, QUY MÔ, VỊ TRÍ, TIỆN ÍCH, MẶT BẰNG, PTTT, NGÂN HÀNG, LIÊN HỆ ...v...v...)

Sau khi tạo xong các Trang cần thiết để làm Menu ngang cho Blogspot thì bạn vào Bố cục --> Cross Column (nằm phía trên Main - Bài đăng trên Blog) --> Thêm tiện ích 


--> chọn Wiget Trang



--> tick chọn các Trang đã tạo --> kéo sắp xếp lại vị trí --> Lưu



Cuối cùng kiểm tra kết quả xem thế nào nhé ^^

#2: Tạo Menu ngang có nhiều bài viết cho Blogspot

Với cách #1 thì mỗi menu ngang của Blogspot chỉ chứa được 1 bài viết mà thôi. Nếu bạn muốn Menu ngang đó chứa được nhiều bài hơn thì tham khảo cách dưới đây nhé

Hình minh họa
Menu "Điện thoại Nokia" trên thanh Menu ngang của Blogspot có nhiều bài viết

Tạo Menu có nhiều bài viết như hình trên chỉ là thủ thuật đơn giản của Blogger: dùng Label (Nhãn) của bài viết để tạo Menu ngang cho Blogspot. Khi click vào tên Menu thì hiện ra nhiều bài viết có chung Label (ví dụ như hình minh họa phía trên). Vì vậy, khi viết bài, các bạn nhớ thêm Label (nhãn) vào từng bài viết để dễ dàng tạo Menu ngang có nhiều bài viết  nhé ^^

Cách làm như sau: 

Bố cục --> Cross Column --> Thêm tiện ích --> Trang



Sau đó bấm vào Thêm liên kết bên ngoài



--> Đặt tên cho Menu
--> Paste link của Label (Nhãn) của bài viết vào (link các Label của Blogspot có dạng: Domain/search/label/tên Label)
--> Lưu liên kết là xong


#3: Tạo Menu dọc cho Blogspot

Làm tương tự như tạo Menu ngang có nhiều bài viết cho Blogspot, chỉ khác là tạo Menu bên phần sidebar ở bên phải hoặc bên trái mà thôi

Menu dọc nằm bên thanh sidebar bên phải của Blogspot

Cách làm:

Bố cục --> sidebar-right-1 --> Thêm tiện ích


--> Trang 
--> phần Tiêu đề (tùy chọn): thay chữ Pages thành tên của Menu chính (ví dụ như ở hình minh họa là: Laptop, Điện thoại ...)
 --> Thêm liên kết bên ngoài




 --> Đặt tên cho Menu con (ví dụ như lúc nãy bạn đặt tên Menu chính là Laptop rồi thì tên Menu con sẽ là: Dell, Acer ..v...v...) --> Paste link vào --> Lưu liên kết --> Xong ^^

Với cách tạo Menu dọc cho Blogspot đơn giản như thế này nhưng vô cùng lợi hại, vì nó có thể tạo ra nhiều Menu hơn, rất thuận tiện cho các bạn tạo Blog bán hàng có nhiều danh mục sản phẩm cần đưa ra Trang chủ

Các bạn xem thêm ở bài viết này để hiểu rõ hơn nhé (có video hướng dẫn trong bài sẽ dễ hình dung hơn)
>> Hướng dẫn tạo Menu Categories danh mục cho Blogspot

#4: Tạo Menu ngang nhiều cấp đổ dọc xuống cho Blogspot

Menu ngang có nhiều cấp đổ dọc xuống

Như vậy, Sơn Nguyễn đã hướng dẫn xong 3 cách tạo Menu cho Blogspot đơn giản. Còn các bạn muốn tạo Menu ngang có nhiều cấp đổ xuống thì các bạn tìm các Templates Blogger phù hợp có sẵn các đoạn code menu ngang đa cấp đổ dọc xuống rồi, các bạn chỉ tiền hành cài đặt lại nó thôi. Cũng đơn giản thôi mà ^^.

Cách làm:
Các bạn vào chỉnh sửa HTML --> bấm Ctr+F để tìm tên Menu rồi thay thế chúng và đưa đường link vào thay cho dấu '#' là ok thôi (nhớ làm từng cái 1, xong kiểm tra kết quả, thấy ok thì làm tiếp)

Các bạn hãy tham khảo thêm Bài 8: Hướng dẫn thiết kế website chuyên nghiệp với Blogspot để dễ làm hơn nhé ^^

Sắp tới Sơn Nguyễn sẽ thu xếp thời gian để làm 1 vài bài hướng dẫn tạo blogspot bán hàng, tạo blog bất động sản ...v....v... dùng các template Blogspot download trên mạng về, lúc đó sẽ có phần tạo Menu đổ xuống nhiều cấp để các bạn tham khảo thêm

Comming soon ...

Chúc các bạn thành công!
  • Để tìm các bài viết trên Google nhanh nhất, hãy tìm theo cú pháp: "từ khóa tìm kiếm + nguyentruongson.info"