Liquid、JavaScriptなどに関する質問
現在、コレクションページの商品一覧に、商品名が表示されない状態になっています。
他のページでは表示されるのですが、コレクションページのみ表示されません。テーマはNarrativeです。
改善方法など教えていただきたいです。
以下、コレクションページのコードとなります。箇所が違いましたら、ご指摘ください。
よろしくお願いいたします。
{%- assign limit = section.settings.products | times: section.settings.rows -%}
{%- assign totalProducts = collection.products.size -%}
<div class="collection-template" data-section-id="{{ section.id }}" data-section-type="collection-template">
{% paginate collection.products by limit %}
{% if section.settings.collection_hero_image and collection.image %}
<div class="section-header-image-wrapper">
<div class="section-header-image{% if section.settings.collection_hero_image_parallax %} section-header-image--parallax{% endif %} lazyload" data-bgset="{% include 'bgset', image: collection.image %}"></div>
<noscript>
<div class="section-header-image" style="background-image: {{ collection.image | img_url: 'master' }}"></div>
</noscript>
</div>
{% endif %}
<div class="page-width">
<div class="grid text-center">
<div class="grid__item medium-up--ten-twelfths medium-up--push-one-twelfth">
<header class="section-header">
{% if collection.description != blank %}
<div class="section-header__description rte">
{{ collection.description }}
</div>
{% endif %}
{% if section.settings.product_tags_enable or section.settings.product_sorting_enable %}
<div class="collection-dropdowns">
{% if section.settings.product_tags_enable %}
<div class="collection-sort">
<label for="FilterBy" class="label--hidden">{{ 'collections.filters.title_tags' | t }}</label>
<select name="FilterBy" id="FilterBy" class="collection-sort__input">
{% if current_tags %}
{% if collection.handle %}
<option value="/collections/{{ collection.handle }}">{{ 'collections.filters.all_tags' | t }}</option>
{% elsif collection.current_type %}
<option value="{{ collection.current_type | url_for_type }}">{{ 'collections.filters.all_tags' | t }}</option>
{% elsif collection.current_vendor %}
<option value="{{ collection.current_vendor | url_for_vendor }}">{{ 'collections.filters.all_tags' | t }}</option>
{% endif %}
{% else %}
{% if current_tags contains tag %}
<option value="">{{ 'collections.filters.all_tags' | t }}</option>
{% else %}
<option value="">{{ 'collections.filters.title_tags' | t }}</option>
{% endif %}
{% endif %}
{% for tag in collection.all_tags %}
<option value="/collections/{% if collection.handle != blank %}{{ collection.handle }}{% else %}all{% endif %}/{{ tag | handleize }}"{% if current_tags contains tag %} selected="selected"{% endif %}>{{ tag }}</option>
{% endfor %}
</select>
</div>
{% endif %}
{% if section.settings.product_sorting_enable %}
<div class="collection-sort">
{% assign sort_by = collection.sort_by | default: collection.default_sort_by %}
<label for="SortBy" class="label--hidden">{{ 'collections.sorting.title' | t }}</label>
<select name="SortBy" id="SortBy" class="collection-sort__input">
{% if sort_by == collection.default_sort_by %}
<option selected="selected">{{ 'collections.sorting.title' | t }}</option>
{% if collection.default_sort_by != 'manual' %}
<option value="manual"{% if sort_by == "manual" %} selected="selected"{% endif %}>{{ 'collections.sorting.featured' | t }}</option>
{% endif %}
{% if collection.default_sort_by != 'best-selling' %}
<option value="best-selling"{% if sort_by == "best-selling" %} selected="selected"{% endif %}>{{ 'collections.sorting.best_selling' | t }}</option>
{% endif %}
{% if collection.default_sort_by != 'title-ascending' %}
<option value="title-ascending"{% if sort_by == "title-ascending" %}selected="selected"{% endif %}>{{ 'collections.sorting.az' | t }}</option>
{% endif %}
{% if collection.default_sort_by != 'title-descending' %}
<option value="title-descending"{% if sort_by == "title-descending" %} selected="selected"{% endif %}>{{ 'collections.sorting.za' | t }}</option>
{% endif %}
{% if collection.default_sort_by != 'price-ascending' %}
<option value="price-ascending"{% if sort_by == "price-ascending" %} selected="selected"{% endif %}>{{ 'collections.sorting.price_ascending' | t }}</option>
{% endif %}
{% if collection.default_sort_by != 'price-descending' %}
<option value="price-descending"{% if sort_by == "price-descending" %} selected="selected"{% endif %}>{{ 'collections.sorting.price_descending' | t }}</option>
{% endif %}
{% if collection.default_sort_by != 'created-descending' %}
<option value="created-descending"{% if sort_by == "created-descending" %} selected="selected"{% endif %}>{{ 'collections.sorting.date_descending' | t }}</option>
{% endif %}
{% if collection.default_sort_by != 'created-ascending' %}
<option value="created-ascending"{% if sort_by == "created-ascending" %} selected="selected"{% endif %}>{{ 'collections.sorting.date_ascending' | t }}</option>
{% endif %}
{% else %}
<option value="manual"{% if sort_by == "manual" %} selected="selected"{% endif %}>{{ 'collections.sorting.featured' | t }}</option>
<option value="best-selling"{% if sort_by == "best-selling" %} selected="selected"{% endif %}>{{ 'collections.sorting.best_selling' | t }}</option>
<option value="title-ascending"{% if sort_by == "title-ascending" %}selected="selected"{% endif %}>{{ 'collections.sorting.az' | t }}</option>
<option value="title-descending"{% if sort_by == "title-descending" %} selected="selected"{% endif %}>{{ 'collections.sorting.za' | t }}</option>
<option value="price-ascending"{% if sort_by == "price-ascending" %} selected="selected"{% endif %}>{{ 'collections.sorting.price_ascending' | t }}</option>
<option value="price-descending"{% if sort_by == "price-descending" %} selected="selected"{% endif %}>{{ 'collections.sorting.price_descending' | t }}</option>
<option value="created-descending"{% if sort_by == "created-descending" %} selected="selected"{% endif %}>{{ 'collections.sorting.date_descending' | t }}</option>
<option value="created-ascending"{% if sort_by == "created-ascending" %} selected="selected"{% endif %}>{{ 'collections.sorting.date_ascending' | t }}</option>
{% endif %}
</select>
<input class="collection-header__default-sort" type="hidden" value="{{ collection.default_sort_by }}" />
</div>
{% endif %}
</div>
{% endif %}
</header>
</div>
</div>
{%- assign desktopColumns = section.settings.products -%}
{%- assign mobileColumns = '2' -%}
{%- capture gridClasses -%}
{% if desktopColumns == '3' and totalProducts > 2 %}medium-up--one-third {% else %}medium-up--one-half {% endif %}
{% if mobileColumns == '2' %}small--one-half {% endif %}
{%- endcapture -%}
<div class="card-list grid" data-desktop-columns="{{ desktopColumns }}" data-mobile-columns="{{ mobileColumns }}" data-grid-style="{{ section.settings.grid_style }}">
<div id="gf-products" class="card-list__column{% if totalProducts == 1 %} card-list__column--center{% endif %} grid grid__item {{ gridClasses }}">
{% for product in collection.products %}
{% include 'product-card', product: product, grid_style: section.settings.grid_style %}
{% endfor %}
</div>
</div>
{% if collection.products.size == 0 %}
<p class="text-center">{{ 'collections.general.no_matches' | t }}</p>
{% endif %}
{% if paginate.pages > 1 %}
<div class="card-list__sub-actions">
{% include 'pagination' %}
</div>
{% endif %}
</div>
{% endpaginate %}
</div>
{% schema %}
{
"name": {
"de": "Kategorie",
"en": "Collection",
"es": "Colección",
"fr": "Collection",
"it": "Collezione",
"ja": "コレクション",
"pt-BR": "Coleção"
},
"settings": [
{
"type": "select",
"id": "products",
"label": {
"de": "Produkte per Reihe",
"en": "Products per row",
"es": "Productos por fila",
"fr": "Produits par rangée",
"it": "Prodotti per riga",
"ja": "行あたりの商品数",
"pt-BR": "Produtos por linha"
},
"default": "2",
"options": [
{
"value": "2",
"label": {
"de": "2",
"en": "2",
"es": "2",
"fr": "2",
"it": "2",
"ja": "2",
"pt-BR": "2"
}
},
{
"value": "3",
"label": {
"de": "3",
"en": "3",
"es": "3",
"fr": "3",
"it": "3",
"ja": "3",
"pt-BR": "3"
}
}
]
},
{
"type": "select",
"id": "rows",
"label": {
"de": "Zeilen pro Seite",
"en": "Rows per page",
"es": "Filas por página",
"fr": "Rangées par page",
"it": "Righe per pagina",
"ja": "ページあたりの行数",
"pt-BR": "Linhas por página"
},
"default": "4",
"options": [
{
"value": "2",
"label": {
"de": "2",
"en": "2",
"es": "2",
"fr": "2",
"it": "2",
"ja": "2",
"pt-BR": "2"
}
},
{
"value": "3",
"label": {
"de": "3",
"en": "3",
"es": "3",
"fr": "3",
"it": "3",
"ja": "3",
"pt-BR": "3"
}
},
{
"value": "4",
"label": {
"de": "4",
"en": "4",
"es": "4",
"fr": "4",
"it": "4",
"ja": "4",
"pt-BR": "4"
}
},
{
"value": "5",
"label": {
"de": "5",
"en": "5",
"es": "5",
"fr": "5",
"it": "5",
"ja": "5",
"pt-BR": "5"
}
},
{
"value": "6",
"label": {
"de": "6",
"en": "6",
"es": "6",
"fr": "6",
"it": "6",
"ja": "6",
"pt-BR": "6"
}
}
]
},
{
"type": "checkbox",
"id": "product_tags_enable",
"label": {
"de": "Tag-Filtern erlauben",
"en": "Enable tag filtering",
"es": "Habilitar filtro de etiquetas",
"fr": "Activer le filtrage par balises",
"it": "Attiva filtro tag",
"ja": "タグでの絞り込みを有効にする",
"pt-BR": "Ativar filtragem de tag"
}
},
{
"type": "checkbox",
"id": "product_sorting_enable",
"label": {
"de": "Kategoriesortierung aktivieren",
"en": "Enable collection sorting",
"es": "Habilitar la la función ordenar colecciones",
"fr": "Activer le tri de la collection",
"it": "Abilita ordinamento collezione",
"ja": "コレクションの並べ替えを有効にする",
"pt-BR": "Ativar a ordenação de coleções"
}
},
{
"type": "header",
"content": {
"de": "Collection-Bild",
"en": "Collection image",
"es": "Imagen de colección",
"fr": "Image de la collection",
"it": "Immagine collezione",
"ja": "コレクションの画像",
"pt-BR": "Imagem da coleção"
}
},
{
"type": "checkbox",
"id": "collection_hero_image",
"label": {
"de": "Kategorie-Foto anzeigen",
"en": "Show collection image",
"es": "Mostrar imagen de la colección",
"fr": "Afficher l'image de la collection",
"it": "Mostra immagine collezione",
"ja": "コレクションの画像を表示する",
"pt-BR": "Exibir imagem da coleção"
}
},
{
"type": "checkbox",
"id": "collection_hero_image_parallax",
"label": {
"de": "Parallax-Animation für Kategoriebild anzeigen",
"en": "Show collection image parallax animation",
"es": "Mostrar animación de paralaje de imagen de colección",
"fr": "Afficher l'image de la collection animée en parallaxe",
"it": "Mostra animazione parallasse immagine collezione",
"ja": "コレクション画像のパララックスアニメーションを表示する",
"pt-BR": "Exibir animação de paralaxe de imagem da coleção"
}
},
{
"type": "header",
"content": {
"de": "Produkte",
"en": "Products",
"es": "Productos",
"fr": "Produits",
"it": "Prodotti",
"ja": "商品",
"pt-BR": "Produtos"
}
},
{
"type": "select",
"id": "grid_style",
"label": {
"de": "Rasterstil",
"en": "Grid style",
"es": "Estilo de cuadrícula",
"fr": "Style de grille",
"it": "Stile griglia",
"ja": "グリッドスタイル",
"pt-BR": "Estilo da grade"
},
"default": "collage",
"options": [
{
"value": "collage",
"label": {
"de": "Collage",
"en": "Collage",
"es": "Collage",
"fr": "Collage",
"it": "Collage",
"ja": "コラージュ",
"pt-BR": "Colagem"
}
},
{
"value": "grid",
"label": {
"de": "Raster",
"en": "Grid",
"es": "Cuadrícula",
"fr": "Grille",
"it": "Griglia",
"ja": "グリッド",
"pt-BR": "Grade"
}
}
]
},
{
"type": "checkbox",
"id": "show_spacing",
"label": {
"de": "Bildabstand aktivieren",
"en": "Enable image spacing",
"es": "Habilitar espaciado de imagen",
"fr": "Activer l'espacement des images",
"it": "Abilita spaziatura immagini",
"ja": "画像の間隔を有効にする",
"pt-BR": "Ativar espaçamento de imagem"
}
},
{
"type": "checkbox",
"id": "show_vendor",
"label": {
"de": "Produktverkäufer anzeigen",
"en": "Show product vendor",
"es": "Mostrar proveedor del producto",
"fr": "Afficher le distributeur du produit",
"it": "Mostra fornitore prodotto",
"ja": "商品の販売元を表示する",
"pt-BR": "Exiba o fornecedor do produto"
},
"default": true
}
]
}
{% endschema %}
オンラインストアを運営する中で、商品の返品や交換は重要なプロセスとなります。Shopify管理画面を通して簡単に返品や交換が行えることをご存知でしょうか?希望する場合は、お客...
By Mirai Sep 15, 2024Shopifyの請求書の支払いが失敗したという通知を受け取って驚いたことはありますか。初めての支払いでエラーが発生したり、これまで何の問題もなく支払いできていたのに突然失敗し...
By Minami_ Sep 8, 20242023年2月、Shopifyはcheckout.liquidを廃止し、Checkout Extensibilityに移行することを発表いたしました。この新しいチェックアウト...
By JasonH Aug 15, 2024