Hướng dẫn chỉnh sửa theme wordpress bằng css

Wordpress là một mã nguồn mở dùng để tạo lập website được rất nhiều người sử dụng. Mã nguồn này cho phép người dùng tùy ý chỉnh sửa giao diện để có trang web ưng ý. Nếu bạn chưa biết cách chỉnh sửa giao diện wordpress thì hãy đọc bài viết sau. Nhân Hòa sẽ có hướng dẫn chỉnh sửa chi tiết.

Mục lục []

1. Tìm hiểu về chỉnh sửa giao diện wordpress

Chỉnh sửa giao diện wordpress là việc bạn tạo mới một trang hoặc chỉnh sửa một trang có sẵn trên wordpress. Trình chỉnh sửa giao diện bao gồm

- Thay đổi màu trang

- Thay đổi ảnh tiêu đề

- Thay đổi ảnh nền

- Tùy chọn danh mục menu

- Widgets - thêm mới / xóa nội dung

- Thay đổi cài đặt trang

- Thêm CSS

Khi đăng nhập vào trang quản trị wordpress, tại mục giao diện bạn nhìn thấy các đề mục như ảnh.

Ý nghĩa của các đề mục này như sau.

- Giao diện: Cho phép bạn chọn giao diện có sẵn hoặc tìm kiếm và chọn giao diện mới cho website.

- Tùy biến: Nơi bạn thực hiện các chỉnh sửa giao diện wordpress. Thay đổi tiêu đề, thay đổi màu sắc, ảnh nền,...

- Widget: Chứa các tiện ích có thể thêm vào giao diện wordpress. Ví dụ như ô tìm kiếm, menu, lịch, đồng hồ,...

3. Hướng dẫn cài đặt giao diện wordpress

Giao diện wordpress chính là trang nội dung website của bạn được hiển thị với người dùng. Bạn có thể cài đặt giao diện wordpress riêng tùy theo sở thích và nhu cầu. Các bước thực hiện như sau.

Bước 1: Đăng nhập vào trang quản trị wordpress > Chọn tab “Giao diện” > Chọn “Thêm mới”

Bước 2: Chọn giao diện mong muốn

Sau khi nhấn thêm mới, wordpress sẽ hiện 1 danh sách các giao diện mẫu. Tùy vào mục đích tạo trang mà bạn có thể chọn mẫu giao diện ưng ý. Để tìm kiếm dễ dàng hơn, hãy gõ từ khóa cần tìm ở ô tìm kiếm.

Bước 3: Chọn giao diện mẫu > Nhấn “Cài đặt”

Như vậy là bạn đã có thể cài đặt giao diện wordpress thành công. Bạn có thể xem giao diện đã cài đặt tại trang chủ. Để tối ưu giao diện mẫu này hãy tiến hành chỉnh sửa giao diện.

Xem thêm: 20 theme wordpress bán hàng cao cấp miễn phí

4. Hướng dẫn chỉnh sửa giao diện wordpress

Bước 1: Nhấp vào giao diện muốn chỉnh sửa

Bước 2: Chọn trình chỉnh sửa mong muốn

Mỗi tùy chọn, bạn có thể chỉnh sửa giao diện wordpress với những tiêu chí riêng,

Ví dụ: General Setting - Cài đặt chung

Tại đây, bạn có thể chỉnh sửa tiêu đề, ảnh nền trang, thay đổi cài đặt tiêu đề,...Cụ thể như sau.

- Static Front page: Được hiểu là tùy chỉnh trang chủ, cho phép bạn cài một trang bất kỳ làm trang chủ website. Bài viết trên trang này mặc định là mới nhất.

- Site Logo/ Title/ Tagline: Được hiểu là tùy chỉnh tiêu đề, logo và câu tagline. Bạn có thể thay đổi tiêu đề website, viết lại dòng mô tả, tải ảnh logo mới tại mục này.

- Background Image: Tùy chỉnh ảnh nền website. Tuy nhiên không cần thiết do sẽ làm tốc độ tải trang lâu hơn, tốn dung lượng lưu trữ.

- Color: Mục này dùng để chỉnh sửa màu nền và màu chủ đạo của trang web.

- Header Settings: Tùy chọn bật menu ở góc trên cùng màn hình.

Với mỗi trình chỉnh sửa, bạn chỉ cần click chuột vào tên thì wordpress sẽ cho bạn biết chức năng chỉnh sửa.

5. Hướng dẫn chỉnh sửa giao diện wordpress bằng css

CSS giúp thay đổi font chữ, cỡ chữ, màu viền website. Việc chỉnh sửa giao diện wordpress bằng css như sau.

Bước 1: Dùng tiện ích “Inspect” của Chrome để dò CSS của thành phần muốn chỉnh sửa trên website.

Bước 2: Vào trang wordpress muốn chỉnh sửa giao diện > Nhấn chuột phải chọn “Inspect”

Bước 3: Nhấn Ctrl + Shift + C

Bước 4: Nhấp vào CSS code và chỉnh sửa tại tab Styles.

- Font: thay đổi kiểu chữ

- Font size: thay đổi cỡ chữ

- Color: thay đổi màu chữ.

Sau đó copy đoạn CSS code

Bước 5: Tại dashboard trên wordpress, tìm chọn “Thêm CSS”

Dán CSS code vào phần tử muốn chỉnh sửa.

Bước 6: Nhấn “Publish” để xuất bản trang wordpress đã chỉnh sửa.

Xem thêm: Hướng dẫn tạo sitemap cho website wordpress

6. Lời kết

Bài viết trên là hướng dẫn chỉnh sửa giao diện wordpress chi tiết. Chỉ qua vài thao tác cơ bản, bạn có thể dễ dàng tạo ra một giao diện web ưng ý. Chúc bạn thực hiện thành công.

Nhân Hòa chuyên cung cấp dịch vụ tên miền, hosting wordpress, thiết kế website. Mọi nhu cầu sử dụng dịch vụ xin liên hệ.