Cách thêm ảnh nền Header trong WordPress

Betheme cho phép đặt ảnh nền cho cả 2. tiêu đề và tiêu đề phụ. Như thể vẫn chưa đủ, bạn có thể đặt chúng riêng lẻ cho các trang cụ thể hoặc giống nhau cho tất cả

Để đặt cùng một nền tiêu đề cho tất cả các trang, vui lòng vào Betheme > Theme Options > Header & Subheader > Header > Background section. Tại đây, bạn có thể tải lên hình nền tùy chỉnh, đặt vị trí hoặc kích thước của nó. Nếu bạn muốn có các hình nền tiêu đề riêng lẻ, bạn có thể đặt chúng bằng tùy chọn Hình ảnh nổi bật nằm ở phía bên tay phải, trong khi chỉnh sửa hoặc tạo trang

Với tất cả các chi tiết tinh chỉnh và cụ thể mà bạn có thể thêm vào trang web của mình bằng Trình tạo chủ đề Divi, một số ít có thể có tác động cao/nỗ lực thấp như thêm hình nền vào tiêu đề Divi của bạn. Sử dụng trình tạo chủ đề, bạn có thể thêm phần khởi sắc này với rất ít phiền phức và tạo trải nghiệm trực quan cho khách truy cập, giúp bạn và thương hiệu của bạn nổi bật so với đối thủ. Chúng tôi sẽ hướng dẫn bạn các bước để thêm hình nền vào tiêu đề Divi của bạn, vì vậy hãy bắt tay vào thực hiện

Cách thêm hình nền vào tiêu đề Divi của bạn

Để đạt được hiệu ứng này, chúng tôi sẽ sử dụng Trình tạo chủ đề Divi. Bạn có thể tìm thấy điều này trong bảng điều khiển WordPress của mình trong Divi – Trình tạo chủ đề

Ngoài ra, chúng tôi sẽ sử dụng tiêu đề tạo sẵn miễn phí cho gói bố cục Khoa học dữ liệu cho hướng dẫn này. Bạn có thể tải xuống tệp JSON từ chính bài đăng hoặc sử dụng mẫu tiêu đề trong trình tạo chủ đề mà bạn đã thiết kế và tạo. Tuỳ bạn

Tải lên tiêu đề

Nếu bạn đang sử dụng tiêu đề chưa có trong Trình tạo chủ đề Divi, bạn sẽ muốn tìm biểu tượng mũi tên kép ở phía trên bên phải của bảng điều khiển. Nhấp vào nó để hiển thị các tùy chọn Tính di động

Chuyển đến tab Nhập, tìm tệp JSON cho mẫu tiêu đề, sau đó nhấp vào nút Nhập mẫu Trình tạo chủ đề Divi màu xanh lam ở dưới cùng

Chỉnh sửa bố cục tiêu đề

Sau đó, bạn sẽ muốn nhập chính trình tạo Divi để bố trí. Chúng tôi sẽ sử dụng tiêu đề này làm Tiêu đề chung cho trang web, nhưng bạn có thể đang làm điều này với bất kỳ tiêu đề nào mà bạn đã chỉ định cho một mẫu. Hoặc là tốt. Bạn có thể nhấp đúp vào phần bố cục hoặc nhấp chuột phải và chọn Chỉnh sửa từ menu ngữ cảnh để vào trình tạo

Bạn sẽ thấy một màn hình tương tự như hình ảnh bên dưới khi mọi thứ tải lên

Chọn vị trí nền

Với hầu hết các tiêu đề, bạn sẽ có nhiều phần, hàng và cột. Bất kỳ và/hoặc tất cả những thứ này đều có thể có hình nền kèm theo, nhưng nói chung, nên giới hạn ở mức 1. Điều đó không chỉ giữ cho thiết kế của bạn sạch sẽ hơn mà còn giúp thời gian tải trang của bạn thấp hơn

Với gói bố cục này, chúng tôi sẽ thêm một thiết kế nền vào cột bên trái trong phần thứ hai của bố cục tiêu đề, nơi bắt đầu chỉ có một màu đen đặc

Nhập Cài đặt của Vị trí

Khi bạn đã quyết định nơi bạn muốn có hình nền trong tiêu đề, hãy vào phần cài đặt. Vì chúng tôi đang thêm nó vào một cột, trước tiên chúng tôi phải tìm cài đặt Hàng có chứa

Trong tab Nội dung, bạn sẽ tìm thấy danh sách tất cả các cột trong hàng. Đây là thứ tự giảm dần, nghĩa là cột trên cùng là cột ngoài cùng bên trái, v.v.

Tìm các tùy chọn nền

Sau khi ở trong phần cài đặt của cột, bạn sẽ cuộn xuống cho đến khi tìm thấy Tùy chọn nền

Dưới tiêu đề đó, bạn sẽ thấy bốn tab khác nhau. Chúng dành cho, từ trái sang phải, thêm một màu nền, thêm nền chuyển màu, thêm hình nền và thêm video nền. Nhấp vào tab thứ ba để thêm hình nền

Chọn một hình ảnh tĩnh hoặc động

Trình tạo chủ đề Divi cho bạn lựa chọn cài đặt hình nền tĩnh hoặc động cho bất kỳ mô-đun hoặc phần nào. Để sử dụng hình ảnh tĩnh (hình ảnh không thay đổi dựa trên các tiêu chí nhất định), hãy nhấp vào nút Thêm hình nền mới ở giữa phần

Để sử dụng hình ảnh động, hãy nhấp vào biểu tượng vòng tròn xếp chồng lên nhau ở phía trên bên phải của trường

Việc chọn sử dụng hình nền động sẽ rất tốt nếu bạn đang thực hiện các chỉnh sửa này trên tiêu đề chung (hoặc tiêu đề được sử dụng ở nhiều vị trí trên trang web của bạn). Bằng cách đó, bạn có thể đặt nội dung hiển thị cho người dùng dựa trên bất kỳ trang nào họ xem. Bạn có thể chọn từ các tùy chọn như Ảnh nổi bật của bài đăng/trang hoặc Ảnh hồ sơ của tác giả. Bạn thậm chí có thể yêu cầu nó kéo logo trang web hoặc từ bất kỳ trường tùy chỉnh nào mà bạn đã đặt ở bất kỳ đâu trên trang web

Tuy nhiên, đối với bài viết này, chúng ta sẽ chọn một hình nền tĩnh cho tiêu đề theo cách truyền thống hơn bằng cách nhấp vào nút Thêm hình nền. Điều này sẽ đảm bảo rằng mọi phiên bản của tiêu đề chung này đều có cùng một hình nền

Chọn hình nền của bạn

Nhấp vào nút Thêm hình nền sẽ hiển thị thư viện phương tiện của bạn. Bạn có thể tải lên tệp mới cho nền hoặc bạn có thể chọn từ các mục hiện có trên trang web của mình. Sẽ không thay đổi kết quả

Điều chỉnh hình nền

Nếu bạn muốn sử dụng hình ảnh chưa chỉnh sửa, bước này là tùy chọn. Tuy nhiên, bạn có thể thêm các hiệu ứng như Parallax Scrolling và pha trộn hình ảnh. Bạn thậm chí có thể đặt vị trí bạn muốn hình ảnh được định vị liên quan đến cột để hình ảnh sẽ tập trung vào các khu vực khác nhau thay vì đặt mặc định ở giữa

Một lần nữa, đây là những tùy chọn, nhưng có thể giúp làm cho hình nền hợp nhất với thiết kế xung quanh bằng cách Divi có thể làm tối nó chỉ một chút, chẳng hạn

Lưu công việc của bạn

Tiếp theo, đảm bảo rằng bạn lưu tất cả công việc của mình. Bạn sẽ muốn nhấp vào dấu kiểm màu xanh lá cây trong cài đặt cột và cài đặt hàng. Sau đó, nút lưu màu xanh lục ở phía dưới bên phải của trang. Sau đó, bạn có thể an toàn X ra khỏi trình tạo để quay lại trang tổng quan

Chúng tôi cũng muốn lưu ý rằng Trình tạo chủ đề Divi của bạn sẽ hiển thị Tất cả thay đổi đã lưu ở phía trên bên trái. Nếu nút có nội dung Lưu thay đổi, thì hình nền của bạn trong tiêu đề không hoạt động

Chúng tôi muốn lưu ý điều này một cách cụ thể vì có rất nhiều nơi để lưu trong trình tạo chủ đề và chúng tôi không muốn bạn bỏ lỡ nơi thúc đẩy các thiết kế mới hoạt động

kết thúc

Thêm hình nền vào tiêu đề Divi của bạn là một trong những cách dễ dàng nhất để mang lại sức sống cho bất kỳ thiết kế nào bằng cách sử dụng hình ảnh tĩnh hoặc thậm chí thông qua tính năng nội dung động của chúng tôi. Cho dù bạn sử dụng một trong những thiết kế miễn phí, được tạo sẵn của chúng tôi hay thêm vào thiết kế của riêng bạn, bạn có thể lấy một thiết kế đơn giản và làm cho nó trở nên cao cấp và bắt mắt hơn bằng cách thêm một hình ảnh vào tiêu đề của bạn chỉ với một vài cú nhấp chuột