ajax cart 7 mini cart missing button wordings

tarekanani · November 25, 2024, 2:59pm

I have issue that I have my website in Arabic and when I add products to cart it shows blank buttons in the ajax car & the mini car as well any solutions ?

https://tashaficare.com/

pass : meache

atma_llc · November 25, 2024, 3:26pm

Hi Tarekanani,

You can get assistance from developers and other shopify store owners on small things by describing your issue, taking screenshots, and sharing your code. You can view your code by finding themes, locating your current them, and clicking the options button.

Mehran_Ali · November 25, 2024, 4:18pm

HI @tarekanani

Your store is unavailable

tarekanani · November 26, 2024, 7:21pm

Hello Mehran , its now working you can check once again

atma_llc · November 26, 2024, 7:37pm

Hi @tarekanani ,

Can you please send your cart.liquid page, I would be happy to take a look

tarekanani · November 26, 2024, 7:48pm

!-- /templates/cart.liquid →
{% comment %}

For info on test orders:

General http://docs.shopify.com/manual/your-store/orders/test-orders
Shopify Payments - http://docs.shopify.com/manual/more/shopify-payments/testing-shopify-payments

{% endcomment %}

{% include 'breadcrumb' %}

{% if cart.item_count > 0 %}

{% if cart.item_count > 0 %} {% for item in cart.items %} {% endfor %} {% endif %}

{{ 'cart.label.product' \| t }}		{{ 'cart.label.price' \| t }}	{{ 'cart.label.quantity' \| t }}	{{ 'cart.label.total' \| t }}
	{{ item.product.title }} {% unless item.variant.title contains 'Default' %} {{ item.variant.title }} {% endunless %} {% if settings.cart_vendor_enable %} {{ item.vendor }} {% endif %}	{{ item.price \| money }}		{{ item.line_price \| money }}

{{ 'cart.label.total' \| t }}	{{ cart.total_price \| money }}

{% else %} {% comment %} The cart is empty {% endcomment %}

{% endif %}

{% schema %} { "name": "Cart Page", "settings": [

]
}
{% endschema %}

{% stylesheet %}
{% endstylesheet %}

{% javascript %}
{% endjavascript %}

tarekanani · November 26, 2024, 7:55pm

!-- /templates/cart.liquid -->
{% comment %}

For info on test orders:
- General http://docs.shopify.com/manual/your-store/orders/test-orders
- Shopify Payments - http://docs.shopify.com/manual/more/shopify-payments/testing-shopify-payments

{% endcomment %}
<div class="wrap-bread-crumb breadcrumb_cart">
<div class="container container-v1" >
{% include 'breadcrumb' %}
</div>
</div>
<section class="page-cart">
<div class="content-pages">
<div class="container container-v1">
<div class="content-about content-cart-page">
{% if cart.item_count > 0 %}
<form action="/cart" method="post" novalidate>
<div class="table-responsive">
<table class="shop_table table--responsive cart table">
<thead>
<tr class="cart-title">

<th colspan="2" class="product-thumbnail"> {{ 'cart.label.product' | t }}</th>
<th class="product-price">{{ 'cart.label.price' | t }}</th>
<th class="product-quantity">{{ 'cart.label.quantity' | t }}</th>
<th class="product-subtotal">{{ 'cart.label.total' | t }}</th>
<th class="product-remove"> </th>
</tr>
</thead>
{% if cart.item_count > 0 %}
<form action="/cart" method="post" novalidate>
<tbody>
{% for item in cart.items %}
<tr class="cart_item">
<td data-label="Product Name" class="product-thumbnail">
<a href="{{ item.url }}"><img src="{{ item | img_url: 'small' }}" alt="{{ item.title | escape }}"/></a> 
</td>
<td class="product-name-thumb" data-title="Product">
<a href="{{ item.url }}">{{ item.product.title }}</a> 
{% unless item.variant.title contains 'Default' %}
<small style="display: block; color: #959595;">{{ item.variant.title }}</small>
{% endunless %}
{% if settings.cart_vendor_enable %}
<p>{{ item.vendor }}</p>
{% endif %}

</td>
<td data-label="Product Price" class="product-price" data-title="Price">
<span class="amount">{{ item.price | money }}</span> 
</td>
<td data-label="Quantity" class="product-quantity" data-title="Quantity">
<input type="number" name="updates[]" id="updates_{{ item.id }}" value="{{ item.quantity }}" min="0">
</td>
<td data-label="Sub Total" class="product-subtotal" data-title="Total">
<span class="amount">{{ item.line_price | money }}</span> 
</td>
<td class="product-remove">
<a class="remove set-12-svg" href="/cart/change?line={{ forloop.index }}&quantity=0"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 298.667 298.667" style="enable-background:new 0 0 298.667 298.667;" xml:space="preserve"> <g> <g> <polygon points="298.667,30.187 268.48,0 149.333,119.147 30.187,0 0,30.187 119.147,149.333 0,268.48 30.187,298.667 149.333,179.52 268.48,298.667 298.667,268.48 179.52,149.333 "></polygon> </g> </g> </svg></a>
</td>
</tr>
{% endfor %}

</tbody>
</form>
{% endif %}
</table>
</div>

<div class="cart_totals ">
<div class="cart-update">
<input type="submit" value="{{ 'cart.general.update' | t }}" name="update_cart" class="button bg-color"> 
</div>
<div class="continue-shopping-1">
<a href="/collections/all">{{'cart.general.continue' | t}}</a>
</div>

<div class="cart-check">
<h2 class="cart-title">{{'cart.label.cart_total' | t}}</h2>
<table class="total-checkout">
<tbody>
<tr>
<th class="cart-label"><span >{{ 'cart.label.total' | t }}</span></th>
<td class="cart-amount"><span ><strong><span class="amount">{{ cart.total_price | money }}</span></strong> </span></td>
</tr>
</tbody>
</table>
<div class="wc-proceed-to-checkout clearfix">
<a class="checkout-button button alt wc-forward bg-color" href="/checkout">{{ 'cart.general.checkout' | t }}</a>
</div>
</div> 
</div>
</form>
{% else %}
{% comment %}
The cart is empty
{% endcomment %}
<p>{{ 'cart.general.empty' | t }}</p>
<p>{{ 'cart.general.continue_browsing_html' | t }}</p>
{% endif %}
</div> 
</div>
</div>
<!-- End Content Pages -->
</section>
{% schema %}
{
"name": "Cart Page",
"settings": [

]
}
{% endschema %}

{% stylesheet %}
{% endstylesheet %}

{% javascript %}
{% endjavascript %}

tarekanani · November 26, 2024, 8:01pm

<!-- /snippets/ajax-cart-template.liquid -->

{% comment %}

  This snippet provides the default handlebars.js templates for

  the ajax cart plugin. Use the raw liquid tags to keep the

  handlebar.js template tags as available hooks.

{% endcomment %}

{% if settings.enable_rtl_mode %}

<script id="CartTemplate" type="text/template">

  {% raw %}

    <form action="/cart" method="post" novalidate class="ajaxcart">

     <div class="prod">

       <div class="product-cart">

        {{#items}} 

        <ol class="minicart_item list-unstyled mb-0 px-0">

            <li class="d-flex">

              <div class="thumb_img_cartmini">

                <a href="{{url}}" title="" class=""><img alt="{{name}}" src="{{img}}"></a>

              </div>

              <div class="product-detail">

                <h3 class="product_name_mini">

                  <a href="{{url}}">{{name}}

  {{#if variation}}

                    - <span class="ajaxcart__product-meta">{{variation}}</span>

                  {{/if}}

                  {{#properties}}

                    {{#each this}}

                      {{#if this}}

                        - <span class="ajaxcart__product-meta">{{@key}}: {{this}}</span>

                      {{/if}}

                    {{/each}}

                  {{/properties}}  

  

   </a>

                 

                  

                </h3>

                <div class="product_info">

                  <div class="product_quanity">QTY : {{itemQty}} </div>

                  <div class="product_price">

                    <span class="price_sale">{{{price}}}</span>

                  </div>

                </div>

              </div>

              <div class="produc_remove">

               <a href="javascript&colon;void(0)" class="remove-product" data-line="{{line}}"><i class="fa fa-trash-o"></i></a>              

              </div>

            </li>

          </ol>

          {{/items}} 

       </div>

       </div>

       <div class="sub-total">

            <span class="total-price float-right">{{{totalPrice}}}</span>

            <span class="total-title float-left">{% endraw %}{{ 'minicart.general.total_price' | t }}{% raw %}</span>

     </div>

      <div class="action-checkout">

        <a href="/checkout" class="button-checkout">

          <span>{% endraw %}{{ 'minicart.general.checkout' | t }}{% raw %}</span>

        </a>

        <a href="/cart" class="button-viewcart">

          <span>{% endraw %}{{ 'minicart.general.view_cart' | t }}{% raw %}</span>

        </a>

      </div>

     </form> 

  {% endraw %}

  </script>

{% else %}

<script id="CartTemplate" type="text/template">

  {% raw %}

    <form action="/cart" method="post" novalidate class="ajaxcart">

     <div class="prod">

       <div class="product-cart">

        {{#items}} 

        <ol class="minicart_item list-unstyled mb-0 px-0">

            <li class="d-flex">

              <div class="thumb_img_cartmini">

                <a href="{{url}}" title="" class=""><img alt="{{name}}" src="{{img}}"></a>

              </div>

              <div class="product-detail">

                <h3 class="product_name_mini">

                  <a href="{{url}}">{{name}}

  {{#if variation}}

                    - <span class="ajaxcart__product-meta">{{variation}}</span>

                  {{/if}}

                  {{#properties}}

                    {{#each this}}

                      {{#if this}}

                        - <span class="ajaxcart__product-meta">{{@key}}: {{this}}</span>

                      {{/if}}

                    {{/each}}

                  {{/properties}}  

  

   </a>

                 

                  

                </h3>

                <div class="product_info">

                  <div class="product_quanity">QTY : {{itemQty}} </div>

                  <div class="product_price">

                    <span class="price_sale">{{{price}}}</span>

                  </div>

                </div>

              </div>

              <div class="produc_remove">

               <a href="javascript&colon;void(0)" class="remove-product" data-line="{{line}}"><i class="fa fa-trash-o"></i></a>              

              </div>

            </li>

          </ol>

          {{/items}} 

       </div>

       </div>

       <div class="sub-total">

            <span class="total-title float-left">{% endraw %}{{ 'minicart.general.total_price' | t }}{% raw %}</span>

            <span class="total-price float-right">{{{totalPrice}}}</span>

     </div>

      <div class="action-checkout">

        <a href="/cart" class="button-viewcart">

          <span>{% endraw %}{{ 'minicart.general.view_cart' | t }}{% raw %}</span>

        </a>

        <a href="/checkout" class="button-checkout">

          <span>{% endraw %}{{ 'minicart.general.checkout' | t }}{% raw %}</span>

        </a>

      </div>

     </form> 

  {% endraw %}

  </script>

{% endif %}

  <script id="AjaxQty" type="text/template">

  {% raw %}

    <div class="ajaxcart__qty">

      <button type="button" class="ajaxcart__qty-adjust ajaxcart__qty--minus icon-fallback-text" data-id="{{id}}" data-qty="{{itemMinus}}">

        <span class="fa fa-minus" aria-hidden="true"></span>

      </button>

      <input type="text" class="ajaxcart__qty-num" value="{{itemQty}}" min="0" data-id="{{id}}" aria-label="quantity" pattern="[0-9]*">

      <button type="button" class="ajaxcart__qty-adjust ajaxcart__qty--plus icon-fallback-text" data-id="{{id}}" data-qty="{{itemAdd}}">

        <span class="fa fa-plus"></span>

      </button>

    </div>

  {% endraw %}

  </script>

  <script id="JsQty" type="text/template">

  {% raw %}

    <div class="js-qty">

      <button type="button" class="qty_minus js-qty__adjust js-qty__adjust--minus icon-fallback-text" data-id="{{id}}" data-qty="{{itemMinus}}">

        <span class="fa fa-caret-down"></span>

      </button>

      <input type="text" class="js-qty__num" value="{{itemQty}}" min="1" data-id="{{id}}" aria-label="quantity" pattern="[0-9]*" name="{{inputName}}" id="{{inputId}}">

      <button type="button" class="qty_plus js-qty__adjust js-qty__adjust--plus icon-fallback-text" data-id="{{id}}" data-qty="{{itemAdd}}">

        <span class="fa fa-caret-up"></span>

      </button>

    </div>

  {% endraw %}

  </script>

atma_llc · November 27, 2024, 12:37am

It looks like there is a little reactivity issues, the icons and sections are blank when the viewport is too small.

This is what I can see in a larger view

If this isn’t correct, can you share what exactly is missing?

Topic		Replies	Views
Re: ajax cart 7 mini cart missing button wordings Store Design liquid , css , cart-page , troubleshooting	3	67	November 28, 2024
Product pages - Stay on the product page after adding products to the cart Store Design	215	2563	November 30, 2024
Cart page is not showing properly in mobile view, Debut Theme? Store Design design , customizations , css , cart-page , shopify-themes , troubleshooting	13	109	December 23, 2022
How to remove quantity selector from mini cart? Look to the code mini-cart.liquid Store Design design , customizations , css , third-party-themes , cart-page , shopify-themes , html	15	125	July 15, 2024
Why is my add to cart button not working on mobile devices? Technical Q&A	13	206	December 13, 2021

ajax cart 7 mini cart missing button wordings

{{'cart.label.cart_total' | t}}

Related topics