Hướng Dẫn Tạo Popup Hướng Dẫn Kích Cỡ Trong Giao Diện Flatsome

Bảng hướng dẫn kích thước trong giao diện Flatsome rất quan trọng nếu bạn có một cửa hàng quần áo trực tuyến. Bảng hướng dẫn kích thước giúp khách hàng của bạn tìm thấy những bộ quần áo phù hợp nhất với số đo của họ. Đó là lý do tại sao việc biết cách tạo một bảng hướng dẫn kích thước cho trang sản phẩm của bạn sẽ giúp khách hàng chọn đúng kích cỡ quần áo và đây là plugin popup tốt nhất trong WordPress. Trong hướng dẫn này, chúng ta sẽ xem cách thêm ‘Bảng hướng dẫn kích thước’ vào giao diện Flatsome. Khi khách hàng nhấp vào nút bảng hướng dẫn kích thước, một bảng hướng dẫn kích thước sẽ hiện ra trong hộp sáng. Chúng ta sẽ triển khai bảng hướng dẫn kích thước trong giao diện Flatsome sử dụng mã demo mà bạn có thể chỉnh sửa và đặt các số đo theo ý muốn của mình.

Cách tạo Bảng hướng dẫn kích thước trong giao diện Flatsome từng bước

Bước 1:

Đầu tiên, chúng ta cần tạo một Khối UX. Trên bảng điều khiển, di chuột đến ‘Khối UX’ và nhấp vào ‘Thêm mới’.

Bước 2:

Đặt tiêu đề cho khối là ‘Bảng hướng dẫn kích thước’ để mã ngắn sẽ là

Block "”size-guide”" not found

Bước 3:

Nhấp vào tab ‘Văn bản’ trong trình soạn thảo để chọn nó. Sao chép và dán mã đã cho vào trình soạn thảo. Bạn có thể tùy chỉnh các giá trị theo nhu cầu của mình. Bây giờ nhấp vào ‘Xuất bản’ để hoàn thành việc tạo Khối UX. Trình soạn thảo văn bản mặc định giống nhau trong tất cả các giao diện WooCommerce tốt nhất.

[khoảng trống]

[tiêu đề kiểu="giữa" văn bản="Bảng hướng dẫn kích thước"]
<div class="size-guide">

<table class="size-guide-table">

<thead>

<tr>



     <th class="tooltip" title="Hoa Kỳ">US</th>

     <th class="tooltip" title="Vương quốc Anh">UK</th>

     <th class="tooltip" title="Ý">IT</th>

     <th class="tooltip" title="Pháp">FR</th>

     <th class="tooltip" title="Đức">DE</th>

     <th class="tooltip" title="Nhật Bản">JP</th>



</tr>

</thead>
<tbody>
<tr>
<td>2</td>

<td>6</td>

<td>38</td>

<td>34</td>

<td>32</td>

<td>7</td>
</tr>
<tr>
<td>4</td>

<td>8</td>

<td>40</td>

<td>36</td>

<td>34</td>

<td>9</td>
</tr>
<tr>
<td>6</td>

<td>10</td>

<td>42</td>

<td>38</td>

<td>36</td>

<td>11</td>
</tr>
<tr>
<td>8</td>

<td>12</td>

<td>44</td>

<td>40</td>

<td>38</td>

<td>13</td>
</tr>
<tr>
<td>10</td>

<td>14</td>

<td>46</td>

<td>42</td>

<td>40</td>

<td>15</td>
</tr>
<tr>
<td>12</td>

<td>16</td>

<td>48</td>

<td>44</td>

<td>42</td>

<td>17</td>
</tr>
<tr>
<td>14</td>

<td>18</td>

<td>50</td>

<td>46</td>

<td>44</td>

<td>19</td>
</tr>
<tr>
<td>16</td>

<td>20</td>

<td>52</td>

<td>48</td>

<td>46</td>

<td>21</td>
</tr>
<tr>
<td>18</td>

<td>22</td>

<td>54</td>

<td>50</td>

<td>48</td>

<td>23</td>
</tr>
<tr>
<td>20</td>

<td>24</td>

<td>56</td>

<td>52</td>

<td>50</td>

<td>25</td>
</tr>
<tr>
<td>22</td>

<td>26</td>

<td>58</td>

<td>54</td>

<td>52</td>

<td>27</td>
</tr>
<tr>
<td>24</td>

<td>28</td>

<td>60</td>

<td>56</td>

<td>54</td>

<td>29</td>
</tr>
<tbody>
</table><!-- /.size-guide-table -->
</div><!-- /.size-guide -->
[khoảng trống]
<p style="text-align: center;"&