How to add the product option on collection page

Retired Boards Appdev Store Design
5

Theme Shopify Dawn

Problems analysis and solved : how i clone the theme feature from the featured production section. create an new snippets theme/snippest/sm-feature-clone.liquid same code coped from the theme/section/featured-product.liquid

Output :

AvidBrio_0-1640067326106.png
AvidBrio_0-1640067326106.png1667×910 137 KB

list of change change the collection list section "main-collection-product-grid.liquid " line number 41

Replace the code line " {% render ‘product-card’, " with " {% render ‘sm-feature-clone’, "

{%- for product in collection.products -%}
 
         

          - {% render 'sm-feature-clone',
              product_card_product: product,
                media_size: section.settings.image_ratio,
                show_secondary_image: section.settings.show_secondary_image,
                add_image_padding: section.settings.add_image_padding,
                show_vendor: section.settings.show_vendor,
                show_image_outline: section.settings.show_image_outline,
                show_rating: section.settings.show_rating
              %}

            

            {%- endfor -%}

make change into the “theme/snippest/sm-feature-clone.liquid”
*** find and replace with section.id with product_card_product.id ****

Full code solution theme/snippest/sm-feature-clone.liquid

{{ 'section-main-product.css' | asset_url | stylesheet_tag }}
{{ 'section-featured-product.css' | asset_url | stylesheet_tag }}
{{ 'component-accordion.css' | asset_url | stylesheet_tag }}
{{ 'component-price.css' | asset_url | stylesheet_tag }}
{{ 'component-rte.css' | asset_url | stylesheet_tag }}
{{ 'component-loading-overlay.css' | asset_url | stylesheet_tag }}

{%- comment -%} {%- endcomment -%}
{%- assign product = product_card_product -%}
   
{%- assign first_3d_model = product.media | where: "media_type", "model" | first -%}
{%- if first_3d_model -%}
  {{ 'component-product-model.css' | asset_url | stylesheet_tag }}
  
  
{%- endif -%}

{%- if first_3d_model -%}
  
  
{%- endif -%}

{%- liquid
  if product.selected_or_first_available_variant.featured_media
    assign seo_media = product.selected_or_first_available_variant.featured_media
  else
    assign seo_media = product.featured_media
  endif
-%}