Home Forums Themes Support Claue-Shopify Products related strange image size

Topic Resolution: Resolved

This topic contains 1 reply, has 2 voices, and was last updated by  Harry 2 months, 3 weeks ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #23133

    Hello, i have a problem with the featured product pictures. The images are very small and on the demo the images are normal.

    Can you help me please, thanks in advance 🙂

    #23153

    Hi Guigui,

    Please add below code to Theme Cusomize > Theme Settings > Custom Code > Custom CSS

    .slick-list {width: 100%;}

    And replace code in sections > product-related.liquid with below code

    {% if section.settings.show_related_products == true %}
    <div class="mb__60 related-products" data-section-id="{{ section.id }}" data-section-type="product-related" data-enable-history-state="true">
    	{%- assign container = section.settings.full_width -%}
    	{% assign number_of_related_products_per_row = section.settings.related_grid_num | plus: 0 %}
    	{% assign heading = section.settings.related_title %}
    	{% assign same_vendor = false %}
    	{% assign same_type = false %}
    	{% assign counter = 0 %}
    
    	{% assign exclusions = 'frontpage,all' | split: ',' %}
    
    	{% if product.metafields.c_f['Related Products'] %}
    		{% assign collection = collections[product.metafields.c_f['Related Products']] %}
    	{% endif %}
    
    	{% assign found_a_collection = false %}
    	{% if collection and collection.all_products_count > 1 %}
    		{% unless exclusions contains collection.handle %}
    			{% assign found_a_collection = true %}
    		{% endunless %}
    	{% endif %}
    	{% unless found_a_collection %}
    		{% for c in product.collections %}
    			{% unless exclusions contains c.handle or c.all_products_count < 2 %}
    				{% assign found_a_collection = true %}
    				{% assign collection = c %}
    				{% break %}
    			{% endunless %}
    		{% endfor %}
    	{% endunless %}
    
    	{% if found_a_collection %}
    
    		{% assign current_product = product %}
    		
    		{% capture related_items %}
    			{% for product in collection.products %}
    				{% unless product.handle == current_product.handle %}
    					{% unless same_vendor and current_product.vendor != product.vendor %}
    						{% unless same_type and current_product.type != product.type %}
    							{% assign counter = forloop.length | minus: 1 %}
    							<div class="jas-col-xs-12">
    								{% include 'product-grid-item' %}
    							</div>
    						{% endunless %}
    					{% endunless %}
    				{% endunless %}
    			{% endfor %}
    		{% endcapture %}
    
    		{% assign related_items = related_items | trim %}
    
    		{% unless related_items == blank %}
    			{% capture slick %}
    				data-slick='{"slidesToShow": {{ number_of_related_products_per_row }}, "slidesToScroll": {{ number_of_related_products_per_row }}, "dots": true, "arrows": false, {% if settings.enable_rtl %}"rtl": true, {% endif %}"responsive":[{"breakpoint": 1024,"settings":{"slidesToShow": 3, "slidesToScroll": 3}}, {"breakpoint": 569,"settings":{"slidesToShow": 2, "slidesToScroll": 2}}]}'
    			{% endcapture %}
    			{% assign slick_class = ' slick' %}
    			{% unless container %}<div class="jas-container">{% endunless %}
    				{% unless heading == blank %}
    					<div class="section-header center-xs">
    						<h2 class="pr dib fs__24 mg__0 fs__14">{{ heading }}</h1>
    					</div>
    				{% endunless %}
    				<div class="jas-row{{ slick_class }}" {{ slick }}>
    					{{ related_items }}
    				</div>
    			{% unless container %}</div>{% endunless %}
    		{% endunless %}
    	{% endif %}
      
    </div>
    {% endif %}
    
    {% schema %}
    	{
    		"name": "Related products",
    		"settings": [
    			{
    				"type": "checkbox",
    				"id": "show_related_products",
    				"label": "Show related products",
    				"default": false
    			},
    			{
    				"type": "checkbox",
    				"id": "full_width",
    				"label": "Full width section?"
    			},
    			{
    				"id": "related_title",
    				"type": "text",
    				"label": "Section title",
    				"default": "Other fine products"
    			},
    			{
    				"type": "select",
    				"id": "related_grid_num",
    				"label": "Products per row",
    				"default": "4",
    				"options": [
    					{
    						"value": "2",
    						"label": "2"
    					},
    					{
    						"value": "3",
    						"label": "3"
    					},
    					{
    						"value": "4",
    						"label": "4"
    					},
    					{
    						"value": "6",
    						"label": "6"
    					}
    				]
    			}
    		]
    	}
    {% endschema %}

    Best regards

    Harry
    Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.