New Shopify Certification now available: Liquid Storefronts for Theme Developers

1 Product with 3 URL Issue

pradeepsingh89
Visitor
2 0 0

Hi All

I need some help,

I am working on a Shopify project, there are URL issues showing. I need 1 product 1 URL. but it's showing 1 product 3 URL. 

 

https://www.lanternmoon.com/collections/storage/products/meadow-bags
https://www.lanternmoon.com/products/meadow-bags
https://www.lanternmoon.com/collections/bags/products/meadow-bags

 

i am using Flow thems

i have update Product grid item liquid file. but not help

---------------- product-grid-item.liquid ---- ----


{% comment %}
Set the default grid_item_width if no variable is set
{% endcomment %}

{% case section.settings.items_per_row %}
{% when 2 %}
{% capture grid_item_width %}large--one-half medium--one-half small--one-half{% endcapture %}
{% when 3 %}
{% capture grid_item_width %}large--one-third medium--one-half small--one-whole{% endcapture %}
{% when 4 %}
{% capture grid_item_width %}large--one-quarter medium--one-half small--one-half{% endcapture %}
{% when 5 %}
{% capture grid_item_width %}large--one-fifth medium--one-half small--one-half{% endcapture %}
{% endcase %}

{% assign image_stretch = false %}

{% assign crop_setting = settings.product-grid %}
{% if crop_setting == "square" %}
{% assign image_crop = "aspect-ratio--square" %}
{% assign image_stretch = true %}
{% elsif crop_setting == "tall" %}
{% assign image_crop = "aspect-ratio--tall" %}
{% assign image_stretch = true %}
{% elsif crop_setting == "wide" %}
{% assign image_crop = "aspect-ratio--wide" %}
{% assign image_stretch = true %}
{% else %}
{% assign image_crop = false %}
{% assign image_stretch = false %}
{% endif %}

<div class="grid__item {{ grid_item_width }}">

<div class="grid-view-item">
<div class="grid-view-item-image">

{% comment %}
Link to your product with the 'within: collection' filter for the link to be aware of the collection.
This allows you to create collection-based navigation on the product page.

Results of using 'within: collection':
- Instead of a URL with /products/product-handle
you would get /collections/collection-handle/products/product-handle

For more info on navigation within a collection
- http://docs.shopify.com/support/your-store/collections/how-to-navigate-within-a-collection

{% endcomment %}

{% if section.settings.hover-effect and product.media.size > 1 %}
<div class="reveal">
{% endif %}

<a href="{{ product.url }}" class="grid__image" tabindex="-1">
{% if image_crop %}<div class="aspect-ratio {{ image_crop }}">{% endif %}
{% assign image = product.media[0].preview_image %}
{% capture props %}
style="max-width: {{ image.width }}px"
{% endcapture %}
{% assign image_alt = image.alt | default: product.title %}
{% render 'responsive-image' with image, alt: image_alt | escape, props: props, allow_stretch: image_stretch %}

{% if section.settings.hover-effect and product.media.size > 1 %}
<div class="hidden">
{% assign image = product.media[1].preview_image %}
{% capture props %}
style="max-width: {{ image.width }}px"
{% endcapture %}
{% assign hover_alt = image.alt | default: product.title %}
{% render 'responsive-image' with image, alt: hover_alt | escape, props: props %}
</div>
{% endif %}

{% if image_crop %}</div>{% endif %}
</a>

{% if section.settings.hover-effect and product.media.size > 1 %}
</div>
{% endif %}

</div>

<div class="grid-view-item--desc-wrapper">
<div class="product-grid--title">
<a href="{{ product.url }}">{{ product.title }}</a>
</div>
<div class="product-grid--price">
{%- render 'product-grid-item-price', product: product, collection: collection -%}
</div>
</div>


<div class="quick-add-wrapper{% if product.variants.size == 1 %} is-singular{% endif %}">
{% if product.variants.size > 1 and product.available %}
<a class="quick-add-button-variants" tabindex="0" href="{{ product.url }}">{{ 'products.product.view_options' | t }}</a>
{% elsif product.available %}
{% form 'product', product, id: "CollectionAddToCartForm" %}
<input type="hidden" name="id" value="{{ product.variants.first.id }}" />
<button class="quick-add-button" type="submit" tabindex="0">{{ 'products.product.add_to_cart' | t }}</button>
{% endform %}
{% else %}
<a class="sold-out-button" tabindex="0" href="{{ product.url }}">{{ 'products.product.sold_out' | t }}</a>
{% endif %}
</div>

{% if enable_badges %}
{% if product.compare_at_price_max > product.price and product.available %}
<div class="sale-badge badge">{{ 'products.product.on_sale' | t }}</div>
{% endif %}

{% unless product.available %}
<div class="sold-out-badge badge">{{ 'products.product.sold_out' | t }}</div>
{% endunless %}
{% endif %}

</div>

</div>

 

 

Reply 1 (1)
ThomasBorowski
Shopify Expert
803 71 237

Every product will have its canonical URL at /products/product-handle and then one URL for each collection its in at /collections/collection-handle/products/product-handle. That's how it works and there is no downside, because the collection URLs all have the canonical HTML tag pointing to the product's canonical URL.

★ Smart Upgrades, Tips and Tutorials for Shopify themes: cartpunk.com
Did my solution work? Help other Community members easily find the correct solution and apply it to their own stores by marking it as the Accepted Solution and giving it a Thumbs Up