can anyone solve this?

Solved

can anyone solve this?

Emiway
Pathfinder
220 0 44

this is for breadcrumb.. i had added code in snippet & section should i share those?? 

URL: https://es04e0amvz2qadma-56620318792.shopifypreview.com

Screenshot 2024-09-28 104531.png

Accepted Solution (1)
BSSCommerce-HDL
Shopify Partner
2303 847 1062

This is an accepted solution.

Hi @Emiway

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above </head> tag:

<style>
span.sf__breadcrumb-separator svg {
    height: 10px !important;
    width: 20px !important;
}
</style>

 Here is result: 

BSSCommerceHDL_0-1727506387977.png

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

Sale banner, pop ups: Customize your sale banner, pop-ups and create countdown bar to boost conversion rate.
Simicart: Transform your Shopify store into a stunning and fully functional mobile app with just a few simple steps.
Product Labels & Badges:
Get more sales with striking labels, badges, and banners from our 10,000+ available templates.

BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

View solution in original post

Replies 4 (4)

BSSCommerce-HDL
Shopify Partner
2303 847 1062

Hi @Emiway

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search folder snippets -> Add a new snippets

BSSCommerceHDL_0-1727501611817.png

Step 3: Put name is "breadcrumb"

BSSCommerceHDL_1-1727501734346.png

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

 

Sale banner, pop ups: Customize your sale banner, pop-ups and create countdown bar to boost conversion rate.
Simicart: Transform your Shopify store into a stunning and fully functional mobile app with just a few simple steps.
Product Labels & Badges:
Get more sales with striking labels, badges, and banners from our 10,000+ available templates.

BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

Emiway
Pathfinder
220 0 44

i had already added it Checkout

 

<!-- /snippets/breadcrumb.liquid -->
{% comment %}
Documentation - http://docs.shopify.com/support/your-website/navigation/creating-a-breadcrumb-navigation
{% endcomment %}

{%- capture separator -%}
<span aria-hidden="true" class="sf__breadcrumb-separator py-2">
<svg class="w-[12px] h-[12px]" fill="currentColor" stroke="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 512"><path d="M17.525 36.465l-7.071 7.07c-4.686 4.686-4.686 12.284 0 16.971L205.947 256 10.454 451.494c-4.686 4.686-4.686 12.284 0 16.971l7.071 7.07c4.686 4.686 12.284 4.686 16.97 0l211.051-211.05c4.686-4.686 4.686-12.284 0-16.971L34.495 36.465c-4.686-4.687-12.284-4.687-16.97 0z"/></svg>
</span>
{%- endcapture -%}

{%- capture home -%}
<a href="{{ routes.root_url }}" class="bread-crumb__item" title="{{ 'general.breadcrumbs.home_link_title' | t }}">
{{ 'general.breadcrumbs.home' | t }}
</a>
{%- endcapture -%}

{% if container == nil %}
{% assign container = 'container-fluid' %}
{% endif %}

{% unless template == 'index' %}
<nav
class="sf-breadcrumb w-full {{ class }}{% if container == 'w-full' %} px-4{% endif %}"
role="navigation"
aria-label="breadcrumbs"
>
<div class="{{ container }}">
<div class="flex -mx-4 items-center justify-{{ justify | default: 'start' }}"
>
{% unless template.name == 'product' %}
{{ home }}
{% endunless %}

{% if template.name == 'product' %}
<div class="sf-breadcrumb__nav flex items-center">
{{ home }}
{% liquid
assign current_collection = null
if collection
assign current_collection = collection
elsif product and product.collections.size > 0
assign current_collection = product.collections.first
endif
%}
{% if current_collection %}
{{ separator }}
{% if current_collection.handle %}
{% capture url %}/collections/{{ current_collection.handle }}{% endcapture %}
<a href="{{ url }}" class="bread-crumb__item">{{ current_collection.title }}</a>
{% endif %}
{% endif %}
{% unless hide_current == true %}
{{ separator }}
<span class="sf__breabcrumb-page-title p-4">{{ product.title }}</span>
{% endunless %}
</div>
{% elsif template.name == 'collection' and collection.handle %}

{{ separator }}
{% if current_tags %}
{% capture url %}/collections/{{ collection.handle }}{% endcapture %}
<a href="{{ url }}" class="bread-crumb__item">{{ collection.title }}</a>
{{ separator }}
<span class="p-4">{{ current_tags | join: " + " }}</span>
{% else %}
<span class="p-4">{{ collection.title }}</span>
{% endif %}

{% elsif template.name == 'blog' %}

{{ separator }}
{% if current_tags %}
<a href="{{ blog.url }}" class="bread-crumb__item">{{ blog.title }}</a>
{{ separator }}
<span class="p-4">{{ current_tags | join: " + " }}</span>
{% else %}
<span class="sf__breabcrumb-page-title p-4">{{ blog.title }}</span>
{% endif %}

{% elsif template == 'article' %}

{{ separator }}
<a href="{{ blog.url }}" class="bread-crumb__item">{{ blog.title }}</a>

{% elsif template == "customers/addresses" %}

{{ separator }}
<a href="{{ routes.account_url }}" class="bread-crumb__item">{{ 'customer.account.page_title' | t }}</a>
{{ separator }}
<span class="sf__breabcrumb-page-title p-4">{{ page_title }}</span>

{% elsif template contains 'page' %}

{{ separator }}
<span class="sf__breabcrumb-page-title p-4">{{ page.title }}</span>

{% elsif template contains 'search' %}
{{ separator }}
<span class="sf__breabcrumb-page-title p-4">{{ 'general.search.heading' | t: count: search.results_count, terms: search.terms }}</span>

{% else %}

{{ separator }}
<span class="sf__breabcrumb-page-title p-4">{{ page_title }}</span>

{% endif %}
</div>
</div>
</nav>
{% endunless %}

BSSCommerce-HDL
Shopify Partner
2303 847 1062

This is an accepted solution.

Hi @Emiway

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above </head> tag:

<style>
span.sf__breadcrumb-separator svg {
    height: 10px !important;
    width: 20px !important;
}
</style>

 Here is result: 

BSSCommerceHDL_0-1727506387977.png

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

Sale banner, pop ups: Customize your sale banner, pop-ups and create countdown bar to boost conversion rate.
Simicart: Transform your Shopify store into a stunning and fully functional mobile app with just a few simple steps.
Product Labels & Badges:
Get more sales with striking labels, badges, and banners from our 10,000+ available templates.

BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

Sangeetanahar
Explorer
541 36 69

hello @Emiway 

Go to online store ----> themes ----> actions ----> edit code ---->assets ----theme.css...> add the code end of the file

.flex.-mx-4.items-center.justify-left {
    display: none;
}

Backpacks-09-28-2024_11_33_AM.png

If this was helpful, hit the like button and accept the solution.
Thanks

 

Was I helpful?

Buy me a coffee



Want to modify or custom changes or bug fix on store . Or Need help with your store? Or -Want Complete Storefront
Email me [email protected] - Skype: live:sangeetarahuldhiman -Whatsapp: +917009811712
Checkout Some Free Sections Here