Bạn mang muốn thêm một hộp tính năng với các biểu trưng đẹp mắt trên trang chủ của trang web WordPress của mình không? Các hộp tính năng này hiển thị các điểm bán hàng quan trọng của sản phẩm và nhà cung cấp của bạn. Nó đã được chứng minh là 1 khoa học hấp dẫn cao trong việc giới thiệu các tính năng cho khách hàng mới. Trong bài viết này, chúng tôi sẽ hướng dẫn bạn phương pháp thuận lợi thêm các hộp tính năng sở hữu những biểu tượng trong trang web WordPress của bạn.
phương pháp thêm hộp tính năng mang biểu trưng trong WordPress
[caption id="attachment_31626" align="alignnone" width="520"]
cách thức thêm hộp tính năng sở hữu biểu tượng trong WordPress[/caption]
Hộp tính năng sở hữu tượng trưng là gì?
gần như mọi người khi họ truy hỏi cập những trang web không thực sự đọc chúng. Là con người, chúng ta đang trở nên những máy quét giỏi.
Điều này mang nghĩa là mang nhân cách là chủ tổ chức, bạn cần biểu lộ thông báo quan yếu ở định dạng mang thể quét tiện dụng và quyến rũ cao.
ấy là lý do tại sao rất nhiều những trang web kinh doanh đa dạng thường với một hình ảnh to hoặc một thanh trượt ở trên cộng sở hữu nút kêu gọi hành động.
Ngay bên dưới ô đó, bạn với thể dùng hộp tính năng cho phép bạn giới thiệu các tính năng quan trọng của sản phẩm hoặc nhà sản xuất của mình. Mỗi hộp tính năng sở hữu thể sở hữu lời kêu gọi hành động riêng để quý khách sở hữu thể Phân tích thêm.
Đây là 1 thí dụ từ trang web OptinMonster của chúng tôi:
Video chỉ dẫn
nếu như bạn không thích video hoặc cần thêm hướng dẫn, thì hãy tiếp diễn đọc.
Thêm hộp tính năng có biểu trưng trên trang chủ WordPress của bạn
Điều trước hết bạn cần khiến là cài đặt và kích hoạt plugin Advanced WP Columns . Lúc kích hoạt, bạn cần truy hỏi cập Cài đặt »Cột WP tăng để định cấu hình plugin.
Chỉ cần cuộn xuống tùy chọn ‘Lớp cột’ và nhập các cột của tôi kế bên. Đừng quên nhấp vào nút lưu đổi thay để lưu cài đặt của bạn.
Tiếp theo, bạn sẽ cần một plugin để chèn các tượng trưng SVG đẹp mắt vào các hộp tính năng của mình. Cài đặt và kích hoạt plugin WP SVG Icons .
bây giờ bạn đã sẵn sàng để tạo các hộp tính năng của mình.
khởi đầu bằng phương pháp chỉnh sửa trang mà bạn muốn thêm các hộp tính năng.
Bạn sẽ nhận thấy 2 nút mới trên màn hình chỉnh sửa bài đăng. Đầu tiên là nút Thêm tượng trưng nằm ngay phía trên trình chỉnh sửa. Nút thứ hai nằm ở mục cuối cùng trong menu trình chỉnh sửa trực giác.
giả dụ trình chỉnh sửa trực giác của bạn chỉ hiển thị một hàng nút, thì bạn cần nhấp vào nút bật tắt trên thanh dụng cụ để mở mang nó.
trước tiên, bạn cần nhấp vào nút Advanced WP Columns. Thao tác này sẽ hiển thị 1 cửa sổ bật lên, nơi bạn cần nhấp vào Empty và sau đấy chọn số cột bạn muốn thêm.
Sau đấy, bạn cần nhấp vào từng cột để thêm một số văn bản. Nếu bạn không thêm một số văn bản ngay ngày nay, thì sẽ rất khó để xem các cột trong trình chỉnh sửa bài đăng. Khi bạn đã hoàn thành, hãy nhấp vào nút thêm cột ở dưới cùng.
Bạn sẽ thấy các cột trong trình chỉnh sửa bài đăng của mình ngay hiện nay. Bước tiếp theo là thêm các tượng trưng phía trên văn bản.
Đưa chuột đến đầu vùng văn bản trong cột trước tiên và nhấp vào nút enter. Thao tác này sẽ vận động văn bản xuống và sản xuất ko gian để chèn những biểu trưng của bạn.
hiện nay bạn cần nhấp vào nút Thêm biểu trưng, nó sẽ xuất hiện 1 cửa sổ bật lên đẹp như sau:
trong khoảng đấy, bạn với thể chọn biểu trưng bạn muốn tiêu dùng bằng cách nhấp vào nó. Tiếp theo, bạn cần nhấp vào nút span để tượng trưng của bạn được bao bọc bên trong phần tử .
rút cuộc, nhấp vào nút chèn. Hiện giờ bạn sẽ thấy mã ngắn cho biểu trưng SVG trong trình chỉnh sửa bài đăng của mình. Tùy thuộc vào tên của biểu trưng bạn đã chọn, nó sẽ trông giống như sau:
[wp-svg-icons icon=”rocket” wrap=”span”]
Lặp lại quy trình để thêm những biểu trưng trong những hộp tính năng khác.
Sau lúc hoàn thành, chỉ cần nhấp vào nút Cập nhật để lưu trang của bạn.
Bạn đã sắp hoàn tất, nhưng nếu như bạn xem trước trang của mình, thì bạn sẽ nhận thấy rằng các biểu tượng quá nhỏ và những hộp tính năng của bạn hầu như chơi đáng chú ý.
Bạn sẽ cần thêm một tẹo CSS để khắc phục vấn đề này. Chỉ cần thêm đoạn mã CSS này vào biểu định kiểu của chủ đề hoặc chủ đề con của bạn.
span.wp-svg-rocket.rocket font-size:100px; span.wp-svg-cloud.cloud font-size:100px; span.wp-svg-headphones.headphones font-size:100px; .mycolumns border:1px solid #eee; min-height:250px; padding-top:20px !important;
Đừng quên điều chỉnh CSS để khớp sở hữu tên của những biểu tượng bạn đang tiêu dùng.
Chúng tôi hy vọng bài viết này đã giúp bạn thêm phần hộp tính năng đẹp mắt trên trang chủ của mình. Bạn cũng sở hữu thể muốn xem chỉ dẫn của chúng tôi về 5 trình xây dựng trang WordPress kéo và thả phải chăng nhất vì đầy đủ trình tạo trang đó đã tích hợp sẵn chức năng hộp tính năng này.
.
Bạn sở hữu muốn thêm một hộp tính năng mang những tượng trưng đẹp mắt trên trang chủ của trang web WordPress của mình không? Các hộp tính năng này hiển thị những điểm bán hàng quan trọng của sản phẩm và nhà cung cấp của bạn. Nó đã được chứng minh là 1 khoa học quyến rũ cao trong việc giới thiệu những tính năng cho các bạn mới. Trong bài viết này, chúng tôi sẽ chỉ dẫn bạn cách thức thuận lợi thêm các hộp tính năng có những tượng trưng trong trang web WordPress của bạn.
Hộp tính năng sở hữu biểu trưng là gì?
phần đông mọi người khi họ tróc nã cập những trang web không đích thực đọc chúng. Là con người, chúng ta đang trở thành các máy quét nhiều năm kinh nghiệm.
Điều này với tức là với nhân cách là chủ đơn vị, bạn cần biểu đạt thông tin quan trọng ở định dạng với thể quét thuận tiện và hấp dẫn cao.
ấy là lý do tại sao đông đảo các trang web kinh doanh nhiều thường có một hình ảnh lớn hoặc một thanh trượt ở trên cộng mang nút kêu gọi hành động.
Ngay bên dưới ô ấy, bạn với thể tiêu dùng hộp tính năng cho phép bạn giới thiệu những tính năng quan trọng của sản phẩm hoặc dịch vụ của mình. Mỗi hộp tính năng có thể mang lời kêu gọi hành động riêng để người mua có thể Tìm hiểu thêm.
Đây là 1 thí dụ từ trang web OptinMonster của chúng tôi:
Video chỉ dẫn
nếu bạn không thích video hoặc cần thêm hướng dẫn, thì hãy tiếp tục đọc.
Thêm hộp tính năng với tượng trưng trên trang chủ WordPress của bạn
Điều đầu tiên bạn cần khiến cho là cài đặt và kích hoạt plugin Advanced WP Columns . Khi kích hoạt, bạn cần truy cập Cài đặt »Cột WP nâng cao để định cấu hình plugin.
Chỉ cần cuộn xuống tùy chọn ‘Lớp cột’ và nhập những cột của tôi bên cạnh. Đừng quên nhấp vào nút lưu đổi thay để lưu cài đặt của bạn.
Tiếp theo, bạn sẽ cần một plugin để chèn những tượng trưng SVG đẹp mắt vào những hộp tính năng của mình. Cài đặt và kích hoạt plugin WP SVG Icons .
ngày nay bạn đã sẵn sàng để tạo những hộp tính năng của mình.
khởi đầu bằng cách thức chỉnh sửa trang mà bạn muốn thêm các hộp tính năng.
Bạn sẽ nhận thấy hai nút mới trên màn hình chỉnh sửa bài đăng. Trước tiên là nút Thêm biểu tượng nằm ngay phía trên trình chỉnh sửa. Nút thứ hai nằm ở mục chung cục trong menu trình chỉnh sửa trực giác.
nếu như trình chỉnh sửa trực quan của bạn chỉ hiển thị một hàng nút, thì bạn cần nhấp vào nút bật tắt trên thanh công cụ để mở rộng nó.
trước nhất, bạn cần nhấp vào nút Advanced WP Columns. Thao tác này sẽ hiển thị một cửa sổ bật lên, nơi bạn cần nhấp vào Empty và sau đấy chọn số cột bạn muốn thêm.
Sau đấy, bạn cần nhấp vào từng cột để thêm 1 số văn bản. Ví như bạn không thêm 1 số văn bản ngay hiện nay, thì sẽ rất khó để xem những cột trong trình chỉnh sửa bài đăng. Lúc bạn đã hoàn tất, hãy nhấp vào nút thêm cột ở dưới cộng.
Bạn sẽ thấy các cột trong trình chỉnh sửa bài đăng của mình ngay hiện tại. Bước tiếp theo là thêm các biểu trưng phía trên văn bản.
Đưa chuột tới đầu vùng văn bản trong cột đầu tiên và nhấp vào nút enter. Thao tác này sẽ chuyển di văn bản xuống và cung ứng không gian để chèn những biểu trưng của bạn.
bây giờ bạn cần nhấp vào nút Thêm tượng trưng, nó sẽ xuất hiện 1 cửa sổ bật lên đẹp như sau:
trong khoảng ấy, bạn mang thể chọn biểu trưng bạn muốn dùng bằng cách nhấp vào nó. Tiếp theo, bạn cần nhấp vào nút span để biểu tượng của bạn được bao bọc bên trong phần tử .
rút cục, nhấp vào nút chèn. Hiện giờ bạn sẽ thấy mã ngắn cho biểu tượng SVG trong trình chỉnh sửa bài đăng của mình. Tùy thuộc vào tên của tượng trưng bạn đã chọn, nó sẽ trông giống như sau:
[wp-svg-icons icon=”rocket” wrap=”span”]
Lặp lại quy trình để thêm các tượng trưng trong những hộp tính năng khác.
Sau lúc hoàn tất, chỉ cần nhấp vào nút Cập nhật để lưu trang của bạn.
Bạn đã sắp hoàn tất, nhưng giả dụ bạn xem trước trang của mình, thì bạn sẽ nhận thấy rằng các tượng trưng quá nhỏ và các hộp tính năng của bạn hầu như chơi đáng chú ý.
Bạn sẽ cần thêm một tẹo CSS để khắc phục vấn đề này. Chỉ cần thêm đoạn mã CSS này vào biểu định kiểu của chủ đề hoặc chủ đề con của bạn.
span.wp-svg-rocket.rocket font-size:100px; span.wp-svg-cloud.cloud font-size:100px; span.wp-svg-headphones.headphones font-size:100px; .mycolumns border:1px solid #eee; min-height:250px; padding-top:20px !important;
Đừng quên điều chỉnh CSS để khớp mang tên của những biểu tượng bạn đang sử dụng.
Chúng tôi hy vọng bài viết này đã giúp bạn thêm phần hộp tính năng đẹp mắt trên trang chủ của mình. Bạn cũng mang thể muốn xem chỉ dẫn của chúng tôi về 5 trình vun đắp trang WordPress kéo và thả thấp nhất vì đông đảo trình tạo trang ấy đã tích hợp sẵn chức năng hộp tính năng này.
.
Theo : Thủ thuật Blog - Thủ thuật Flatsome
0 on: "Cách thêm hộp tính năng sở hữu biểu trưng trong WordPress"