Xhyper Posted July 3 Share Posted July 3 Hello, guys. I set up my products and everything, but after clicking on a product, next to the text saying "НАЛИЧНИ" - available (in the screenshot) , there is a circle with a line - which means not available. The products can be ordered, but how do I change this icon to a tick or even remove it? Thank you! Link to comment Share on other sites More sharing options...
compsoul.dev Posted July 28 Share Posted July 28 Check the condition in your theme. I seen this issue before you might be using an older version of your theme? Take a look at the file templates/catalog/product.tpl. In my case, this section looks like this: {block name='product_availability'} <ul id="product-availability" class="product-availability js-product-availability component-availability"> {if $product.show_availability} {if $product.availability == 'available'} <li class="product-availability-item availability-in">{l s='In stock' d='Shop.Theme.Catalog'}</li> {elseif $product.availability == 'last_remaining_items'} <li class="product-availability-item availability-low">{$product.availability_message}</li> {else} <li class="product-availability-item availability-out">{$product.availability_message}</li> {/if} {/if} </ul> {/block} However, your code might look completely different or be located in another file. I don’t recommend fixing this just with CSS, because the root of the problem is either in your .tpl file or in a variable holding the wrong value. Link to comment Share on other sites More sharing options...
Xhyper Posted July 29 Author Share Posted July 29 I have only this thing here, nothing similar to the screenshot you sent me. Link to comment Share on other sites More sharing options...
compsoul.dev Posted July 29 Share Posted July 29 Paste the entire file. Link to comment Share on other sites More sharing options...
Xhyper Posted July 29 Author Share Posted July 29 {** * For the full copyright and license information, please view the LICENSE * file that was distributed with this source code. *} {extends file=$layout} {block name='head' append} <meta property="og:type" content="product"> <meta content="{$product.url}"> {if $product.cover} <meta property="og:image" content="{$product.cover.large.url}"> {/if} {if $product.show_price} <meta property="product:pretax_price:amount" content="{$product.price_tax_exc}"> <meta property="product:pretax_price:currency" content="{$currency.iso_code}"> <meta property="product:price:amount" content="{$product.price_amount}"> <meta property="product:price:currency" content="{$currency.iso_code}"> {/if} {if isset($product.weight) && ($product.weight != 0)} <meta property="product:weight:value" content="{$product.weight}"> <meta property="product:weight:units" content="{$product.weight_unit}"> {/if} {/block} {block name='head_microdata_special'} {include file='_partials/microdata/product-jsonld.tpl'} {/block} {block name='content'} {* FIRST PART - PHOTO, NAME, PRICES, ADD TO CART*} <div class="row g-4 g-xl-5 product js-product-container"> <div class="product__left col-lg-6 col-xl-7"> {block name='product_cover_thumbnails'} {include file='catalog/_partials/product-cover-thumbnails.tpl'} {/block} </div> <div class="product__col col-lg-6 col-xl-5"> {block name='product_header'} <h1 class="h4 product__name">{block name='page_title'}{$product.name}{/block}</h1> {/block} {block name='product_prices'} {include file='catalog/_partials/product-prices.tpl'} {/block} {block name='product_description_short'} <div class="product__description-short rich-text">{$product.description_short nofilter}</div> {/block} {block name='product_customization'} {if $product.is_customizable && count($product.customizations.fields)} {include file='catalog/_partials/product-customization.tpl' customizations=$product.customizations} {/if} {/block} <div class="product__actions js-product-actions"> {block name='product_buy'} <form action="{$urls.pages.cart}" method="post" id="add-to-cart-or-refresh"> <input type="hidden" name="token" value="{$static_token}"> <input type="hidden" name="id_product" value="{$product.id}" id="product_page_product_id"> <input type="hidden" name="id_customization" value="{$product.id_customization}" id="product_customization_id" class="js-product-customization-id"> {block name='product_variants'} {include file='catalog/_partials/product-variants.tpl'} {/block} {block name='product_pack'} {if $packItems} {include file='catalog/_partials/product-pack.tpl'} {/if} {/block} {block name='product_discounts'} {include file='catalog/_partials/product-discounts.tpl'} {/block} {block name='product_add_to_cart'} {include file='catalog/_partials/product-add-to-cart.tpl'} {/block} {block name='product_additional_info'} {include file='catalog/_partials/product-additional-info.tpl'} {/block} {block name='product_out_of_stock'} {hook h='actionProductOutOfStock' product=$product} {/block} {* Input to refresh product HTML removed, block kept for compatibility with themes *} {block name='product_refresh'}{/block} </form> {/block} </div>{* /product-actions *} </div>{* /col *} </div>{* /row *} {* END OF FIRST PART *} {* SECOND PART - REASSURANCE, TABS *} <div class="row"> <div class="col-lg-6 col-xl-5 order-lg-1"> {block name='hook_display_reassurance'} {hook h='displayReassurance'} {/block} </div> <div class="col-lg-6 col-xl-7"> {block name='product_tabs'} <div class="product__infos accordion accordion-flush" id="product-infos-accordion"> {block name='product_description'} {if $product.description} <div class="info accordion-item" id="description"> <h2 class="info__title accordion-header" id="product-description-heading"> <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#product-description-collapse" aria-expanded="true" aria-controls="product-description-collapse"> {l s='Description' d='Shop.Theme.Catalog'} </button> </h2> <div id="product-description-collapse" class="info__content accordion-collapse collapse show" data-bs-parent="#product-infos-accordion" aria-labelledby="product-description-heading"> <div class="product__description accordion-body rich-text"> {$product.description nofilter} </div> </div> </div> {/if} {/block} {block name='product_details'} {include file='catalog/_partials/product-details.tpl'} {/block} {block name='product_attachments'} {if $product.attachments} <div class="info accordion-item" id="attachments"> <h2 class="info__title accordion-header" id="product-attachments-heading"> <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#product-attachments-collapse" aria-expanded="true" aria-controls="product-attachments-collapse"> {l s='Download' d='Shop.Theme.Actions'} </button> </h2> <div id="product-attachments-collapse" class="info__content accordion-collapse collapse" data-bs-parent="#product-infos-accordion" aria-labelledby="product-attachments-heading"> <div class="product__attachments accordion-body"> {foreach from=$product.attachments item=attachment} <div class="attachment"> <p class="h5"><a href="{url entity='attachment' params=['id_attachment' => $attachment.id_attachment]}">{$attachment.name}</a></p> <p>{$attachment.description}</p> <a href="{url entity='attachment' params=['id_attachment' => $attachment.id_attachment]}"> {l s='Download' d='Shop.Theme.Actions'} ({$attachment.file_size_formatted}) </a> </div> {/foreach} </div> </div> </div> {/if} {/block} {* New collapses for module hooked content *} {foreach from=$product.extraContent item=extra key=extraKey} <div class="info accordion-item" id="extra-{$extraKey}" {foreach $extra.attr as $key => $val} {$key}="{$val}"{/foreach}> <h2 class="info__title accordion-header" id="product-extra{$extraKey}-heading"> <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#product-extra{$extraKey}-collapse" aria-expanded="true" aria-controls="product-extra{$extraKey}-collapse"> {$extra.title} </button> </h2> <div id="product-extra{$extraKey}-collapse" class="info__content accordion-collapse collapse" data-bs-parent="#product-infos-accordion" aria-labelledby="product-extra{$extraKey}-heading"> <div class="accordion-body"> {$extra.content nofilter} </div> </div> </div> {/foreach} </div> {/block} </div>{* /col *} </div>{* /row *} {* END OF SECOND PART *} {block name='product_accessories'} {if $accessories} {include file='catalog/_partials/product-accessories.tpl'} {/if} {/block} {block name='product_footer'} {hook h='displayFooterProduct' product=$product category=$category} {/block} {block name='page_footer_container'} {block name='page_footer'} {/block} {/block} {/block} Link to comment Share on other sites More sharing options...
compsoul.dev Posted July 29 Share Posted July 29 Paste this file catalog/_partials/product-add-to-cart.tpl Link to comment Share on other sites More sharing options...
Xhyper Posted July 29 Author Share Posted July 29 (edited) {** * For the full copyright and license information, please view the LICENSE * file that was distributed with this source code. *} <div class="product__add-to-cart product-add-to-cart js-product-add-to-cart"> {if !$configuration.is_catalog} <div class="mb-3"> {block name='product_availability'} <span id="product-availability" class="product__availability js-product-availability d-flex align-items-center"> {if $product.show_availability && $product.availability_message} {if $product.availability == 'available'} <i class="material-icons rtl-no-flip product-available"></i> {elseif $product.availability == 'last_remaining_items'} <i class="material-icons product-last-items me-2"></i> {else} <i class="material-icons product-unavailable me-2"></i> {/if} {$product.availability_message} {/if} </span> {/block} {block name='product_delivery_times'} {if $product.is_virtual == 0} {if $product.additional_delivery_times == 1} {if $product.delivery_information} <span class="product__delivery__information">{$product.delivery_information}</span> {/if} {elseif $product.additional_delivery_times == 2} {if $product.quantity> 0} <span class="product__delivery__information">{$product.delivery_in_stock}</span> {* Out of stock message should not be displayed if customer can't order the product. *} {elseif $product.quantity <= 0 && $product.add_to_cart_url} <span class="product__delivery__information">{$product.delivery_out_stock}</span> {/if} {/if} {/if} {/block} </div> {block name='product_quantity'} <div class="row g-2"> <div class="product-actions__quantity quantity-button js-quantity-button col-md-auto"> {include file='components/qty-input.tpl' attributes=[ "id" => "quantity_wanted", "class" => "form-control js-quantity-wanted", "value" => "{$product.minimal_quantity}", "min" => "{$product.minimal_quantity}" ] } </div> <div class="product-actions__button add col"> <button class="btn btn-primary btn-with-icon add-to-cart" data-button-action="add-to-cart" type="submit" {if !$product.add_to_cart_url} disabled {/if} > <i class="material-icons me-1" aria-hidden="true"></i> {l s='Add to cart' d='Shop.Theme.Actions'} </button> </div> {hook h='displayProductActions' product=$product} </div> {/block} {block name='product_minimal_quantity'} <p class="product__minimal-quantity product-minimal-quantity js-product-minimal-quantity d-flex align-items-center mt-3 mt-md-0"> {if $product.minimal_quantity> 1} <i class="material-icons me-2" aria-hidden="true"></i> {l s='The minimum purchase order quantity for the product is %quantity%.' d='Shop.Theme.Checkout' sprintf=['%quantity%' => $product.minimal_quantity] } {/if} </p> {/block} {/if} </div> Edited July 29 by Xhyper (see edit history) Link to comment Share on other sites More sharing options...
compsoul.dev Posted July 29 Share Posted July 29 Paste the contents of the file from the path I provided, which you are attaching here: {block name='product_add_to_cart'} {include file='catalog/_partials/product-add-to-cart.tpl'} {/block} Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now