Trả lời các câu hỏi về WooC Commerce với thiết lập trang web Elementor.
Bạn cũng có thể khám phá của chúng tôi trang webDịch vụ gn (WooC Commerce với Elementor) và Huấn luyện thiết kế trang web Dịch vụ.

Cách thay đổi giao diện của WooC Commerce với Trang danh mục Elementor
Trang danh mục tiêu chuẩn cho WooCommerce có thể nhàm chán và bạn có thể tự do tùy chỉnh các trang danh mục theo cách của mình bằng cách sử dụng Trình tạo chủ đề Elementor Pro.
Trước tiên, hãy chuyển đến Trình tạo chủ đề trong Mẫu trong Elementor Pro và chọn “Lưu trữ sản phẩm”. Sau đó, bạn sẽ vào trang Elementor Editor, nơi bây giờ bạn có thể thiết lập bố cục cho tất cả Danh mục sản phẩm và Danh mục phụ của mình.
Bạn sẽ nhận thấy một số Thành phần xuất hiện ở thanh bên dành riêng cho một trang như vậy. Các yếu tố này là: “Tiêu đề lưu trữ”, “Sản phẩm lưu trữ” và “Mô tả lưu trữ”. Từ “Lưu trữ” ở đây có thể được hoán đổi với từ “Thể loại”. Vì vậy, đương nhiên đối với một trang như vậy, chúng tôi sẽ cần đặt trường Tiêu đề, trường Mô tả danh mục cũng như các sản phẩm trong danh mục.
Đây là những thành phần tiêu chuẩn mà chúng ta sẽ cần cho bố cục Danh mục sản phẩm.
“Mô tả lưu trữ” sẽ là dữ liệu sẽ được lấy từ Mô tả danh mục sản phẩm.
Khi bạn kéo phần tử “Sản phẩm lưu trữ”, bạn sẽ nhận thấy rằng các danh mục phụ của danh mục chính sẽ tự động xuất hiện. Nếu bạn chỉ muốn xem các sản phẩm duy nhất ở đây, bạn có thể điều chỉnh cài đặt ở nơi khác:
Thoát khỏi Trình chỉnh sửa Elementor (hoặc chỉ cần mở một tab mới để truy cập Bảng điều khiển WordPress phụ trợ trang web của bạn). Di chuột qua “Giao diện” và nhấp vào “Tùy chỉnh”, sau đó nhấp vào “WooC Commerce”. Sau đó, nhấp vào “Danh mục sản phẩm”. Trong “Hiển thị danh mục”, chọn “Hiển thị sản phẩm”.
Bạn cũng có thể đặt cách bạn muốn sắp xếp sản phẩm của mình, số lượng sản phẩm trên mỗi hàng và số lượng hàng trên mỗi trang. Sau khi hoàn tất, hãy lưu cài đặt này và quay lại Elementor Editor để lưu trữ sản phẩm.
Bây giờ, hiển thị sản phẩm của bạn sẽ xuất hiện mà không có hình ảnh danh mục phụ. Nếu bạn muốn hiển thị các danh mục phụ của mình trong một hàng khác (có thể là trên đầu các sản phẩm), hãy làm như sau:
Tìm phần tử “Danh mục sản phẩm” ở thanh bên Elementor Editor. Kéo phần tử này vào trang biên tập. Trong “Truy vấn” > “Nguồn”, chọn “Danh mục con hiện tại”. Điều này có nghĩa là trình chỉnh sửa sẽ tự động kéo các danh mục phụ của nó lên, ngay cả khi bạn thêm nhiều danh mục khác vào ở giai đoạn sau. Nếu bạn không nhìn thấy hình ảnh cho các danh mục phụ của mình, hãy đảm bảo rằng bạn đã tải lên hình ảnh đại diện cho từng danh mục tại trình chỉnh sửa “Danh mục sản phẩm” ở phần phụ trợ trang web của bạn.
Cách tạo băng chuyền sản phẩm cuộn bằng Elementor Pro
Hầu hết các trang web Thương mại điện tử đều có trang chủ giới thiệu một số sản phẩm theo một số hình thức bố cục. Một cách phổ biến để giới thiệu sản phẩm là sử dụng Phần tử băng chuyền. Xin lưu ý rằng phần tử này chỉ có sẵn cho những người sử dụng Elementor Pro.
Dưới đây là cách sử dụng Phần tử băng chuyền để hiển thị sản phẩm của bạn:
Trước tiên, hãy tìm Phần tử “Băng chuyền phương tiện” và kéo nó vào một Phần trên Trang chủ của bạn.
Trong “Nội dung” tại Thanh bên của Trình chỉnh sửa, nhấp vào “Mặt hàng #1” và thêm hình ảnh sản phẩm của bạn, sau đó thêm vào liên kết URL của bạn bên dưới. Làm tương tự cho nhiều mặt hàng sản phẩm tùy thích.
Sau khi hoàn tất, hãy cuộn xuống để xem “Trang trình bày trên mỗi chế độ xem”. Bạn có thể đặt số lượng sản phẩm bạn muốn xem trong một hàng hiển thị. Trong “Trang trình bày để cuộn”, chúng tôi thường đặt nó thành 1 để Băng chuyền di chuyển chậm, một sản phẩm xuất hiện tại một thời điểm.
Nhấp vào “Tùy chọn bổ sung”, đặt Kích thước hình ảnh thành “Đầy đủ” và Hình ảnh vừa vặn thành “Chứa”.
Nếu bạn muốn mỗi hình ảnh hiển thị trong một hộp, bạn có thể đi tới “Kiểu” để đặt Kích thước đường viền và Màu đường viền. Border Radius sẽ xác định đường viền của bạn sẽ trông như thế nào. Đặt nó là 0 để xem hình vuông hoặc hình chữ nhật. Nếu bạn muốn hộp của mình trông tròn trịa hơn, hãy tăng bán kính đường viền.
Băng chuyền của bạn bây giờ sẽ trông đẹp!
Cách Cố định Tiêu đề Trang web của bạn bằng Trình chỉnh sửa Phần tử
Bạn có thể nhận thấy rằng một số trang web có tiêu đề của họ bị "đóng băng". Chúng tôi sử dụng thuật ngữ “Tiêu đề dính” để mô tả các tiêu đề như vậy. Vì vậy, khi bạn cuộn xuống, Tiêu đề cố định sẽ luôn ở trong tầm mắt của chúng tôi. Chúng tôi thiết lập các tiêu đề cố định để giúp khán giả dễ dàng điều hướng đến các trang khác một cách nhanh chóng mà không phải liên tục cuộn lên và xuống.
Đây là cách đặt tiêu đề cố định bằng Trình tạo chủ đề Elementor Pro cho Bố cục tiêu đề.
Tại Trình tạo chủ đề> Trình chỉnh sửa tiêu đề, hãy quyết định phần nào của tiêu đề bạn muốn đặt là cố định. Nó có thể chỉ là hàng trên cùng, hoặc một vài hàng, hoặc chỉ một phần tử. Nếu bạn chỉ cần một phần tử dính, thì hãy nhấp vào phần tử đó để chỉnh sửa. Nếu đó là một hàng phần tử bạn cần cố định, thì hãy nhấp vào hàng đó để chỉnh sửa. Nếu đó là một vài hàng, hãy nhóm các hàng này thành một phần và chỉnh sửa phần đó.
Khi bạn đã chọn những phần bạn muốn chỉnh sửa để trở nên hấp dẫn, hãy chuyển đến Nâng cao ở Thanh bên của Trình chỉnh sửa. Cuộn xuống để tìm “Hiệu ứng chuyển động”. Trong “Cố định”, hãy chọn “Trên cùng”. Bạn cũng được cung cấp các tùy chọn thiết bị để đặt lựa chọn của mình là cố định, Ví dụ: bạn có thể muốn hiệu ứng dính này chỉ hiệu quả trên Máy tính để bàn chứ không có hiệu quả trên thiết bị di động hoặc máy tính bảng và bạn có thể đặt điều đó bằng cách gạch bỏ Thiết bị di động và Máy tính bảng trong phần “Cố định Trên đồng.
Bạn có thể bỏ qua cài đặt "Bù đắp" trong hầu hết các trường hợp. Số Offset có nghĩa là lượng không gian tính bằng pixel bạn muốn để lại giữa phần trên cùng và phần lựa chọn cố định của bạn. Vì vậy, nếu bạn đặt offset thành 100px, chẳng hạn, bạn sẽ thấy rằng tiêu đề của bạn sẽ để lại một khoảng trống khoảng 100px từ trên cùng khi bạn cuộn xuống. Nếu bạn không muốn thấy bất kỳ khoảng trống nào giữa phần trên cùng và lựa chọn cố định của mình (đây là trường hợp thông thường), bạn có thể chỉ cần bỏ qua cài đặt Offset.
Cách tạo Hiệu ứng di chuột trên WooC Commerce với Elementor Editor
Bạn có thể đã thấy một số trang web Thương mại điện tử có hiệu ứng di chuột tuyệt vời. Ví dụ: nếu bạn di chuột qua một hình ảnh, nó sẽ hiển thị cho bạn một góc khác của hình ảnh đó. Bạn có thể sử dụng hiệu ứng di chuột khi hiển thị một số hình ảnh sản phẩm trên trang chủ của mình.
Trong Elementor Editor, việc sử dụng hiệu ứng di chuột trên ảnh nền là dễ dàng nhất. Nếu bạn muốn tạo 4 cột hình ảnh sản phẩm với hiệu ứng di chuột, hãy thử cách này:
Tạo Phần và sử dụng biểu tượng + để tạo 4 cột
Nhấp chuột phải vào cột đầu tiên và nhấp vào Phong cách để thêm hình nền. Nếu bạn không thể tìm thấy biểu tượng Tải lên hình ảnh, chỉ cần nhấp vào biểu tượng sơn có nội dung “Cổ điển” trong “Loại nền”.
Sau đó, chọn Phần “Di chuột” và nhấp vào “Cổ điển” để thêm Hình nền cho Di chuột.
Lặp lại các cột còn lại với các hình ảnh sản phẩm khác nhau.
Bây giờ bạn nhận được 4 cột hình ảnh có hiệu ứng di chuột.
Lưu ý rằng chức năng “Thời lượng chuyển tiếp” chỉ áp dụng cho Thay đổi màu khi di chuột chứ không phải Thay đổi hình ảnh. Đối với thay đổi hình ảnh, đây sẽ là một quá trình chuyển đổi nhanh chóng tiêu chuẩn, vì vậy cài đặt này không hoạt động đối với sự thay đổi hình ảnh.
Cách tạo liên kết đến giữa trang
Bạn có thể đã bắt gặp một số liên kết trên một số trang web hướng bạn đến một phần cụ thể trong một trang. Đối với một số người, nó có thể là một liên kết cuộn bạn xuống giữa cùng một trang và đối với những người khác đến một trang khác nhưng là phần dưới cùng thay vì phần trên cùng hiển thị thông thường.
Điều này có thể được tạo bằng cách sử dụng Phần tử neo của Menu trong Trình chỉnh sửa phần tử.
Đầu tiên, kéo phần tử này đến điểm cụ thể mà bạn muốn liên kết trỏ đến. Kéo nó lên đầu một phần nếu bạn muốn hướng khán giả của mình đến phần này. Sau đó, đặt ID của neo này. Đặt cho nó một cái tên trực quan đề cập rõ ràng đến phần đó (để bạn không bị nhầm lẫn với quá nhiều ID).
Sau đó, hãy đến nơi bạn cần chèn liên kết và chèn liên kết này: yourite.com/#anchorID (Thay đổi trang web của bạn thành địa chỉ trang web của bạn và thay đổi anchorID thành ID mà bạn đã đặt cho mỏ neo đó).
Sự khác biệt giữa Margin và Padding trong Elementor
Đối với mỗi Phần tử trong Elementor Pro, trong Cài đặt nâng cao, bạn sẽ thấy các cài đặt cho Lề và Phần đệm.
Lề là khoảng trống giữa Phần tử được chọn và Phần tử bên cạnh.
Vì vậy, các pixel lề trên cùng sẽ là khoảng trống được phép giữa phần tử hiện tại và phần tử tiếp theo ở trên. Pixel lề phải sẽ là khoảng trống được phép giữa phần tử hiện tại và phần tử tiếp theo ở bên phải. Pixel lề dưới cùng sẽ là khoảng trống được phép giữa phần tử hiện tại và phần tử tiếp theo bên dưới.
Chúng tôi thường tạo các phần tử trong một phần. Vì vậy, nếu chỉ có 1 phần tử trong 1 phần, thì cài đặt lề của phần tử này sẽ là khoảng cách giữa phần tử và phần. Khi bạn đặt màu nền của phần tử thành một màu nhất định, bạn sẽ thấy một khoảng trắng xung quanh màu nền đó ở bên ngoài. Khoảng trắng đó là mặt cắt. Nếu bạn tăng cài đặt lề cho phần tử này, bạn sẽ nhận thấy rằng khoảng trắng lớn hơn. (Sidetrack: Nếu bạn muốn toàn bộ màn hình có màu nền đó, thì bạn cũng sẽ cần đặt nền phần đó thành cùng một màu.)
Ký quỹ có thể được sử dụng một cách tinh nghịch để tạo ra hiệu ứng tràn. Ví dụ: bạn có thể đặt lề trên cho một phần tử thành một số âm như -20px. Nó sẽ di chuyển lên trên để chồng lên phần trên. Nó có thể tạo ra một hiệu ứng chồng chéo đẹp mắt. Nếu bạn làm điều này, hãy kiểm tra xem nó trông như thế nào trên các thiết bị khác nhau.
Padding là tất cả về không gian bên trong phần tử.
Mỗi phần tử có một vùng chứa (mà chúng ta không thực sự thấy). Nếu bạn thay đổi màu nền của Phần tử đó, bạn sẽ có thể thấy kích thước vùng chứa (là kích thước của màu nền). Padding là khoảng trống được phép giữa nội dung và đường viền của vùng chứa bên trong phần tử. Vì vậy, nếu bạn tăng phần đệm của mình, bạn sẽ thấy rằng nội dung của bạn bị chèn ép nhiều hơn vào bên trong vùng chứa. Nếu bạn chỉ tăng phần đệm trên cùng, thì bạn sẽ thấy nội dung của mình di chuyển xuống bên trong vùng chứa phần tử.
Cách tạo biểu ngữ có chiều rộng đầy đủ bằng Elementor
Nếu bạn cố gắng sử dụng Phần tử hình ảnh để tạo một biểu ngữ có chiều rộng đầy đủ, bạn vẫn có thể gặp phải một đường viền màu trắng khó chịu. Hình ảnh của bạn không trải dài trên màn hình như bạn mong muốn. Để tạo một biểu ngữ trải dài trên màn hình, hãy làm theo thủ thuật sau:
Thêm một phần
Chỉnh sửa Phần này bằng cách nhấp vào biểu tượng ở giữa xuất hiện cùng với 2 người khác khi bạn di chuột qua phần đó. Biểu tượng ở giữa này là biểu tượng có 6 chấm. Nhấp vào nó, và bạn sẽ thấy thanh bên Chỉnh sửa Phần xuất hiện ở bên trái của bạn.
Đặt Phần là chiều rộng đầy đủ và chọn “Có” cho Phần kéo dài.
Trong “Kiểu”> Nền, hãy chèn hình ảnh biểu ngữ của bạn.
Lưu nó.
Bây giờ, bạn sẽ thấy hình ảnh của mình được trải dài trên màn hình.
Các khu vực khác để kiểm tra xem bạn vẫn chưa đạt được biểu ngữ có chiều rộng đầy đủ hay không:
Vị trí nội dung
Nhấp vào nội dung (ví dụ hộp văn bản) và bạn sẽ thấy Chỉnh sửa Trình soạn thảo Văn bản xuất hiện ở cột bên trái.
Chuyển đến Nâng cao và tìm Vị trí. Bên trong Vị trí, bạn sẽ thấy một tùy chọn “Chiều rộng”, thay đổi nó thành “Chiều rộng đầy đủ (100%)”.
Thuộc tính trang
Nếu bạn đang chỉnh sửa một Trang và dường như không thể kéo dài trang đó hết chiều rộng, hãy đi tới Chỉnh sửa Trang.
KHÔNG nhấp vào nút màu xanh có nội dung Chỉnh sửa bằng Elementor.
Thay vào đó, hãy nhìn sang thanh bên phải của bạn, đảm bảo rằng “Trang” được chọn thay vì “Chặn” ở đầu thanh bên phải của bạn. Cuộn xuống để xem tùy chọn có tên “Thuộc tính trang” và nhấp vào tùy chọn đó.
Trong “Mẫu”, thay đổi thành “Phần tử có chiều rộng đầy đủ”. Lưu nó.
Nếu bạn đã thực hiện tất cả những điều trên, biểu ngữ của bạn phải có chiều rộng hoàn toàn.
Cách tạo văn bản đang chạy trên WooC Commerce với Elementor Site Builder
Trình tạo trang phần tử không có chức năng cụ thể hoặc thậm chí là hiệu ứng chuyển động giúp chúng ta tạo văn bản đang chạy trên thanh. Tuy nhiên, chúng ta có thể nhận được những gì được trao cho chúng ta và tạo ra thứ gì đó có hiệu quả tương tự. Đây là cách thực hiện:
Nếu văn bản đang chạy là thông báo hoặc văn bản chào mừng mà bạn muốn chèn ở tiêu đề, hãy chuyển đến Mẫu> Trình tạo chủ đề và chọn “Tiêu đề”. Trang chỉnh sửa Elementor sẽ xuất hiện. Tạo một phần. Bạn có thể thích lần đầu tiênt đặt nó thành chiều rộng đầy đủ.
Cuộn xuống tùy chọn Elements và tìm Slider. Số trang trình bày mặc định được cung cấp cho bạn là 3 trang trình bày. Gạch bỏ cái thứ ba để loại bỏ nó, vì chúng tôi chỉ yêu cầu 2. Sau đó, đặt chiều cao khoảng 50px.
Nhấp vào Tùy chọn thanh trượt và chọn những thứ sau:
Điều hướng: Không có
Tự động phát: Có
Tạm dừng khi Di chuột: Không
Tạm dừng tương tác: Không
Tốc độ tự động phát: 8000
Vòng lặp vô hạn: Có
Chuyển tiếp: Trang trình bày
Tốc độ chuyển đổi: 8000
Hoạt ảnh nội dung: Không có
Bây giờ, quay lại Trang trình bày và nhấp vào Item#1. Thay đổi màu nền thành Hoàn toàn trong suốt. Điều này có thể được thực hiện bằng cách kéo thanh trượt ở thanh dưới cùng sang bên trái của bảng màu. Sau đó, nhấp vào Nội dung và loại bỏ các từ Tiêu đề cũng như các từ Văn bản Nút. Trong hộp mô tả, hãy nhập văn bản chuyển động của bạn vào đây. Sao chép toàn bộ văn bản và dán vào hộp mô tả của Item#2. Thực hiện cài đặt nền tương tự cho Item#2 và nhớ cũng xóa các từ Tiêu đề và Từ văn bản nút cho Item#2.
Đối với cả Item#1 và Item#2: Nhấp vào Kiểu. Sau đó, chọn “Tùy chỉnh” là Có. Tập trung tất cả các tùy chọn: Vị trí ngang, Vị trí dọc và Căn chỉnh văn bản. Ngoài ra, hãy quyết định màu nội dung của bạn. Lưu ý rằng màu nội dung mặc định là màu trắng, vì vậy nếu bạn không nhìn thấy văn bản của mình, chỉ cần chỉnh sửa màu nội dung.
Bạn cũng có thể chỉnh sửa “Kiểu” trong phần chỉnh sửa Trang trình bày chính. Bạn có thể điều chỉnh độ rộng của trang chiếu theo ý thích của bạn.
Đó phải là nó! Bạn sẽ có thể xem các văn bản chuyển động của mình ngay bây giờ sau khi cập nhật.
Tìm mã tham chiếu WooCommerce CSS ở đâu
Bạn có thể đăng nhập vào tài khoản lưu trữ của mình để tìm Trình quản lý tệp của mình.
Đi đến:
public_html > wp-content > plugin > thương mại điện tử > nội dung > css > woocommerce.css
Nhấp đúp chuột vào thư mục đó và bạn sẽ thấy một đoạn mã khổng lồ được nén lại với nhau.
Nó được viết theo cách này để tiết kiệm không gian. Có thể hữu ích khi sử dụng “Ctrl+F” để tìm đúng chức năng bạn cần. Ví dụ. tìm kiếm “woocommerce-cart” nếu bạn cần chỉnh sửa thứ gì đó trên trang giỏ hàng.
Khi sao chép mã, hãy nhớ sao chép từ một “,” sang “,” tiếp theo vì điều đó tạo thành một dòng hoàn chỉnh để chỉnh sửa. Sau đó, nhập mã mong muốn của bạn để chỉnh sửa và đặt mã vào chương trình phụ trợ trang web của bạn tại:
Giao diện > Tùy chỉnh > CSS bổ sung.
Xóa hình thu nhỏ của sản phẩm trên trang giỏ hàng
Đây là Mã CSS để xóa hình thu nhỏ của sản phẩm khỏi trang giỏ hàng.
.wooc Commerce-cart table.cart .product-thumbnail {
không trưng bày;
}
Vào Giao diện > Tùy chỉnh > CSS bổ sung để nhập mã.
Tùy chỉnh Tiếp tục đến Nút Thanh toán trên Trang Giỏ hàng
Đây là mã CSS để thay đổi màu sắc cho Nút “Tiến hành thanh toán” trên trang Giỏ hàng cho WooCommerce.
.woocommerce-cart .wc-process-to-checkout a.checkout-button {
màu nền: #FFA62F;
màu: #FFFFFF;
}
Đây là mã CSS để thay đổi màu khi di chuột:
.woocommerce-cart .wc-process-to-checkout a: hover.checkout-button {
background-color: #4C4646;
màu: #FFFFFF;
}
Bạn có thể tham khảo mã màu html tại đây: https://www.computerhope.com/htmcolor.htm#:~:text=HTML%20color%20codes%20are%20hexadecimal,tables%20on%20a%20web%20page.
Chỉ cần sao chép và dán màu bạn thích vào cả mã màu nền và văn bản trong mã CSS.
Vào Giao diện > Tùy chỉnh > CSS bổ sung để nhập mã.
Thay đổi WooCommerce Thêm vào Màu nút Giỏ hàng
WooC Commerce plugin miễn phí ban đầu đi kèm với nhiều hạn chế về thiết kế. Đối với một số người, chúng tôi sẽ cần mua các plugin mở rộng bổ sung để phù hợp hơn với nhu cầu Thương mại điện tử của mình. Đối với những người khác, chúng tôi có thể cố gắng giải quyết những gì có sẵn cho chúng tôi.
Chúng ta có thể thay đổi màu của nút Thêm vào giỏ hàng bằng Mã CSS sau:
.single-product .product .single_add_to_cart_button.button {
màu nền: #FFA62F;
màu: #FFFFFF;
}
Bạn có thể tham khảo mã màu html tại đây: https://www.computerhope.com/htmcolor.htm#:~:text=HTML%20color%20codes%20are%20hexadecimal,tables%20on%20a%20web%20page.
Chỉ cần sao chép và dán màu bạn thích vào cả mã màu nền và văn bản trong mã CSS.
Vào Giao diện > Tùy chỉnh > CSS bổ sung để nhập mã.
Các khoản tín dụng để: https://quadlayers.com/customize-add-to-cart-button-woocommerce/ vì đã cung cấp cho chúng tôi câu trả lời thân thiện với giáo dân nhất cho vấn đề này.
Chúng tôi cũng đã tìm ra một mã bổ sung để thêm vào để thay đổi màu của nút và văn bản khi di chuột:
.single-product .product :hover.single_add_to_cart_button.button {
background-color: #4C4646;
màu: #FFFFFF;
}
Cách xóa các trường tại trang thanh toán WooC Commerce cho các sản phẩm hoặc dịch vụ ảo
Nếu bạn đang bán sản phẩm hoặc dịch vụ ảo; và không yêu cầu khách hàng của bạn điền vào các trường địa chỉ và địa chỉ giao hàng của họ tại trang thanh toán, bạn có thể thực hiện các thao tác sau để xóa các trường này trên trang thanh toán WooC Commerce của mình.
Đầu tiên, di chuột qua “Giao diện” và nhấp vào “Trình chỉnh sửa chủ đề”.
Bạn sẽ thấy các tập tin chủ đề của mình.
Chúng tôi khuyên bạn nên có một chủ đề con trước khi chỉnh sửa các tệp chủ đề của mình, vì khi chủ đề của bạn được cập nhật, bạn có thể mất các chỉnh sửa của mình. Tuy nhiên, nếu có chủ đề con, bạn có thể giữ lại các chỉnh sửa của mình trên chủ đề con.
Hầu hết các chủ đề đi kèm với các chủ đề con. Nếu không, có lẽ đã đến lúc bạn chuyển sang một chủ đề khác có chủ đề con. 🙂
Bây giờ, ở phía bên phải của chế độ xem trình chỉnh sửa chủ đề, bạn có thể thấy một số tệp. Nhấp vào “functions.php”.
Ở dưới cùng của cửa sổ mã, sao chép và dán:bỏ đặt ( $fields['shipping']['shipping_company'] ); bỏ đặt ( $fields['shipping']['shipping_phone'] ); bỏ đặt ( $fields['shipping']['shipping_state'] ); bỏ đặt ( $fields['shipping']['shipping_first_name'] ); bỏ đặt ( $fields['shipping']['shipping_last_name'] ); bỏ đặt ( $fields['shipping']['shipping_address_1'] ); bỏ đặt ( $fields['shipping']['shipping_address_2'] ); bỏ đặt ( $fields['shipping']['shipping_city'] ); bỏ đặt ( $fields['shipping']['shipping_postcode'] );
add_filter( 'wooc Commerce_checkout_fields', 'custom_checkout_fields');
chức năng custom_checkout_fields( $fields ) {
unset($fields['billing']['billing_postcode']);
bỏ đặt ( $fields['billing']['billing_address_1'] );
bỏ đặt ( $fields['billing']['billing_address_2'] );
bỏ đặt ( $fields['billing']['billing_city'] );
trả về các trường $;
}
Bạn đã xóa tất cả các trường vận chuyển và một số trường thanh toán.
Những gì còn lại trong các trường thanh toán sẽ là:
Tên đầu tiên
Họ
Tên công ty
Quốc gia
Bang (Trường này chỉ xuất hiện sau khi khách hàng của bạn đã chọn quốc gia)
Điện thoại
Địa chỉ email
Bạn có thể nghĩ tại sao chúng ta nên giữ lại trường cho “Quốc gia” và “Bang” vì bạn có thể không cần điều này. Có 2 lý do:
Lý do kỹ thuật: WooC Commerce có thể hiển thị lỗi nếu chúng tôi xóa quốc gia và nếu chúng tôi không có quốc gia nhưng có quốc gia thì cũng sẽ có lỗi. Cho nên, ruộng nước phải có, có ruộng nhà nước.
Nếu bạn đang bán một sản phẩm ảo như sách điện tử, bạn nên lấy thông tin về quốc gia của khách hàng cho các mục đích tiếp thị trong tương lai.
Cách khắc phục “Xin lỗi, bạn không được phép truy cập trang này” trong Đăng nhập quản trị viên WordPress
Gần đây khách hàng của tôi gặp phải một vấn đề như vậy. Anh ấy không thể đăng nhập vào bảng điều khiển quản trị của mình và màn hình hiển thị “Xin lỗi, bạn không được phép truy cập trang này”. Người ta có thể tưởng tượng sự hoảng loạn, đặc biệt là khi bạn cần thực hiện các đơn đặt hàng phụ trợ.
Trong khi giúp anh ấy khắc phục sự cố này, tôi đã xem nhiều trang web có các giải pháp tương tự. Một ví dụ điển hình là: https://kinsta.com/knowledgebase/sorry-you-are-not-allowed-to-access-this-page-error-in-wordpress/
Một số trang web cung cấp 10 cách trong khi những trang khác cung cấp 7 cách. Chúng chủ yếu giống nhau. Tôi đã thử mọi thứ có thể, và không có gì hiệu quả.
Tôi rất vui khi thấy một giải pháp khác trong diễn đàn:
https://www.wpbeginner.com/wp-tutorials/how-to-fix-the-sorry-you-are-not-allowed-to-access-this-page-error-in-wordpress/
Hãy tìm câu trả lời của người dùng này: giadinh123
Giải pháp đó là một viên ngọc quý. Nó đã làm việc!
Và nó xứng đáng được chú ý nhiều hơn chứ không phải ẩn mình trong muôn vàn câu hỏi và câu trả lời. Vì vậy, đây đi:
—
giadinh123
(@padreed123)
2 năm, 10 tháng trước
Ok sau vô số giờ kiểm tra các bảng wp_options trong phpmyadmin, cuối cùng tôi cũng phát hiện ra sự cố. Bằng cách nào đó, hàng wp_user_role đã bị xóa. Nó cũng có thể xảy ra nếu nó được chỉnh sửa/thay đổi bởi một plugin chẳng hạn như WooC Commerce.
Vì vậy, để khắc phục, tôi đã sao chép phần sau từ bản cài đặt mới và chèn nó vào bảng wp_options bằng phpmyadmin:
Hãy nhớ thay thế 'wp_' bằng tiền tố db của bạn.
tùy_chọnwp_user_role
giá trị tùy chọn
a:5:{s:13:”quản trị viên”;a:2:{s:4:”tên”;s:13:”Quản trị viên”;s:12:”khả năng”;a:61:{s:13 :”switch_themes”;b:1;s:11:”edit_themes”;b:1;s:16:”activate_plugins”;b:1;s:12:”edit_plugins”;b:1;s:10:” edit_users”;b:1;s:10:”edit_files”;b:1;s:14:”manage_options”;b:1;s:17:”moderate_comments”;b:1;s:17:”manage_categories” ;b:1;s:12:”manage_links”;b:1;s:12:”upload_files”;b:1;s:6:”import”;b:1;s:15:”unfiltered_html”;b :1;s:10:”edit_posts”;b:1;s:17:”edit_others_posts”;b:1;s:20:”edit_published_posts”;b:1;s:13:”publish_posts”;b:1 ;s:10:”edit_pages”;b:1;s:4:”read”;b:1;s:8:”level_10″;b:1;s:7:”level_9″;b:1;s :7:”cấp_8″;b:1;s:7:”cấp_7″;b:1;s:7:”cấp_6″;b:1;s:7:”cấp_5″;b:1;s:7 :”cấp_4″;b:1;s:7:”cấp_3″;b:1;s:7:”cấp_2″;b:1;s:7:”cấp_1″;b:1;s:7:” level_0″;b:1;s:17:”edit_others_pages”;b:1;s:20:”edit_published_pages”;b:1;s:13:”publish_pages”;b:1;s:12:”delete_pages” ;b:1;s:19:”delete_others_pages”;b:1;s:22:”delete_published_pages”;b:1;s:12:”delete_posts”;b:1;s:19:”delete_others_posts”;b :1;s:22:”delete_publ ished_posts”;b:1;s:20:”delete_private_posts”;b:1;s:18:”edit_private_posts”;b:1;s:18:”read_private_posts”;b:1;s:20:”delete_private_pages” ;b:1;s:18:”edit_private_pages”;b:1;s:18:”read_private_pages”;b:1;s:12:”delete_users”;b:1;s:12:”create_users”;b :1;s:17:”unfiltered_upload”;b:1;s:14:”edit_dashboard”;b:1;s:14:”update_plugins”;b:1;s:14:”delete_plugins”;b:1 ;s:15:”install_plugins”;b:1;s:13:”update_themes”;b:1;s:14:”install_themes”;b:1;s:11:”update_core”;b:1;s :10:”list_users”;b:1;s:12:”remove_users”;b:1;s:13:”promote_users”;b:1;s:18:”edit_theme_options”;b:1;s:13 :”delete_themes”;b:1;s:6:”export”;b:1;}}s:6:”editor”;a:2:{s:4:”name”;s:6:”editor”; ;s:12:”capabilities”;a:34:{s:17:”moderate_comments”;b:1;s:17:”manage_categories”;b:1;s:12:”manage_links”;b:1 ;s:12:”upload_files”;b:1;s:15:”unfiltered_html”;b:1;s:10:”edit_posts”;b:1;s:17:”edit_others_posts”;b:1;s :20:”edit_published_posts”;b:1;s:13:”publish_posts”;b:1;s:10:”edit_pages”;b:1;s:4:”read”;b:1;s:7 :”cấp_7″;b:1;s:7:”cấp_6″;b:1;s:7:”cấp_5″;b: 1;s:7:”cấp_4″;b:1;s:7:”cấp_3″;b:1;s:7:”cấp_2″;b:1;s:7:”cấp_1″;b:1; s:7:”level_0″;b:1;s:17:”edit_others_pages”;b:1;s:20:”edit_published_pages”;b:1;s:13:”publish_pages”;b:1;s: 12:”delete_pages”;b:1;s:19:”delete_others_pages”;b:1;s:22:”delete_published_pages”;b:1;s:12:”delete_posts”;b:1;s:19: ”delete_others_posts”;b:1;s:22:”delete_published_posts”;b:1;s:20:”delete_private_posts”;b:1;s:18:”edit_private_posts”;b:1;s:18:”read_private_posts ;b:1;s:20:”delete_private_pages”;b:1;s:18:”edit_private_pages”;b:1;s:18:”read_private_pages”;b:1;}}s:6:”tác giả ;a:2:{s:4:”tên”;s:6:”Tác giả”;s:12:”khả năng”;a:10:{s:12:”upload_files”;b:1;s: 10:”edit_posts”;b:1;s:20:”edit_published_posts”;b:1;s:13:”publish_posts”;b:1;s:4:”read”;b:1;s:7: ”level_2″;b:1;s:7:”level_1″;b:1;s:7:”level_0″;b:1;s:12:”delete_posts”;b:1;s:22:”delete_published_posts ”;b:1;}}s:11:”người đóng góp”;a:2:{s:4:”tên”;s:11:”người đóng góp”;s:12:”khả năng”;a:5:{ s:10:”edit_posts”;b:1;s:4:”read”;b:1;s:7:”level_1″;b:1;s:7:”level_0″;b:1;s: 12:” delete_posts”;b:1;}}s:10:”người đăng ký”;a:2:{s:4:”tên”;s:10:”người đăng ký”;s:12:”khả năng”;a:2: {s:4:”read”;b:1;s:7:”level_0″;b:1;}}}
Hãy liên hệ với tôi nếu bạn không chắc về phần này vì nó yêu cầu bạn truy cập cơ sở dữ liệu của mình ở phía máy chủ. Tôi rất sẵn lòng hướng dẫn bạn trong toàn bộ quá trình.
Bây giờ, chúng tôi có một vấn đề khác sau khi đăng nhập được. Chúng tôi nhận ra rằng tất cả cơ sở dữ liệu WooC Commerce của chúng tôi đã biến mất! Nhấn lại nút hoảng loạn và quay lại chế độ khắc phục sự cố.
Sau khi mày mò một chút xung quanh cơ sở dữ liệu, tôi đã tìm ra giải pháp.
Tôi nhận ra rằng các tên tùy chọn trong bảng wp_options cho WooC Commerce không nhất quán. Một số sử dụng wp_ làm tiền tố trong khi một số sử dụng vbx_ làm tiền tố. Vì cơ sở dữ liệu của chúng tôi sử dụng vbx_ làm tiền tố nên tôi đã thay đổi tất cả wp_ thành vbx_ và cơ sở dữ liệu WooC Commerce của chúng tôi đã hoạt động trở lại. Phù!
Suy ngẫm: Tại sao điều này lại xảy ra?
Tôi tin rằng sự lộn xộn cơ sở dữ liệu này đã xảy ra sau khi chúng tôi di chuyển trang web từ Bluehost sang Siteground.
Tôi rất vui vì trang web hiện đang hoạt động tốt. 🙂
Nếu bạn đang ở trong tình huống tương tự và gặp một số sự cố khi khắc phục sự cố hoặc không chắc chắn về cách truy cập hoặc chỉnh sửa cơ sở dữ liệu của mình, vui lòng liên hệ với tôi.
Cách xóa nút Thêm vào giỏ hàng trên các trang danh mục WooCommerce
Đi tới trình quản lý tệp của bạn ở phía máy chủ.
Nhấp vào các thư mục sau trong trình quản lý tệp:
public_html> wp-content> plugin> woocommerce
Nhấp đúp vào woocommerce.php để chỉnh sửa
Cuộn đến cuối trình chỉnh sửa và nhấp vào dòng trống.
Sao chép và dán mã sau:
add_action( 'wooc Commerce_after_shop_loop_item', 'remove_add_to_cart_buttons', 1 ); function remove_add_to_cart_buttons() { if( is_product_category() || is_shop()) { remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart' ); } }