Move view all button to under collection list title on home page (debut theme)

Solved
Timito
Pathfinder
91 1 37

Hi, website is sneakersafe.co.uk

On the homepage, I'd like to move 'view all' button to under the title instead. Also if possible would like to change it to underline and no border, example below

Thanks

 

Screenshot_20210614-042839_Chrome.jpg

 

 

KetanKumar
Shopify Partner
20651 2142 7822

@Timito 

Yes, please share feature collection product section code so i will update code 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
Timito
Pathfinder
91 1 37

It’s for all featured collections on homepage if possible

KetanKumar
Shopify Partner
20651 2142 7822

@Timito 

Yes, please sent code here...

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
Timito
Pathfinder
91 1 37

@KetanKumar is it collection-grid-item.liquid?

{% comment %}
    Renders a list of products from a collection

    Accepts:
    - collection: {Object} Collection Liquid object (required)

    Usage:
    {% include 'collection-grid-item', collection: collection %}
{% endcomment %}
{% if collection.image %}
  {%- assign collection_image = collection.image -%}
{% elsif collection.products.first and collection.products.first.media != empty %}
  {%- assign collection_image = collection.products.first.featured_media.preview_image -%}
{% else %}
  {% assign collection_image = blank %}
{% endif %}

<div class="collection-grid-item">
  <a href="{% if collection.products == empty %}#{% else %}{{ collection.url }}{% endif %}" class="collection-grid-item__link">
    {% unless collection_image == blank %}
      <div class="collection-grid-item__overlay box ratio-container lazyload js"
        data-bgset="{% include 'bgset', image: collection_image %}"
        data-sizes="auto"
        data-parent-fit="cover"
        data-image-loading-animation>
      </div>
      <noscript>
        <div class="collection-grid-item__overlay" style="background-image: url('{{ collection_image | img_url: '1024x1024' }}')"></div>
      </noscript>
    {% else %}
      {% if collection == empty %}
        <div class="collection-grid-item__overlay">
          {% capture current %}{% cycle 1, 2, 3 %}{% endcapture %}
          {{ 'collection-' | append: current | placeholder_svg_tag: 'placeholder-svg' }}
        </div>
      {% else %}
        <div class="collection-grid-item__overlay" style="background-image: url('{{ collection_image | img_url: '1024x1024' }}')"></div>
      {% endif %}
    {% endunless %}

    <div class="collection-grid-item__title-wrapper">
      <div class="collection-grid-item__title h3">
        {% if collection.title == blank %}
          {{ 'homepage.onboarding.collection_title' | t }}
        {% else %}
          {{ collection.title }}
        {% endif %}
      </div>
    </div>
  </a>
</div>

 

 

KetanKumar
Shopify Partner
20651 2142 7822

@Timito 

thanks for code bt sorry its wrong code can you please share feature collection section code 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
Timito
Pathfinder
91 1 37

@KetanKumar I cannot find it sorry what is the code section called

KetanKumar
Shopify Partner
20651 2142 7822

@Timito 

Partners: Requests for staff access when providing assistance is not appropriate. Guidance should be provided within the topic if possible, and if access is required the collaboration feature detailed in this blog post should be used over requesting staff access: The Shopify Collaborator Account: What You Need to Know

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
KetanKumar
Shopify Partner
20651 2142 7822

@Timito 

do you need help? or fixed!

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
Timito
Pathfinder
91 1 37

Is it collection.liquid? @KetanKumar 

<div class="page-width">
  {% if section.settings.title != blank %}
    <div class="section-header text-center">
      <h2>{{ section.settings.title | escape }}</h2>
    </div>
  {% endif %}

  {%- assign collection = collections[section.settings.collection] -%}

  {% case section.settings.grid %}
    {% when 2 %}
      {%- assign max_height = 530 -%}
      {%- assign grid_item_width = 'medium-up--one-third' -%}
    {% when 3 %}
      {%- assign max_height = 345 -%}
      {%- assign grid_item_width = 'small--one-half medium-up--one-third' -%}
    {% when 4 %}
      {%- assign max_height = 250 -%}
      {%- assign grid_item_width = 'small--one-half medium-up--one-quarter' -%}
    {% when 5 %}
      {%- assign max_height = 195 -%}
      {%- assign grid_item_width = 'small--one-half medium-up--one-fifth' -%}
  {% endcase %}

  {%- assign product_limit = section.settings.grid | times: section.settings.rows -%}

  <ul data-sectionId="{% if section.id %}{{section.id}}{% endif %}" data-settings='{% if section.settings %}{{section.settings | json}}{% endif %}' id="gf-products" class="grid grid--uniform grid--view-items">
    {% for product in collection.products limit: product_limit %}
      <li class="grid__item grid__item--{{section.id}} {{ grid_item_width }}">
        {% include 'product-card-grid', max_height: max_height, product: product, show_vendor: section.settings.show_vendor %}
      </li>
    {% else %}

      {% for i in (1..product_limit) %}
        <li class="grid__item grid__item--{{section.id}} {{ grid_item_width }}">
          <div class="grid-view-item product-card">
            <a class="grid-view-item__link grid-view-item__image-container full-width-link" href="#">
              <span class="visually-hidden">{{ 'homepage.onboarding.product_title' | t }}</span>
            </a>
            <div class="grid-view-item__image-wrapper">
              {% capture current %}{% cycle 1, 2, 3, 4, 5, 6 %}{% endcapture %}
              {{ 'product-' | append: current | placeholder_svg_tag: 'placeholder-svg' }}
            </div>
            <div class="h4 grid-view-item__title" aria-hidden="true">{{ 'homepage.onboarding.product_title' | t }}</div>
            {% include 'product-price' %}
          </div>
        </li>
      {% endfor %}
    {% endfor %}
  </ul>

  {% if section.settings.show_view_all %}
    <hr class="hr--invisible" aria-hidden="true" />
    <div class="text-center">
      <a href="{{ collection.url }}" class="btn" aria-label="{{ 'collections.general.view_all_label' | t: collection_name: collection.title }}">
        {{ 'collections.general.view_all' | t }}
      </a>
    </div>
  {% endif %}

</div>



{% schema %}
{
  "name": {
    "cs": "Propagovaná kolekce",
    "da": "Udvalgt kollektion",
    "de": "Vorgestellte Kategorie",
    "en": "Featured collection",
    "es": "Colección destacada",
    "fi": "Esittelyssä oleva kokoelma",
    "fr": "Collection en vedette",
    "it": "Collezione in evidenza",
    "ja": "特集コレクション",
    "ko": "추천 컬렉션",
    "nb": "Utvalgt samling",
    "nl": "Uitgelichte collectie",
    "pl": "Polecana kolekcja",
    "pt-BR": "Coleção em destaque",
    "pt-PT": "Coleção em destaque",
    "sv": "Utvald kollektion",
    "th": "คอลเลกชันแนะนำ",
    "tr": "Öne çıkan koleksiyon",
    "vi": "Bộ sưu tập nổi bật",
    "zh-CN": "特色产品系列",
    "zh-TW": "精選商品系列"
  },
  "class": "index-section",
  "settings": [
    {
      "type": "text",
      "id": "title",
      "label": {
        "cs": "Nadpis",
        "da": "Overskrift",
        "de": "Titel",
        "en": "Heading",
        "es": "Título",
        "fi": "Otsake",
        "fr": "En-tête",
        "it": "Heading",
        "ja": "見出し",
        "ko": "제목",
        "nb": "Overskrift",
        "nl": "Kop",
        "pl": "Nagłówek",
        "pt-BR": "Título",
        "pt-PT": "Título",
        "sv": "Rubrik",
        "th": "ส่วนหัว",
        "tr": "Başlık",
        "vi": "Tiêu đề",
        "zh-CN": "标题",
        "zh-TW": "標題"
      },
      "default": {
        "cs": "Propagovaná kolekce",
        "da": "Udvalgt kollektion",
        "de": "Vorgestellte Kategorie",
        "en": "Featured collection",
        "es": "Colección destacada",
        "fi": "Esittelyssä oleva kokoelma",
        "fr": "Collection en vedette",
        "it": "Collezione in evidenza",
        "ja": "特集コレクション",
        "ko": "추천 컬렉션",
        "nb": "Fremhevet samling",
        "nl": "Uitgelichte collectie",
        "pl": "Polecana kolekcja",
        "pt-BR": "Coleção em destaque",
        "pt-PT": "Coleção em destaque",
        "sv": "Utvald kollektion",
        "th": "คอลเลกชันแนะนำ",
        "tr": "Öne çıkan koleksiyon",
        "vi": "Bộ sưu tập nổi bật",
        "zh-CN": "特色产品系列",
        "zh-TW": "精選商品系列"
      }
    },
    {
      "id": "collection",
      "type": "collection",
      "label": {
        "cs": "Kolekce",
        "da": "Kollektion",
        "de": "Kategorie",
        "en": "Collection",
        "es": "Colección",
        "fi": "Kokoelma",
        "fr": "Collection",
        "it": "Collezione",
        "ja": "コレクション",
        "ko": "컬렉션",
        "nb": "Samling",
        "nl": "Collectie",
        "pl": "Kolekcja",
        "pt-BR": "Coleção",
        "pt-PT": "Coleção",
        "sv": "Produktserie",
        "th": "คอลเลกชัน",
        "tr": "Koleksiyon",
        "vi": "Bộ sưu tập",
        "zh-CN": "收藏",
        "zh-TW": "商品系列"
      }
    },
    {
      "type": "range",
      "id": "grid",
      "label": {
        "cs": "Počet produktů na řádek",
        "da": "Produkter pr. række",
        "de": "Produkte per Reihe",
        "en": "Products per row",
        "es": "Productos por fila",
        "fi": "Tuotteita per rivi",
        "fr": "Produits par rangée",
        "it": "Prodotti per riga",
        "ja": "行あたりの商品数",
        "ko": "열 별 제품",
        "nb": "Produkter per rad",
        "nl": "Producten per rij",
        "pl": "Liczba produktów na wiersz",
        "pt-BR": "Produtos por linha",
        "pt-PT": "Produtos por linha",
        "sv": "Produkter per rad",
        "th": "สินค้าต่อแถว",
        "tr": "Satır başına ürün",
        "vi": "Số sản phẩm trên một hàng",
        "zh-CN": "每行产品数",
        "zh-TW": "每列產品數"
      },
      "min": 2,
      "max": 5,
      "step": 1,
      "default": 3
    },
    {
      "type": "range",
      "id": "rows",
      "label": {
        "cs": "Řádky",
        "da": "Rækker",
        "de": "Reihen",
        "en": "Rows",
        "es": "Filas",
        "fi": "Rivit",
        "fr": "Rangées",
        "it": "Righe",
        "ja": "行",
        "ko": "열",
        "nb": "Rader",
        "nl": "Rijen",
        "pl": "Wiersze",
        "pt-BR": "Linhas",
        "pt-PT": "Linhas",
        "sv": "Rader",
        "th": "แถว",
        "tr": "Satırlar",
        "vi": "Hàng",
        "zh-CN": "行数",
        "zh-TW": "列"
      },
      "min": 1,
      "max": 5,
      "step": 1,
      "default": 2
    },
    {
      "type": "checkbox",
      "id": "show_vendor",
      "label": {
        "cs": "Zobrazit dodavatele produktů",
        "da": "Vis produktleverandører",
        "de": "Produktanbieter anzeigen",
        "en": "Show product vendors",
        "es": "Mostrar proveedores del producto",
        "fi": "Näytä tuotteen myyjät",
        "fr": "Afficher les vendeurs",
        "it": "Mostra fornitori prodotto",
        "ja": "商品の販売元を表示する",
        "ko": "제품 공급 업체 표시",
        "nb": "Vis produktleverandører",
        "nl": "Productleveranciers weergeven",
        "pl": "Pokaż dostawców produktu",
        "pt-BR": "Exibir fornecedores do produto",
        "pt-PT": "Mostrar fornecedores do produto",
        "sv": "Visa produktleverantörer",
        "th": "แสดงผู้ขายสินค้า",
        "tr": "Ürün satıcılarını göster",
        "vi": "Hiển thị nhà cung cấp sản phẩm",
        "zh-CN": "显示产品厂商",
        "zh-TW": "顯示產品廠商"
      },
      "default": false
    },
    {
      "type": "checkbox",
      "id": "show_view_all",
      "label": {
        "cs": "Zobrazit tlačítko Zobrazit vše",
        "da": "Vis knappen \"Se flere\"",
        "de": "'Alle anzeigen' Button anzeigen",
        "en": "Show 'View all' button",
        "es": "Mostrar el botón 'Ver todo'",
        "fi": "Näytä \"Näytä kaikki\" -painike",
        "fr": "Afficher le bouton “Tout voir”",
        "it": "Mostra il pulsante \"Visualizza tutto\"",
        "ja": "「すべて表示」ボタンを表示する",
        "ko": "'모두 보기' 버튼 표시",
        "nb": "Vis «Se alle»-knapp",
        "nl": "Knop 'Alles weergeven' weergeven",
        "pl": "Pokaż przycisk „Wyświetl wszystkie”",
        "pt-BR": "Exibir botão 'Visualizar tudo'",
        "pt-PT": "Mostrar botão 'Ver tudo'",
        "sv": "Visa \"Visa alla\"-knappen",
        "th": "แสดงปุ่ม 'ดูทั้งหมด'",
        "tr": "\"Tümünü görüntüle\" düğmesini göster",
        "vi": "Hiển thị nút \"Xem tất cả\"",
        "zh-CN": "显示“查看全部”按钮",
        "zh-TW": "顯示「檢視全部」按鈕"
      },
      "default": false
    }
  ],
  "presets": [
    {
      "name": {
        "cs": "Propagovaná kolekce",
        "da": "Udvalgt kollektion",
        "de": "Vorgestellte Kategorie",
        "en": "Featured collection",
        "es": "Colección destacada",
        "fi": "Esittelyssä oleva kokoelma",
        "fr": "Collection en vedette",
        "it": "Collezione in evidenza",
        "ja": "特集コレクション",
        "ko": "추천 컬렉션",
        "nb": "Utvalgt samling",
        "nl": "Uitgelichte collectie",
        "pl": "Polecana kolekcja",
        "pt-BR": "Coleção em destaque",
        "pt-PT": "Coleção em destaque",
        "sv": "Utvald kollektion",
        "th": "คอลเลกชันแนะนำ",
        "tr": "Öne çıkan koleksiyon",
        "vi": "Bộ sưu tập nổi bật",
        "zh-CN": "特色产品系列",
        "zh-TW": "精選商品系列"
      },
      "category": {
        "cs": "Kolekce",
        "da": "Kollektion",
        "de": "Kategorie",
        "en": "Collection",
        "es": "Colección",
        "fi": "Kokoelma",
        "fr": "Collection",
        "it": "Collezione",
        "ja": "コレクション",
        "ko": "컬렉션",
        "nb": "Samling",
        "nl": "Collectie",
        "pl": "Kolekcja",
        "pt-BR": "Coleção",
        "pt-PT": "Coleção",
        "sv": "Produktserie",
        "th": "คอลเลกชัน",
        "tr": "Koleksiyon",
        "vi": "Bộ sưu tập",
        "zh-CN": "收藏",
        "zh-TW": "商品系列"
      }
    }
  ]
}
{% endschema %}