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.
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ẩm và Cá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.
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ó 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.
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ố
Để đặ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.
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.
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.
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.
Đâ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.
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.
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.
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.
Để 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.
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:
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).
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Ý.
Đâ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.
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.
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).
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.
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 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 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.
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.
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.
Đâ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.
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.
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.
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.
Để 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
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.
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ơ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.
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ấ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ị.
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.
Đâ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.
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).
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.
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.
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.
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ó.
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:
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ụ.
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.
Đâ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.
Bảo mật và cookie: trang này sử dụng cookie. Bằng cách tiếp tục duyệt trang web này, bạn đồng ý với việc chúng tôi sử dụng nó.
Để tìm hiểu thêm, bao gồm cả cách kiểm soát cookie, hãy xem phần sau:
Chính sách cookie
