Sorry you are facing this issue, it would be my pleasure to help you.
Welcome to the Shopify community! ![]()
Thanks for your good question.
Please share your site URL,
I will check out the issue and provide you a solution here.
also please share Featured Product Liquid section code
Here is the code
{%- assign product = all_products[section.settings.featured_product] -%}
{% assign current_variant = product.selected_or_first_available_variant %}
{% if product == empty %}
{%- assign section_onboarding = true -%}
{% endif %}
{% if section_onboarding %}
{% include ‘onboard-single-product’ %}
{% else %}
{% assign thumbnail_position = section.settings.thumbnail_position %}
{% assign click_to_enlarge = section.settings.click_to_enlarge %}
{% assign enable_video_looping = section.settings.enable_video_looping %}
{% capture product_gallery_config %}{
“thumbPosition”: {{ section.settings.thumbnail_position | json }},
“thumbsShown”: {{ section.settings.thumbs_to_show | json }},
“enableVideoLooping”: {{ section.settings.enable_video_looping | json }},
“navStyle”: {{ section.settings.slide_controls | json }},
“mainSlider”: {% if product.media.size <= 1 %}false{% else %}true{% endif %},
“thumbSlider”: {% if product.media.size >= 4 %}true{% else %}false{% endif %},
“productId”: {{ product.id | json }},
“isQuick”: false
}{% endcapture %}
{% if section.settings.image_options == ‘static’ %}
{% assign gallery_data = ‘data-static-gallery’ %}
{% assign gallery_type = ‘static’ %}
{% else %}
{% assign gallery_data = ‘data-scroll-gallery’ %}
{% assign gallery_type = ‘scroll’ %}
{% endif %}
{% if product.featured_media and gallery_type == ‘static’ %}
{% include ‘product-static-gallery’ %}
{% elsif product.featured_media and gallery_type == ‘scroll’ %}
{% include ‘product-scroll-gallery’ %}
{% else %}
{% capture current %}{% cycle 1, 2, 3, 4, 5, 6 %}{% endcapture %}
{{ ‘product-’ | append: current | placeholder_svg_tag: ‘placeholder-svg’ }}
{% endif %}
{% unless product.template_suffix == ‘not-for-sale’ %}
{% capture product_form_config %}
{ “money_format”: {{ shop.money_format | json }},
“enable_history”: true,
“sold_out”: {{ “products.product.sold_out” | t | json }},
“button”: {{ ‘products.product.add_to_cart’ | t | json }},
“unavailable”: {{ ‘products.product.unavailable’ | t | json }},
“quickview”: {% if template == ‘product.quick’ %}true{% else %}false{% endif %}
}
{% endcapture %}
{% unless product == empty %}
{% endunless %}
{% schema %}
{
“name”: “Featured product”,
“class”: “index-section”,
“settings”: [
{
“type”: “product”,
“id”: “featured_product”,
“label”: “Product”
},
{
“type”: “text”,
“id”: “heading”,
“label”: “Heading”,
“default”: “Featured Product”
},
{
“type”: “color”,
“id”: “heading_color”,
“label”: “Heading color”,
“default”: “#000”
},
{
“type”:“header”,
“content”:“Media”
},
{
“type”: “checkbox”,
“id”: “click_to_enlarge”,
“label”: “Enable click to enlarge”,
“default”: true
},
{
“type”: “select”,
“id”: “image_section_size”,
“label”: “Gallery size”,
“options”: [
{
“value”: “small”,
“label”: “Small”
},
{
“value”: “medium”,
“label”: “Medium”
},
{
“value”: “large”,
“label”: “Large”
},
{
“value”: “ultra”,
“label”: “Ultra”
}
],
“default”:“medium”
},
{
“type”: “select”,
“id”: “image_options”,
“label”: “Gallery type”,
“options”: [
{
“value”: “static”,
“label”: “Slideshow with thumbnails”
},
{
“value”: “scroll”,
“label”: “Scroll gallery”
}
]
},
{
“type”: “select”,
“id”: “thumbnail_position”,
“label”: “Thumbnail position when gallery w/thumbnails”,
“options”: [
{
“value”: “right”,
“label”: “Right”
},
{
“value”: “left”,
“label”: “Left”
},
{
“value”: “bottom”,
“label”: “Bottom”
}
]
},
{
“type”: “range”,
“id”: “thumbs_to_show”,
“min”: 0,
“max”: 6,
“step”: 1,
“label”: “Thumbnail images to show”,
“default”: 3,
“info”:“Set to 0 to show a slideshow without thumbnails”
},
{
“type”: “select”,
“id”: “slide_controls”,
“label”: “Slider control style”,
“default”: “arrows”,
“options”: [
{
“value”: “arrows”,
“label”: “Arrows”
},
{
“value”: “dots”,
“label”: “Dots”
}
]
},
{
“type”: “checkbox”,
“id”: “enable_video_looping”,
“label”: “Enable video looping”,
“default”: false
},
{
“type”: “paragraph”,
“content”: “Learn more about [Media types](https://help.shopify.com/en/manual/products/product-media)”
},
{
“type”:“header”,
“content”:“Form options”
},
{
“type”: “color”,
“id”:“description_background”,
“label”:“Form background color”
},
{
“type”: “checkbox”,
“id”: “show_vendor”,
“label”: “Show vendor”
},
{
“type”: “checkbox”,
“id”: “show_sku”,
“label”: “Show variant SKU”,
“default”: true
},
{
“type”: “checkbox”,
“id”: “show_quantity_selector”,
“label”: “Show quantity selector”,
“default”: true
},
{
“type”: “select”,
“id”: “product_variants”,
“label”: “Product variant display”,
“options”: [
{
“value”: “swatches”,
“label”: “Swatches”
},
{
“value”: “drop-downs”,
“label”: “Drop-downs”
}
],
“default”: “swatches”
},
{
“type”: “select”,
“id”: “color_swatch_options”,
“label”: “Color swatch style”,
“options”: [
{
“value”: “default-color”,
“label”: “Default color”
},
{
“value”: “custom-image”,
“label”: “Custom uploaded images”
},
{
“value”: “variant-image”,
“label”: “Zoomed in variant images”
}
],
“default”: “default-color”,
“info”: “Learn more about color swatch styles”
},
{
“type”: “checkbox”,
“id”: “show_payment_button”,
“label”: “Show dynamic checkout button”,
“info”: “Lets customers check out directly using a familiar payment method. Learn more”,
“default”: true
},
{
“type”: “checkbox”,
“id”: “show_social_share”,
“label”: “Show social share icons”,
“default”: true
}
],
“presets”: [
{
“name”: “Featured product”,
“category”: “Product”
}
]
}
{% endschema %}
I’m facing also the mobile navigation menu problem on side… it won’t show the menu on side on the Home Page on the mobile navigation…on desktop it works though.
Hi @oowe ,
I checked and it is getting html error by your product description display code: https://i.imgur.com/yYfb7yr.png
So you can remove the description or change the code as follows:
{% if product.description contains '[#' %}
{{ product.description | split: '[#' | first | truncatewords: 50 }}
{% else %}
{{ product.description | split: '' | first | truncatewords: 50 }}
{% endif %}
=>
{% if product.description contains '[#' %}
{{ product.description | split: '[#' | first | strip_html | truncatewords: 50 }}
{% else %}
{{ product.description | split: '' | first | strip_html | truncatewords: 50 }}
{% endif %}
It will remove the html tags and make the truncatewords function work well.
Hope it helps!
OMG that just solved everything, you can’t even imagine I’ve been trying to solve for days and you did it right away. Thank you so so much!

