Elementor: Cách tạo trang tùy chỉnh cho WooCommerce

Elementor: Cách tạo trang tùy chỉnh cho WooCommerce

Bạn có muốn tìm hiểu cách tạo trang tùy chỉnh cho cửa hàng WooCommerce với Elementor không?

Như bạn có thể biết, Elementor Pro đi kèm với tính năng xây dựng WooCommerce cho phép bạn xây dựng một trang web Thương mại điện tử tùy chỉnh với WooCommerce mà không cần viết mã. Tính năng này cho phép bạn tạo các trang WooCommerce tùy chỉnh bằng cách sử dụng trình chỉnh sửa trực quan của Elementor, cung cấp giao diện trực quan.

Xem thêm: Cách cài đặt Elementor trên WordPress

Tại thời điểm viết bài này, bạn có thể tạo các trang tùy chỉnh cho trang cửa hàng, trang sản phẩm và các trang lưu trữ sản phẩm (thẻ và danh mục). Ngay sau đó, bạn cũng sẽ có thể tạo các trang tùy chỉnh cho trang thanh toán và trang giỏ hàng.

Trong bài viết này, chúng tôi sẽ hướng dẫn bạn cách tạo trang cửa hàng WooCommerce tùy chỉnh bằng cách sử dụng tính năng trình tạo WooCommerce của Elementor Pro.

Bản thân trang cửa hàng là một trong những trang mặc định trong WooCommerce. Trang này hoạt động như một nơi trưng bày để trưng bày các sản phẩm của bạn. Bạn có thể truy cập trang này bằng cách đi tới yourite.com/store. Theo mặc định, trang cửa hàng WooCommerce chỉ hiển thị các sản phẩm WooCommerce.

Bằng cách tạo trang cửa hàng tùy chỉnh bằng Elementor Pro, bạn có thể thêm các yếu tố để làm cho mặt tiền cửa hàng của mình hấp dẫn hơn.

Cách tạo trang tùy chỉnh của cửa hàng WooCommerce với Elementor

Có ít nhất hai tiện ích Elementor mà bạn có thể sử dụng để tạo trang tùy chỉnh của cửa hàng WooCommerce: Lưu trữ sản phẩmCác sản phẩm.

Trong ví dụ này, chúng tôi sử dụng cái sau.

Chức năng của widget Sản phẩm khá giống với tiện ích con Bài viết. Sự khác biệt là tiện ích Sản phẩm được sử dụng để hiển thị các sản phẩm WooCommerce trong khi tiện ích Bài đăng được sử dụng để hiển thị các bài đăng trên blog.

Đọc cũng: Cách nhập hoặc xuất mô hình trong Elementor

Xin lưu ý rằng bạn chỉ có thể tìm thấy tiện ích Sản phẩm khi plugin WooCommerce được cài đặt và kích hoạt.

Để bắt đầu tạo trang cửa hàng WooCommerce tùy chỉnh bằng Elementor Pro, hãy truy cập đầu tiên à Mẫu -> Trình tạo Chủ đề trên bảng điều khiển WordPress của bạn. Bấm vào tab Sản phẩm lưu trữ của trang Trình tạo chủ đề, sau đó nhấp vào nút thêm vào MỘT SẢN PHẨM SẮP XẾP.

Đặt tên cho mô hình của bạn và nhấp vào nút TẠO MÔ HÌNH.

cách tạo trang tùy chỉnh cho cửa hàng WooCommerce với ElementorCó ba mẫu trang cửa hàng tùy chỉnh mà bạn có thể chọn trong trường hợp bạn muốn tạo trang cửa hàng tùy chỉnh từ một mẫu. Nếu bạn muốn xây dựng trang cửa hàng tùy chỉnh từ đầu, bạn chỉ cần đóng thư viện mẫu.

Xem thêm: Cách sử dụng Trình lấy mẫu màu trong Elementor

Trong ví dụ này, chúng tôi sẽ tạo trang cửa hàng tùy chỉnh từ đầu. Như đã đề cập ở trên, chúng tôi sẽ sử dụng tiện ích Sản phẩm để hiển thị các sản phẩm.

Trước khi thêm tiện ích Sản phẩm vào hộp chỉnh sửa, bạn có thể xác định bố cục bằng cách thêm các phần và cột. Khi bố cục đã sẵn sàng, bạn chỉ cần kéo tiện ích Sản phẩm vào hộp chỉnh sửa.

Như bạn có thể thấy, tiện ích Sản phẩm tự động tải và hiển thị các sản phẩm WooCommerce mới nhất. Bạn có thể sửa đổi truy vấn bằng cách mở khối Truy vấn dưới tab Nội dung từ bảng cài đặt. Có năm tùy chọn để lựa chọn:

  • Truy vấn hiện tại - Truy vấn hiện tại
  • Sản phẩm mới nhất - Sản phẩm mới nhất
  • Bán - Giảm giá
  • Nổi bật - Nổi bật
  • Lựa chọn thủ công - Lựa chọn thủ công

Bạn cũng có thể đặt thứ tự các sản phẩm được hiển thị hoặc loại trừ một số

cách tạo trang tùy chỉnh cho cửa hàng WooCommerce với Elementor

Để đặt số cột và hàng, bạn có thể mở khối Nội dung dưới tab Nội dung. Từ khối này, bạn cũng có thể kích hoạt sự đánh số trang.

Bạn có thể thử với bảng cài đặt cho đến khi có được cài đặt tốt nhất cho tiện ích Sản phẩm. Sau khi hoàn tất với tiện ích Sản phẩm, bạn có thể thêm các tiện ích khác vào trang của mình.

Đọc cũng: Cách sử dụng công cụ chọn màu trong Elementor

Sau khi hoàn tất việc chỉnh sửa trang, bạn có thể nhấp vào nút PUBLISH ở cuối bảng cài đặt.

Thêm điều kiện hiển thị bằng cách nhấp vào nút thêm một điều kiện. Vì bạn muốn tạo trang cửa hàng tùy chỉnh, hãy chọn tùy chọn SHOP Page. Nhấp vào nút LƯU & ĐÓNG để lưu thay đổi.

cách tạo trang tùy chỉnh cho cửa hàng WooCommerce với Elementor

Cho đến nay, bạn đã tạo thành công trang cửa hàng WooCommerce tùy chỉnh bằng Elementor Pro. Bạn có thể đi tại site.com/store của bạn để kiểm tra kết quả.

Tùy chỉnh tiện ích Sản phẩm

Trước khi xuất bản trang của mình, bạn có thể tùy chỉnh tiện ích Sản phẩm để làm cho trang hấp dẫn hơn. Để làm như vậy, hãy nhấp vào tiện ích trong hộp chỉnh sửa và điều hướng đến tab Phong cách từ bảng cài đặt. Có bốn khối bạn có thể mở như sau:

  • Sản phẩm

Bạn có thể mở khối này để xác định khoảng cách giữa các cột và hàng. Từ khối này bạn cũng có thể thiết lập kiểu chữ (họ phông chữ, cỡ chữ, v.v.) cũng như màu chữ của các yếu tố sản phẩm như tiêu đề sản phẩm, giá sản phẩm, xếp hạng của sản phẩm, v.v…. Bạn cũng có thể đặt đường viền của hình ảnh sản phẩm,

  • Hộp

Trong ngữ cảnh này, Box dùng để chỉ hộp đựng của mỗi sản phẩm. Bạn có thể mở khối Hộp để xác định chiều rộng đường viền của vùng chứa, bán kính đường viền, bóng của chiếc hộp, màu nền, màu đường viền, v.v.

  • Sự đánh số trang

Nếu bạn kích hoạt tùy chọn Sự đánh số trang từ khối Nội dung, bạn có thể mở khối Sự đánh số trang dưới tab Phong cách để tùy chỉnh phân trang. Bạn có thể đặt những thứ như khoảng cách, màu đường viền, màu nền, v.v.

Bạn cũng có thể xác định các tham số khác nhau trên mỗi trạng thái (bình thường, trỏ và hoạt động).

  • Giảm giá chớp nhoáng

Khi bạn thêm một sản phẩm mới trong WooCommerce, bạn có thể đặt thuộc tính giá ưu đãi để cho khách truy cập biết rằng sản phẩm được liên kết được giảm giá. Để nhấn mạnh điều này, bạn có thể hiển thị thuộc tính giảm giá trên trang cửa hàng để các sản phẩm giảm giá có huy hiệu giảm giá.

Bạn có thể mở khối Giảm giá chớp nhoáng để cá nhân hóa huy hiệu bán hàng. Bạn có thể xác định các yếu tố như màu văn bản, màu nền, kiểu chữ, bán kính đường viền, kích thước (chiều rộng và chiều cao), khoảng cách, v.v.….

Cuối cùng

WooCommerce Builder là một trong những tính năng được cung cấp bởi Elementor Pro. Nó cho phép bạn xây dựng một trang web Thương mại điện tử được cá nhân hóa và duy nhất với WooCommerce và không cần mã hóa. Không cần cài đặt chủ đề WordPress được thiết kế cho WooCommerce. Thay vào đó, bạn có thể tự tạo các trang WooCommerce tùy chỉnh bằng trình chỉnh sửa trực quan của Elementor.

Đọc cũng: Cách thêm dải phân cách để tạo phần trong Elementor

Cho đến phiên bản 3.2.2, Elementor Pro chỉ cho phép bạn tạo Trang cửa hàng tùy chỉnh, Trang sản phẩm đơn tùy chỉnh và Trang lưu trữ sản phẩm tùy chỉnh. Nhưng Elementor đã thông báo rằng trên phiên bản tiếp theo của Elementor Pro, bạn cũng sẽ có thể tạo trang giỏ hàng tùy chỉnh, trang thanh toán tùy chỉnh và trang tài khoản khách hàng tùy chỉnh.

Tải xuống Elementor Pro ngay!

Kết luận

Đây là ! Đó là vì bài viết này hướng dẫn bạn cách tạo trang tùy chỉnh cho cửa hàng WooCommerce với Elementor. Nếu bạn có bất kỳ mối quan tâm nào về cách đến đó fcho chúng tôi biết trong ý kiến.

Tuy nhiên, bạn cũng có thể tham khảo ý kiến tài nguyên của chúng tôi, nếu bạn cần thêm các yếu tố để thực hiện các dự án tạo trang Internet của mình, bằng cách tham khảo hướng dẫn của chúng tôi về Tạo blog WordPress hoặc một ngày Divi: chủ đề WordPress tốt nhất mọi thời đại.

Nhưng trong lúc này, chia sẻ bài viết này trên các mạng xã hội khác nhau của bạn.

...

Elementor Pro: 10 tính năng tuyệt vời để mở khóa - Phần II

Elementor Pro: 10 tính năng tuyệt vời để mở khóa - Phần II

Trong một trong những bài viết trước của chúng tôi, chúng tôi đã trình bày 10 tính năng hàng đầu của Elementor mà bạn sẽ mở khóa khi nâng cấp lên Elementor Pro

Bài viết này giới thiệu cho bạn 10 tính năng tuyệt vời khác sẽ cải thiện năng suất của bạn.

1. Hơn 300 mô hình sẵn sàng sử dụng

Trong Elementor, bạn có hai tùy chọn để tạo một trang hoặc một mẫu. Trước hết, bạn có thể xây dựng trang của mình từ đầu bằng cách sử dụng ý tưởng thiết kế của riêng bạn. Thứ hai, bạn có thể tạo trang của mình từ một mẫu tạo sẵn do Elementor cung cấp.

Nếu bạn đang sử dụng Elementor Pro, bạn sẽ có quyền truy cập vào tất cả các mẫu tạo sẵn có sẵn trong thư viện mẫu, bao gồm cả những mẫu có nhãn "PRO". Bản thân Elementor có tổng cộng hơn 300 mẫu làm sẵn. Bạn có thể nhấp vào biểu tượng thư mục trong khu vực trình chỉnh sửa Elementor để mở thư viện mẫu.

Elementor Pro

2. Bộ dụng cụ mô hình

En Tháng 2019 năm XNUMX, Elementor đã phát hành phiên bản đầu tiên của bộ mẫu hàng tháng. Bộ mẫu là gì?

Bộ mẫu Elementor là một bộ sưu tập các mẫu Elementor được thiết kế đặc biệt cho một loại trang web nhất định. Tất cả các mô hình trong một bộ mô hình có cùng một ý tưởng thiết kế. Kiểu chữ, màu sắc, v.v. Bộ mẫu cho phép bạn xây dựng một trang web nhanh hơn.

3. Hoàn thành trình chỉnh sửa trang web

Khái niệm chỉnh sửa toàn bộ trang web cho phép bạn chỉnh sửa hai hoặc nhiều phần tử của trang web từ một nơi. Trong ngữ cảnh của Elementor, bạn có thể chỉnh sửa chân trang, đầu trang và một mẫu, chẳng hạn như một mẫu bài đăng hoặc một mẫu trang danh mục, tất cả từ một nơi.

Giả sử bạn đang chỉnh sửa mẫu bài đăng tùy chỉnh duy nhất cho trang web của mình và muốn thực hiện một số thay đổi tiêu đề tùy chỉnh. Trong trường hợp này, bạn không cần phải đóng trình soạn thảo Elementor để thực hiện các thay đổi đối với tiêu đề.

Bạn chỉ cần di chuột qua đầu trang (hoặc chân trang) và nhấp vào nút điều khiển màu vàng. Tương tự như vậy, khi bạn chỉnh sửa tiêu đề tùy chỉnh và muốn thực hiện thay đổi đối với mẫu bài đăng đơn tùy chỉnh, bạn chỉ cần di chuột qua mẫu bài đăng duy nhất và nhấp vào nút điều khiển màu vàng.

4. Widget toàn cầu

Global Widget là một tính năng Elementor Pro dành riêng cho việc hợp lý hóa quy trình làm việc của bạn. Ngoài ra, chức năng giúp bạn có một thiết kế nhất quán trên một số yếu tố như nút hoặc biểu mẫu.

Đọc hướng dẫn của chúng tôi trên Cách sử dụng màu toàn cục trong Elementor

Giả sử bạn đang tạo một trang web bao gồm một số trang. Trên một số trang bạn muốn thêm một nút. Trong trường hợp này, bạn có thể xác định một widget nút chung. Sau đó, bạn có thể sử dụng tiện ích nút chung được xác định trên mọi trang bạn tạo, thay vì thêm tiện ích nút mới và tạo kiểu cho nó ngay từ đầu. Điều này sẽ giúp bạn tiết kiệm rất nhiều thời gian trong việc thiết lập và chạy dự án của mình.

Khi bạn thực hiện thay đổi trên một tiện ích con toàn cầu, thay đổi sẽ được áp dụng cho tất cả các trang mà tiện ích con toàn cầu được liên kết được thêm vào.

5. Liên kết hành động

Khi bạn tạo trang đích bằng Elementor, bạn có thể thêm một hành động nhất định. Ví dụ: bạn có thể muốn khách truy cập liên hệ với bạn qua WhatsApp hoặc email. Elementor Pro cho phép bạn thêm một hành động nhất định vào một nút hoặc liên kết. Bạn có thể sử dụng tính năng này để thêm nút WhatsApp, nút email, v.v. vào trang đích của mình.

Khám phá hướng dẫn của chúng tôi về Cách thêm nút Skype trong Elementor

Dưới đây là các hành động bạn có thể xác định:

  • Gửi e-mail
  • Liên hệ qua WhatsApp
  • Gửi tin nhắn văn bản (SMS)
  • Thực hiện cuộc gọi
  • Bắt đầu cuộc trò chuyện Skype
  • Bắt đầu cuộc trò chuyện trên Messenger
  • Bắt đầu trò chuyện Viber
  • Thêm sự kiện vào Lịch Google
  • Thêm sự kiện vào lịch Outlook
  • Thêm sự kiện vào lịch Yahoo

Để xác định một hành động nhất định, bạn có thể nhấp vào biểu tượng động trong trường liên kết và chọn URL liên hệ. Sau đó, bạn có thể nhấp vào biểu tượng cờ lê để chọn hành động bạn muốn đặt.Elementor Pro

6. Phông chữ tùy chỉnh

Elementor đã có bộ sưu tập phông chữ phong phú, nhưng nếu bạn muốn nhiều hơn, bạn có thể cài đặt bất kỳ họ phông chữ nào bạn muốn. Phiên bản Elementor pro cho phép bạn thêm các phông chữ mới ở các định dạng sau:

  • WOFF
  • WOFF2
  • TTF
  • SVG
  • EOT

Bạn cũng có thể tích hợp Elementor của bạn với Phông chữ Adobe nếu bạn đang sử dụng phông chữ Adobe.

7. Biểu tượng tùy chỉnh

Elementor có một thư viện biểu tượng phong phú để bạn thêm các biểu tượng vào trang của mình. Bản thân Elementor sử dụng nhà cung cấp bên thứ ba để cung cấp các bộ sưu tập biểu tượng (trong trường hợp này là Font Awesome).

Lire aussi Cách sử dụng phông chữ Adobe trong Elementor

Nếu bạn muốn sử dụng các biểu tượng của riêng mình, Elementor Pro cho phép bạn làm điều đó. Bạn có thể tải xuống một tập hợp các biểu tượng và Elementor sẽ cung cấp chúng trong thư viện biểu tượng. Bạn có thể đi đến Elementor -> Biểu tượng tùy chỉnh để thêm các biểu tượng tùy chỉnh trong Elementor.

8. Màu sắc động

Elementor Pro cho phép bạn thêm nội dung động vào WordPress của mình. Ngoài các trường tùy chỉnh và nội dung động mặc định của WordPress, bạn cũng có thể thêm màu động. Sử dụng tính năng này, bạn có thể (tất nhiên là động) đặt các màu riêng biệt trên cùng một phần tử trên một mô hình nhất định.

Ví dụ: bạn có thể sử dụng tính năng này để đặt các màu tiêu đề bài đăng khác nhau cho trang web của mình. Màu tiêu đề bài đăng được đặt thông qua trường tùy chỉnh khi bạn viết một bài đăng mới.

9. Vai trò quản lý

Bạn có thể sử dụng Trình quản lý vai trò để kiểm soát ai có thể truy cập trình chỉnh sửa Elementor trên trang web WordPress của bạn. Tính năng này rất hữu ích nếu bạn có một trang web WordPress lớn với số lượng người dùng cao. Bạn có thể truy cập tính năng này bằng cách vào Elementor -> Người quản lý vai trò trong bảng điều khiển WordPress của bạn.

10. Mã tùy chỉnh

Trước phiên bản Elementor Pro 3.1.1, bạn phải thêm tiện ích HTML vào đầu trang / chân trang tùy chỉnh của mình để cài đặt Google Analytics trên trang web cung cấp Elementor của bạn. Nhưng giờ đây bạn có thể cài đặt Google Analytics mà không cần thay đổi đầu trang hoặc chân trang nhờ tính năng Mã tùy chỉnh.

Bên cạnh việc cài đặt Google Analytics, bạn cũng có thể sử dụng tính năng cài đặt các công cụ phân tích khác như Facebook Pixel.

Cuối cùng

Trong nhiều trường hợp, nâng cấp lên Elementor Pro không chỉ cho phép bạn mở khóa các tính năng chuyên nghiệp mà còn tiết lộ các tính năng WordPress mà bạn có thể chưa từng nghe đến, chẳng hạn như các trường tùy chỉnh và loại ấn phẩm được cá nhân hóa.

Elementor cung cấp các gói chuyên nghiệp mà bạn có thể sử dụng tùy theo nhu cầu của mình. Ví dụ: để sử dụng cá nhân, bạn có thể sử dụng gói THIẾT YẾU. Hoặc nếu bạn làm việc cho một cơ quan, bạn có thể sử dụng gói ĐẠI LÝ.

Tải xuống Elementor Pro ngay!

Kết luận

Đây ! Đó là nó cho bài viết này giới thiệu cho bạn 10 tính năng khác mà bạn sẽ mở khóa nếu bạn nâng cấp lên phiên bản Pro của Elementor. Nếu bạn có bất kỳ mối quan tâm nào về cách đến đó fcho chúng tôi biết trong ý kiến.

Tuy nhiên, bạn cũng có thể tham khảo ý kiến tài nguyên của chúng tôi, nếu bạn cần thêm các yếu tố để thực hiện các dự án tạo trang Internet của mình, bằng cách tham khảo hướng dẫn của chúng tôi về Tạo blog WordPress hoặc một ngày Divi: chủ đề WordPress tốt nhất mọi thời đại.

Nhưng trong lúc này, chia sẻ bài viết này trên các mạng xã hội khác nhau của bạn.

Elementor Pro: 10 tính năng tuyệt vời để mở khóa - Phần I

Elementor Pro: 10 tính năng tuyệt vời để mở khóa - Phần I

Bạn có muốn biết các tính năng tốt nhất để sử dụng thành thạo trên Elementor Pro không?

Tất cả người dùng WordPress đều đã biết đến nó. Elementor là một trong những trình tạo trang phổ biến nhất. Là một plugin miễn phí, bạn có thể tận hưởng trải nghiệm tạo một trang đẹp theo cách trực quan bằng Elementor với tùy chọn nâng cấp lên phiên bản chuyên nghiệp để mở khóa các tính năng nâng cao hơn.

Đọc hướng dẫn của chúng tôi về: Cách cài đặt Elementor trên WordPress

Thực tế có hai cách để mở rộng chức năng Elementor. Bên cạnh việc nâng cấp lên phiên bản chuyên nghiệp, bạn cũng có thể cài đặt các tiện ích bổ sung của bên thứ ba được phát triển bởi các nhà phát triển nổi tiếng như weDevs, WPDeveloper, đến Crocoblock. Nếu bạn muốn nâng cấp lên Elementor Pro thay thế và vẫn băn khoăn không biết mình có thể mở khóa những tính năng nào, thì đây là danh sách.

20 tính năng hàng đầu của Elementor Pro

1. Trình tạo chủ đề

WordPress được viết bằng PHP. Điều đó nói rằng, để tạo một plugin hoặc chủ đề WordPress, bạn cũng cần phải thành thạo PHP và các ngôn ngữ hỗ trợ như JavaScript. Nhưng đó là trước đây. Ngày nay, bạn có thể tạo chủ đề WordPress của riêng mình mà không cần mã hóa nhờ tính năng trình tạo chủ đề được cung cấp bởi một số plugin trình tạo trang như Elementor.

Trình tạo chủ đề là gì?

Để hiểu khái niệm về trình tạo chủ đề, trước tiên bạn cần hiểu các thành phần của chủ đề WordPress. Một chủ đề WordPress bao gồm các tệp mẫu. Mỗi tệp mẫu kiểm soát bố cục của một phần của chủ đề. Ví dụ, tệp header.php kiểm soát bố cục của tiêu đề của chủ đề, trong khi tệp footer.php kiểm soát bố cục của chân trang của chủ đề. Hầu hết các chủ đề WordPress có các tệp mẫu sau:

  • header.php: Để kiểm soát bố cục của tiêu đề.
  • footer.php: Để kiểm soát bố cục của footer.
  • single.php: Để kiểm soát bố cục của một bài viết (bài đăng trên blog).
  • sidebar.php: Để kiểm soát bố cục của thanh bên.
  • archive.php: Để kiểm soát bố cục của các trang lưu trữ.
  • page.php: Để kiểm soát bố cục của trang.

Trình tạo chủ đề cho phép bạn tạo các mẫu tùy chỉnh để thay thế các mẫu ở trên, cũng như các mẫu khác thuộc về một chủ đề. Bạn có thể tạo mẫu tùy chỉnh bằng cách sử dụng trình chỉnh sửa trực quan của trình tạo trang mà bạn đang sử dụng (Elementor trong trường hợp này).

elementor-pro-awesome-features-to-master

Một trong những lợi thế của việc sử dụng trình tạo chủ đề thay vì chủ đề là bạn có thể xác định nơi mẫu tùy chỉnh sẽ được áp dụng. Ví dụ: bạn có thể xác định một mẫu tiêu đề tùy chỉnh để áp dụng cho một bài đăng, trang nhất định, các bài đăng thuộc các danh mục nhất định, toàn bộ trang web, v.v.

Nói cách khác, bạn có thể có các bố cục khác nhau của một phần nhất định của chủ đề (ví dụ: tiêu đề) bằng cách tạo nhiều mẫu tùy chỉnh cho cùng một phần. Một lợi thế khác, bạn có các tùy chọn tùy chỉnh không giới hạn.

2. Trình tạo WooCommerce

Bạn có trang web Thương mại điện tử được hỗ trợ bởi WooCommerce không? Elementor Pro cũng có khả năng đưa thiết kế trang web Thương mại điện tử của bạn lên một tầm cao mới bằng cách cho phép bạn tạo các mẫu tùy chỉnh cho cửa hàng trực tuyến WooCommerce của mình. Không cần mua chủ đề WooCommerce.

Lire: Cách tạo trang tùy chỉnh của cửa hàng WooCommerce với Elementor

Thay vào đó, bạn có thể tự mình tùy chỉnh các phần của WooCommerce bằng trình chỉnh sửa trực quan của Elementor. Các phần WooCommerce mà bạn có thể tạo các mẫu tùy chỉnh là:

  • Trang sản phẩm đơn lẻ
  • Trang lưu trữ sản phẩm (danh mục và thẻ)
  • Trang cửa hàng

Bạn có các tiện ích con sau để tạo các mẫu tùy chỉnh cho WooCommerce:

Sản phẩm Đánh giá sản phẩm
WooCommerce Breadcrumbs Kho sản phẩm
Thêm vào giỏ hàng tùy chỉnh Meta sản phẩm
Trang thương mại Woo Mô tả ngắn
Danh mục sản phẩm Nội dung sản phẩm
Menu Giỏ hàng Các tab dữ liệu sản phẩm
Tiêu đề sản phẩm thông tin bổ sung
Hình ảnh sản phẩm Sản phẩm liên quan
Sản phẩm Giá Upsells
Thêm vào giỏ hàng

3. Trình tạo biểu mẫu

elementor-pro-awesome-features-to-master

Elementor Pro cung cấp cho bạn quyền truy cập vào tiện ích Biểu mẫu. Bạn có thể sử dụng tiện ích này để thêm biểu mẫu vào mẫu trình tạo trang / chủ đề mà bạn đang làm việc. Tiện ích này cho phép bạn tạo nhiều loại biểu mẫu khác nhau, nhờ hỗ trợ loại trường rộng rãi của nó. Dưới đây là các loại trường được hỗ trợ bởi tiện ích Biểu mẫu của Elementor:

bản văn Chấp thuận
E-mail Thành viên ẩn danh
Văn bản HTML
URL Mật khẩu
Điện thoại File Upload
Chọn Thời gian
Checkbox Ngày
radio Con số

Bạn có thể nhúng biểu mẫu của mình vào reCAPTCHA để bảo vệ nó khỏi những kẻ gửi thư rác. Với một mẹo nhỏ, bạn cũng có thể sử dụng tiện ích Biểu mẫu để tạo trang đăng ký trên trang web của bạn. Elementor cũng cho phép bạn tạo một biểu mẫu trong một số bước để cho phép bạn tạo một biểu mẫu dài được đơn giản hóa, cũng như cung cấp trải nghiệm người dùng tốt nhất cho người dùng của bạn.

Bản thân Elementor không có chức năng mặc định để xử lý việc gửi biểu mẫu. Tiện ích biểu mẫu của Elementor hỗ trợ tích hợp với các dịch vụ phổ biến GetResponse, ActiveCampaign, ConvertKit, Discord, v.v.

4. Trình tạo cửa sổ bật lên

Trình tạo cửa sổ bật lên là một trong những tính năng mà bạn có thể mở khóa sau khi nâng cấp lên Elementor Pro. Tính năng này cho phép bạn tạo các cửa sổ bật lên đẹp mắt trên trang web của mình mà không cần viết mã. Bạn thậm chí có thể sử dụng các mẫu biểu mẫu tạo sẵn được cung cấp để hợp lý hóa quy trình làm việc của mình.

Có hơn 100 mẫu cửa sổ bật lên tạo sẵn được cung cấp bởi Elementor.

elementor-pro-awesome-features-to-master

Bản thân trình tạo cửa sổ bật lên của Elementor hỗ trợ các loại trình kích hoạt sau:

  • Khi tải trang - Khi tải trang
  • Khi cuộn - Khi cuộn
  • Khi cuộn đến phần tử - Khi cuộn đến phần tử
  • Khi nhấp - Khi nhấp
  • Sau khi không hoạt động - Sau khi không hoạt động
  • Mục đích thoát trên trang - Mục đích thoát trên trang

Trình tạo cửa sổ bật lên của Elementor Pro cũng hỗ trợ các điều kiện hiển thị, cho phép bạn xác định vị trí cửa sổ bật lên sẽ xuất hiện. Nó cũng cho phép bạn hiển thị một cửa sổ bật lên dựa trên các điều kiện sau:

  • Sau x lần xem trang
  • Sau x phiên
  • Khi đến từ một url nhất định
  • Khi công cụ tìm kiếm đến
  • Chỉ hiển thị cửa sổ bật lên cho người dùng chưa đăng nhập
  • Hiển thị trên các loại thiết bị cụ thể (máy tính để bàn, máy tính bảng, điện thoại thông minh)
  • Hiển thị trong các trình duyệt web cụ thể

Với sự hỗ trợ của trình kích hoạt nhấp chuột, bạn cũng có thể sử dụng trình tạo cửa sổ bật lên để tạo cả hai menu toàn màn hình và một menu bên ngoài canvas.

5. Tích hợp của bên thứ ba

Như đã đề cập ở trên, bạn có thể sử dụng widget Biểu mẫu của Elementor để tạo một loạt các biểu mẫu nhờ sự hỗ trợ rộng rãi của nó cho các trường biểu mẫu. Một trong số chúng cho phép bạn sử dụng tiện ích Biểu mẫu để tạo biểu mẫu đăng ký email nhằm tạo khách hàng tiềm năng.

Bạn có thể kết nối biểu mẫu của mình với các dịch vụ tiếp thị qua email phổ biến như ActiveCampaign, GetResponse, v.v.

Dưới đây là các dịch vụ của bên thứ ba mà bạn có thể tích hợp biểu mẫu của mình:

  • GetResponse
  • ActiveCampaign
  • MailerLite
  • ConvertKit
  • MailPoet
  • Mailchimp
  • nhỏ giọt
  • Slack
  • Discord
  • HubSpot

Các tích hợp của bên thứ ba này đặc biệt hữu ích nếu bạn muốn sử dụng Elementor để tạo trang đích.

6. CSS tùy chỉnh

Đúng là Elementor cho phép bạn tạo các trang đẹp trên trang web WordPress của mình mà không cần phải xử lý CSS. Tuy nhiên, nếu bạn muốn tạo một trang web hoàn toàn độc đáo, bạn có thể sử dụng kỹ năng CSS của mình. Tính năng này cho phép bạn triển khai các tính năng CSS chưa có trên Elementor, chẳng hạn như CSS Transform để thêm hiệu ứng di chuột phong cách cho Elementor.

Đọc cũng: Cách nhập hoặc xuất mô hình trong Elementor

Bạn có thể thêm CSS tùy chỉnh vào từng phần tử Elementor. Cho dù đó là một phần, cột hay tiện ích con. Bạn có thể truy cập khối CSS tùy chỉnh dưới tab tiên tiến từ bảng cài đặt (bảng ở bên trái) trong trình chỉnh sửa Elementor để thêm CSS tùy chỉnh.

7. Hiệu ứng chuyển động

Elementor Pro đi kèm với các tùy chọn điều chỉnh để cho phép bạn áp dụng các hiệu ứng chuyển động cho một phần tử trên trang bạn đang làm việc. Bạn có thể sử dụng tính năng này để thêm hiệu ứng hoạt ảnh vào trang của mình mà không cần hiểu JavaScript.

Các hiệu ứng chuyển động do Elementor Pro cung cấp chia thành hai loại: hiệu ứng cuộn và hiệu ứng chuột. Bên cạnh đó, bạn cũng có thể áp dụng tùy chọn dính cho phần và widget.

8. Hơn 90 vật dụng

Như bạn đã biết, Elementor được phát hành dưới dạng một plugin freemium, có nghĩa là có một phiên bản miễn phí để bạn tận hưởng trải nghiệm người dùng Elementor mà không phải tốn một xu nào. Mặc dù Elementor Free cung cấp các widget cơ bản, nhưng phiên bản pro đi kèm với các widget nâng cao hơn như Biểu mẫu, Bài đăng, Đăng nhập, Bảng giá, v.v.

Dưới đây là các tiện ích bạn có thể mở khóa sau khi nâng cấp lên Elementor Pro.

bài viết Đếm ngược bài Trích
danh mục đầu tư Nút chia sẻ Hình ảnh nổi bật
Slides blockquote Hộp tác giả
Mẫu Nút Facebook Gửi bình luận
Đăng nhập Facebook Comments Điều hướng bài
Dòng tiêu đề động Nhúng Facebook Đăng thông tin
Giá biểu Trang Facebook Sản phẩm
Bảng giá Template WooCommerce Breadcrumbs
Hộp lật Logo trang web Thêm vào giỏ hàng tùy chỉnh
Kêu gọi hành động Tiêu đề trang web Trang thương mại Woo
Băng chuyền phương tiện Ngói trang Danh mục sản phẩm
Băng chuyền chứng thực Menu Nav Menu Giỏ hàng
Đánh giá Form tìm kiếm Lottie
Sơ đồ trang Tiêu đề bài viết Đánh dấu mã
Danh sách phát video Nút PayPal Hotspot

Tổng cộng có hơn 90 widget mà bạn có thể mở khóa (widget miễn phí và widget chuyên nghiệp)

9. Nội dung động

Bạn không chỉ có thể sử dụng Elementor để xây dựng các trang web tĩnh. Với hỗ trợ nội dung động, bạn cũng có thể sử dụng Elementor để xây dựng một trang web động như blog, cổng tin tức, trang web quảng cáo và các loại trang web động khác. Bạn có thể thêm nội dung động vào trang tạo mẫu hoặc chủ đề bằng cách sử dụng các tiện ích con sau:

  • Logo trang web
  • Tiêu đề trang web
  • Page Title
  • Tiêu đề bài viết
  • bài Trích
  • Hình ảnh nổi bật
  • Đăng thông tin
  • bài viết

10. Các trường tùy chỉnh

Các widget mà chúng tôi đã đề cập trong điểm 9 ở trên có thể được sử dụng để thêm nội dung động WordPress mặc định, chẳng hạn như tiêu đề bài đăng, meta bài đăng, hình ảnh nổi bật, v.v.

Điều gì về các trường tùy chỉnh? Elementor Pro cũng cho phép bạn thêm lĩnh vực tùy chỉnh. Bằng cách tối đa hóa chức năng này, bạn có thể sử dụng Elementor để xây dựng bất kỳ loại trang web nào với các plugin tối thiểu nhất có thể. Elementor Pro tương thích với các plugin trường tùy chỉnh phổ biến sau:

  • pods
  • Nâng cao Tuỳ chỉnh Fields
  • Bộ công cụ
  • Động cơ phản lực

Làm cách nào để tích hợp một plugin trường tùy chỉnh nhất định với Elementor?

Bạn có thể chỉ cần tạo nhóm trường tùy chỉnh bằng cách sử dụng plugin trường tùy chỉnh yêu thích của mình và sử dụng Elementor để hiển thị dữ liệu của các trường tùy chỉnh mà bạn đã tạo. Bạn có thể hiển thị các trường tùy chỉnh trên một mẫu. Bạn có thể đọc bài viết trước của chúng tôi để tìm hiểu cách thêm các trường tùy chỉnh trong Elementor.

Cuối cùng

Elementor là một công cụ tuyệt vời để xây dựng một trang web đẹp mà không cần xử lý bất kỳ mã nào. Cho dù đó là mã CSS, mã HTML, mã PHP hay mã JavaScript. Phiên bản miễn phí của Elementor rất tuyệt, nhưng để mở khóa tiềm năng của nó như một plugin trình tạo trang tốt nhất, bạn cần mở khóa tất cả các tính năng mà bạn có thể thực hiện bằng cách nâng cấp lên phiên bản chuyên nghiệp.

Ở đây kết thúc danh sách các tính năng đầu tiên mà bạn có thể mở khóa bằng Elementor Pro. Bạn sẽ khám phá những cái tiếp theo trong một bài viết khác.

Tải xuống Elementor Pro ngay!

Kết luận

Đây ! Đó là nó cho bài viết này giới thiệu cho bạn các tính năng tuyệt vời nhất để sử dụng thành thạo trên Elementor Pro. Nếu bạn có bất kỳ mối quan tâm nào về cách đến đó fcho chúng tôi biết trong ý kiến.

Tuy nhiên, bạn cũng có thể tham khảo ý kiến tài nguyên của chúng tôi, nếu bạn cần thêm các yếu tố để thực hiện các dự án tạo trang Internet của mình, bằng cách tham khảo hướng dẫn của chúng tôi về Tạo blog WordPress hoặc một ngày Divi: chủ đề WordPress tốt nhất mọi thời đại.

Nhưng trong lúc này, chia sẻ bài viết này trên các mạng xã hội khác nhau của bạn.

...

Elementor: Tạo nút tải xuống tệp PDF

Elementor: Tạo nút tải xuống tệp PDF

Bạn có muốn tạo nút tải xuống tệp PDF bằng Trình tạo trang phần tử không?

Khi tạo một trang Elementor trợ giúp (cho dù đó là trang chủ, trang đích, v.v.), bạn có thể thêm nút tải xuống, bằng cách đó, khi khách truy cập nhấp vào nút, tệp được tải xuống trực tiếp thay vì được dẫn đến tab trình duyệt web mới để xem tập tin.

Đọc cũng: Cách nhúng PDF vào Elementor mà không cần viết mã

Elementor có một Tiện ích nút mà bạn có thể sử dụng để tạo nút tải xuống tệp. Trong khi thêm tiện ích Nút, bạn có thể chỉ cần thêm liên kết tệp của mình vào bảng cài đặt.

Đọc cũng: Cách cài đặt Elementor trên WordPress

Tuy nhiên, cài đặt mặc định sẽ hướng khách truy cập của bạn đến một tab mới để xem tệp cho các định dạng tệp nhất định, bao gồm cả định dạng PDF và hình ảnh như JPG và PNG. Nếu bạn muốn tệp được tải xuống trực tiếp, bạn phải thêm thuộc tính tùy chỉnh vào liên kết tải xuống.

Tạo nút tải xuống tệp PDF trong Elementor

Đầu tiên, tải tệp PDF lên thư viện phương tiện WordPress. Để làm như vậy, hãy đăng nhập vào bảng điều khiển WordPress của bạn và điều hướng đến Phương tiện -> Thêm. Nhấp vào nút Chọn tệp tin để chọn tệp của bạn.

Sau khi tệp được tải lên, bạn sẽ thấy một nút Sao chép URL vào khay nhớ tạm để sao chép URL của tệp và một liên kết thay đổi để chỉnh sửa tệp.

Nhấp vào nút Sao chép URL vào khay nhớ tạm.

Bạn cũng có thể tìm thấy URL của tệp từ thư viện phương tiện WordPress (Phương tiện -> Thư viện phương tiện). Chỉ cần chọn tệp bạn muốn sử dụng và nhấp vào Sao chép URL vào tệp. bìa kẹp hồ sơ trong cửa sổ xuất hiện.

Khi URL được sao chép, hãy chuyển đến trình chỉnh sửa của Elementor và thêm tiện ích Nút. Dán URL bạn vừa sao chép vào trường Liên từ bảng cài đặt.

tạo nút tải xuống tệp PDF bằng Elementor

Để thêm thuộc tính tùy chỉnh, hãy nhấp vào biểu tượng bánh răng trong trường Liên. Bạn có thể nhập bất kỳ tên nào vào trường Thuộc tính tùy chỉnh.

Bạn có thể sử dụng định dạng sau: Télécharger|[nom fichier]. Ở nhà tôi sẽ có Télécharger|[Elementor

tạo nút tải xuống tệp PDF bằng Elementor

Nơi đây. Bạn có thể truy cập tab Phong cách để tùy chỉnh nút. Sau khi chỉnh sửa xong toàn bộ trang, bạn có thể cập nhật hoặc xuất bản trang của mình.

tạo nút tải xuống tệp PDF bằng Elementor

trong ngắn

Elementor có một tiện ích Nút mà bạn có thể sử dụng để thêm nút tải xuống tệp trên trang của mình. Bạn có thể thêm bất kỳ tệp nào được hỗ trợ bởi hệ thống WordPress, chẳng hạn như: PDF, ZIP, JPG, PNG, v.v.

Tuy nhiên, đối với các định dạng tệp như PDF, JPG và PNG, bạn cần thêm thuộc tính liên kết tùy chỉnh để tệp có thể tải xuống trực tiếp.

Nếu bạn sử dụng Elementor Pro, bạn cũng có thể sử dụng tiện ích Nút để tạo một nút có thể hành động, chẳng hạn như nút trò chuyện whatsapp, nút nhắn tin facebook, Vv ...

Kết luận

Nơi đây ! Đó là lý do để bài viết này hướng dẫn bạn Cách Tạo Nút Tải xuống Tệp PDF bằng Trình tạo Trang Phần tử. Nếu bạn thích bài viết này, đừng ngần ngại chia sẻ trên mạng xã hội yêu thích của bạn.

Tuy nhiên, bạn cũng sẽ có thể tham khảo ý kiến ​​của chúng tôi ressources, nếu bạn cần thêm các yếu tố để thực hiện các dự án tạo trang Internet của mình, bằng cách tham khảo hướng dẫn của chúng tôi về Tạo blog WordPress.

Hãy cho chúng tôi biết về bạn ý kiến và đề xuất trong phần dành riêng.

... 

Elementor Pro: Cách tạo một mẫu bài đăng duy nhất

Elementor Pro: Cách tạo một mẫu bài đăng duy nhất

Bạn có muốn tạo một mẫu bài đăng độc đáo với Elementor Pro không?

Khi bạn sử dụng một chủ đề WordPress cho trang web của mình, bạn sẽ nhận được một mẫu bài đăng duy nhất trên đó. Nó được tạo thành từ các yếu tố khác nhau: tiêu đề xuất bản, nội dung xuất bản, hình ảnh nổi bật, siêu dữ liệu, nhận xét, v.v.

với Elementor, bạn có thể kiểm soát bố cục và thiết kế của mẫu bài đăng độc đáo - trên bất kỳ chủ đề WordPress nào.

Trong bài viết này, chúng tôi sẽ hướng dẫn bạn cách thực hiện.

Nhưng trước tiên, hãy tìm hiểu: Cách cài đặt Elementor trên WordPress

Đi tới trang tổng quan của bạn và bên dưới Mô hình -> Thêm 

Cách tạo một mẫu bài đăng độc đáo với Elementor Pro

Từ danh sách thả xuống, hãy chọn Bài đăng đơn lẻ và đặt tên cho nó, sau đó nhấp vào Tạo một mẫu.

Chọn một mẫu bài đăng và nhấp vào Tôiđi vào.

Cách tạo một mẫu bài đăng độc đáo với Elementor Pro

Tuy nhiên, bạn cũng nên biết rằng nếu bạn muốn tạo một mẫu từ đầu, chỉ cần đóng cửa sổ bật lên và bắt đầu tạo mẫu bài đăng duy nhất của bạn.

Đọc cũng: Cách tạo trang tùy chỉnh của cửa hàng WooCommerce với Elementor

Nhấp vào biểu tượng bánh răng ở góc dưới bên trái của bảng tiện ích để chọn một bài đăng cụ thể làm bản xem trước mẫu trong khi chỉnh sửa.

Chỉnh sửa tất cả các yếu tố như bạn muốn. Khi thiết kế hoàn tất, hãy nhấp vào xuất bản và thiết lập các điều kiện hiển thị.

Cách tạo một mẫu bài đăng độc đáo với Elementor Pro

Chỉ các ấn phẩm sử dụng mẫu mặc định sẽ có mẫu bài đăng độc đáo sẽ được áp dụng cho chúng, ngay cả khi chúng đáp ứng các tiêu chí về điều kiện hiển thị. Các bài đăng sử dụng mẫu Canvas hoặc Toàn bộ chiều rộng (hoặc bất kỳ mẫu nào khác với Mặc định) sẽ không thấy mẫu Bài đăng duy nhất được áp dụng.

Tải xuống Elementor Pro ngay!

Kết luận

Đây ! Đó là nó cho bài viết này hướng dẫn bạn cách tạo một mẫu bài đăng độc đáo với Elementor Pro. Nếu bạn có bất kỳ mối quan tâm nào về cách đến đó fcho chúng tôi biết trong ý kiến.

Tuy nhiên, bạn cũng có thể tham khảo ý kiến tài nguyên của chúng tôi, nếu bạn cần thêm các yếu tố để thực hiện các dự án tạo trang Internet của mình, bằng cách tham khảo hướng dẫn của chúng tôi về Tạo blog WordPress hoặc một ngày Divi: chủ đề WordPress tốt nhất mọi thời đại.

Nhưng trong lúc này, chia sẻ bài viết này trên các mạng xã hội khác nhau của bạn.

Trình tạo chủ đề WordPress: Mọi thứ bạn cần biết

Trình tạo chủ đề WordPress: Mọi thứ bạn cần biết

Chủ đề là một trong những thành phần bắt buộc của WordPress. Đây là điều làm cho mọi trang web dựa trên WordPress trở nên độc đáo về hình thức. Chủ đề WordPress kiểm soát sự xuất hiện và hiển thị của một trang web WordPress thông qua các mẫu (tệp PHP) và trang định kiểu (tệp CSS).

Khám phá: Cách cài đặt Elementor trên WordPress

Nói cách khác, bạn cần phải thành thạo cả PHP và CSS để có thể tạo một chủ đề WordPress. Ngày nay, hầu hết các chủ đề WordPress hiện đại cũng sử dụng JavaScript. Điều này hiện cho phép bạn tạo chủ đề WordPress của riêng mình mà không cần mã hóa, nhưng sử dụng trình tạo chủ đề WordPress.

Trình tạo chủ đề là gì?

Đây là những gì chúng tôi sẽ đề cập trong bài viết này.

Trình tạo chủ đề hoặc Trình tạo chủ đề là một tính năng của plugin trình tạo trang. Tính năng này thường có sẵn trên phiên bản chuyên nghiệp của trình tạo trang. Một số ví dụ về các plugin trình tạo trang đi kèm với chức năng của trình tạo chủ đề là Elementor et Divi.

Lit Cách nhập hoặc xuất mô hình trong Elementor

Trình tạo chủ đề cho phép bạn tạo các mẫu tùy chỉnh để ghi đè các mẫu mặc định cho chủ đề WordPress của bạn. Không yêu cầu kỹ năng viết mã vì tất cả các plugin trình tạo trang đều đi kèm với trình chỉnh sửa trực quan, nơi mọi thứ được thực hiện bằng cách kéo và thả. Bạn chỉ cần một chút cảm giác thiết kế.

Sẽ tốt hơn nếu bạn có kiến ​​thức nền tảng về thiết kế.

Hiểu các phần của một chủ đề WordPress

Trước khi bạn bắt đầu sử dụng trình tạo chủ đề WordPress để tạo chủ đề WordPress của riêng mình, điều quan trọng là phải hiểu các phần của chủ đề WordPress. Nói chung, đây là các phần của một chủ đề WordPress:

  • cú đội đầu
  • Footer
  • Bố cục của một ấn phẩm duy nhất
  • Bố cục đơn
  • Trang lưu trữ
  • Trang kết quả tìm kiếm
  • trang 404

Nếu bạn đang sử dụng WooCommerce, bạn cũng có một trang sản phẩm, trang danh mục sản phẩm và trang lưu trữ sản phẩm. Sự xuất hiện của tất cả các phần này được xác định bằng cách sử dụng các mẫu và bảng định kiểu trên chủ đề bạn sử dụng.

Trình tạo chủ đề cho phép bạn tạo các mẫu tùy chỉnh để ghi đè các mẫu mặc định cho chủ đề WordPress của bạn.

Cách hoạt động của trình tạo trang

Bạn chỉ cần đọc nó. Trình tạo chủ đề cho phép bạn tạo các mẫu tùy chỉnh để ghi đè các mẫu mặc định của chủ đề của bạn. Bạn có thể tạo mẫu tùy chỉnh một cách trực quan bằng cách sử dụng trình chỉnh sửa của trình tạo trang mà bạn đang sử dụng.

Khám phá thêm: Elementor Pro: 10 tính năng tuyệt vời để mở khóa - Phần I

Một trong những lợi ích của việc sử dụng trình tạo chủ đề là bạn có thể gán một mẫu tùy chỉnh nhất định cho các trang hoặc bài đăng nhất định trên trang web WordPress của mình thông qua tính năng điều kiện hiển thị. Ví dụ: bạn có thể tạo mẫu bài đăng độc đáo tùy chỉnh và gán nó cho các bài đăng trong một danh mục nhất định để mẫu chỉ được áp dụng cho các bài đăng trong danh mục mà bạn đã chỉ định mẫu tùy chỉnh.

Điều này thật tuyệt vì bạn có thể tạo các mẫu khác nhau cho các loại bài đăng khác nhau.

Khả năng thiết lập các điều kiện hiển thị cũng cho phép bạn có nhiều mẫu đầu trang / chân trang trên một trang web duy nhất, điều này thật tuyệt vời vì nó mang lại cho bạn sự linh hoạt để chạy các chiến dịch khác nhau trên các trang khác nhau bằng cách sử dụng đầu trang / chân trang khác nhau.

Đọc cũng: Elementor Pro: 10 tính năng tuyệt vời để mở khóa - Phần II

Sự thật thú vị. Tất cả các phần của trang web này (đầu trang, chân trang, bố cục bài đăng đơn, trang 404, trang kết quả tìm kiếm, v.v.) cũng được tạo bằng cách sử dụng trình tạo chủ đề (Elementor).

Để các bạn có một hình ảnh minh họa rõ ràng hơn, chúng ta hãy xem hình ảnh sau đây.

Hình ảnh trên là tiêu đề mặc định cho một chủ đề WordPress có tên là Đại lý Thêm. Với trình tạo chủ đề WordPress, bạn có thể ghi đè tiêu đề mặc định ở trên bằng cách tạo mẫu tiêu đề tùy chỉnh. Đây là một ví dụ :

Hình ảnh trên là một ví dụ về mẫu tiêu đề tùy chỉnh được tạo bằng Elementor. Ngoài thiết kế tùy chỉnh, bạn cũng có thể áp dụng hành vi tiêu đề hấp dẫn hơn như hiệu ứng dính, tạo mặt nạ trong khi cuộn, v.v.

Plugin trình tạo trang có chức năng tạo chủ đề

Chúng tôi đã đề cập rằng trình tạo chủ đề là một tính năng của plugin trình tạo trang. Tuy nhiên, không phải tất cả các plugin trình tạo trang đều có tính năng tạo chủ đề. Đây là 2 plugin trình tạo trang WordPress đi kèm với chức năng tạo chủ đề:

1. Elementor

Elementor là tiêu chuẩn hàng đầu cho trình tạo chủ đề WordPress. Cho đến nay, nó là plugin tạo trang phổ biến nhất trên WordPress với hơn 5 triệu người dùng đang hoạt động theo thống kê của WordPress.org. Elementor được phát hành dưới dạng một plugin miễn phí, nhưng bạn cần sử dụng phiên bản chuyên nghiệp để có thể sử dụng tính năng xây dựng chủ đề của nó.

Trình tạo chủ đề

Tính năng Trình tạo chủ đề của Elementor cho phép bạn tạo các mẫu tùy chỉnh cho các phần chủ đề sau:

Nếu bạn đang sử dụng WooCommerce, Elementor cũng cho phép bạn tạo một trang sản phẩm được cá nhân hóa độc đáo và các trang khác trên WooCommerce.

2. Người xây dựng Divi

Divi Builder là một plugin tạo trang cao cấp được phát triển bởi Elegant Themes. Không có tùy chọn để sử dụng nó miễn phí. Bản thân Elegant Themes là nhà phát triển của hai chủ đề WordPress cao cấp phổ biến: Divi và Extra. Mặc dù vậy, Divi Builder có thể được cài đặt trên bất kỳ chủ đề WordPress nào, mà không bị giới hạn ở chủ đề Divi và chủ đề Phụ.

Trình tạo chủ đề

Nếu bạn thích sử dụng Divi Builder thay vì chủ đề Divi hoặc chủ đề Phụ, bạn không cần cài đặt plugin Divi Builder vì nó có sẵn như một phần không thể thiếu của các chủ đề này. Divi Builder cũng đi kèm với tính năng trình tạo chủ đề cho phép bạn tạo các mẫu tùy chỉnh cho các phần chủ đề sau:

  • cú đội đầu
  • Footer
  • Mẫu bài đăng đơn
  • Mẫu trang đơn
  • Trang lưu trữ (danh mục và thẻ)
  • Trang tác giả
  • trang 404
  • Trang kết quả tìm kiếm

Cuối cùng

Bạn phải thành thạo PHP, CSS, JavaScript và HTML để tạo một chủ đề WordPress. Một lần nữa, đó là một câu chuyện cũ. Kỷ nguyên của trình tạo trang sẽ cho phép bạn xây dựng một trang web WordPress hoàn toàn tùy chỉnh bất kể bạn sử dụng chủ đề nào.

Một số plugin trình tạo trang - bao gồm Elementor và Divi Builder - đi kèm với trình tạo chủ đề cho phép bạn tạo các mẫu tùy chỉnh để ghi đè các mẫu mặc định cho chủ đề đang hoạt động của bạn.

Tải xuống Elementor Pro ngay!

Kết luận

Đây ! Đó là nó cho bài viết này giải thích mọi thứ bạn cần biết về các trình xây dựng chủ đề. Nếu bạn có bất kỳ mối quan tâm nào về cách đến đó fcho chúng tôi biết trong ý kiến.

Tuy nhiên, bạn cũng có thể tham khảo ý kiến tài nguyên của chúng tôi, nếu bạn cần thêm các yếu tố để thực hiện các dự án tạo trang Internet của mình, bằng cách tham khảo hướng dẫn của chúng tôi về Tạo blog WordPress hoặc một ngày Divi: chủ đề WordPress tốt nhất mọi thời đại.

Nhưng trong lúc này, chia sẻ bài viết này trên các mạng xã hội khác nhau của bạn.