Andrei | вывод кнопки узнать о поступлении в карточке товара

wp-content/themes/cosmopet/templates/_blocks/shop/archive-product-tease.twig

@@ -33,11 +33,18 @@
             <div class="product-item__price">
                <p>{{ post._price() }} {{ fn('get_woocommerce_currency_symbol') }}</p>
             </div>
+            {% set stock_status = post.meta('_stock_status') == 'instock' %}
+            {% if stock_status == 'instock' %}
             <div class="product-item__bye">
                 <button class="button button--white button--100-perc open-overlay">
                     {{ function('pll_e', 'Купить') }}
                 </button>
             </div>
+            {% else %}
+            <button data-pname="{{ post.title }}" class="to-know button--100-perc open-to-know">
+                <p>{{ function('pll_e', 'Узнать о поступлении') }}</p>
+            </button>
+            {% endif %}
         </div>
         <div class="product-item__overlay">
             <div class="product-item-overlay__header">
@@ -72,15 +79,19 @@
         
                                             {% set weight = function('get_product_info', sibling.ID, 'weight') %}
                                     
-                                            {% set class = '' %}
+                                            {% set s_product = TimberPost(sibling.ID) %}
-                                            {% if weight == cur_weight %}
+                                            {% set s_in_stock = s_product.meta('_stock_status') == 'instock' %}
-                                                {% set class = 'active' %}
+                                            {% if s_in_stock %}
+                                                {% set class = '' %}
+                                                {% if weight == cur_weight %}
+                                                    {% set class = 'active' %}
+                                                {% endif %}
+                                                <li>
+                                                    <button class="state__button {{ class }}" data-product_id="{{sibling.ID}}" data-product_price="{{ function('get_product_info', sibling.ID, 'price') }}">
+                                                        {{ weight }}
+                                                    </button>
+                                                </li>
                                             {% endif %}
-                                            <li>
-                                                <button class="state__button {{ class }}" data-product_id="{{sibling.ID}}" data-product_price="{{ function('get_product_info', sibling.ID, 'price') }}">
-                                                    {{ weight }}
-                                                </button>
-                                            </li>
                                         {% endfor %}
                                     {% endfor %}
                                 </ul>

wp-content/themes/cosmopet/templates/archive-product/archive-product-tease.twig

@@ -33,11 +33,18 @@
             <div class="product-item__price">
                <p>{{ post._price() }} {{ fn('get_woocommerce_currency_symbol') }}</p>
             </div>
+            {% set stock_status = fn('wc_get_product_stock_status', post.id) %}
+            {% if stock_status == 'instock' %}
             <div class="product-item__bye">
                 <button class="button button--white button--100-perc open-overlay">
                     {{ function('pll_e', 'Купить') }}
                 </button>
             </div>
+            {% else %}
+            <button data-pname="{{ post.title }}" class="to-know button--100-perc open-to-know">
+                <p>{{ function('pll_e', 'Узнать о поступлении') }}</p>
+            </button>
+            {% endif %}
         </div>
         <div class="product-item__overlay">
             <div class="product-item-overlay__header">

wp-content/themes/cosmopet/woocommerce/assets/css/gp-style-core.css

@@ -1267,3 +1267,40 @@ button{
 .wpfFilterWrapper ul:not(.wpfButtonsFilter) li{
   min-width: 50%;
 }
+
+
+
+
+
+  .to-know{
+    width: 100%;
+  
+    padding: 12px;
+  
+    display: flex;
+    justify-content: center;
+  
+    border: none;
+  
+    transition: opacity .2s ease-out;
+    text-transform: uppercase;
+  }
+  .to-know:hover{
+    opacity: .8;
+  }
+  .to-know p{
+    padding-bottom: 4px;
+  
+    font-family: var(--font-family);
+    font-weight: 700;
+    font-size: 20px;
+    line-height: 120%;
+    color: var(--text-black);
+  
+    border-bottom: 1px var(--text-black) solid;
+  
+    cursor: pointer;
+  }
+  .to-know--background-none{
+    background: none;
+  }