FROM CACHE - jp_header
解決済

商品ページやコレクションページの削除について

ky_ssm
観光客
11 1 1

現在、

DawnにてHPを作成してます。

 

「PageFly」でランディングページ兼商品ページを作成して、

 

そのページ内で「Mikawaya Subscription 」のサブスクリプション購入のダイレクトリンクボタンを設置しました。

 

shopifyのデフォルトの購入ボタンだと、

 

サブスクリプションではなく、

 

通常(1回きり)の購入となってしまうため、

 

できればデフォルトの購入ボタンがひょうじされる商品ページ&コレクションページを削除したいのですが、

 

どなたか方法をご教示いただけないでしょうか?

 

 

shopifyのサポートに問い合わせたところ、

「これらの購入オプションでのみこの商品を表示する」にチェックをいれる

を案内されましたが、

 

うまくいきませんでした。

 

 

当方、

 

専門的な知識がなく、

 

コード編集についてもよくわかっていないため、

 

なるべくわかりやすくご教示いただけますと幸いです。

 

ご返信お待ちしております。

 

何卒よろしくお願いいたします。

 

1 件の受理された解決策
ky_ssm
観光客
11 1 1

成功

田辺様

 

ご丁寧に対応いただきありがとうございました。

 

また機会がありましたらよろしくお願いいたします。

元の投稿で解決策を見る

12件の返信12

Qcoltd
Shopify Partner
1049 428 412

開発ストアで下記を試してみました。

 

  • Mikawaya Subscriptionをインストール
  • サブスクリプショングループを作成
  • サブスクリプショングループに紐付けた商品の、商品管理画面にて「これらの購入オプションでのみこの商品を表示する」にチェックを入れる

質問者さまと同様に、

商品一覧ページと、商品詳細ページは閲覧できる状態のままですが、

「カートに追加する」をクリックしても、カート投入されず、

「今すぐ購入」をクリックしても、下図のような画面が表示され、チェックアウトに進めなくなりました。

screenshot_20220722_02.png

 

回答ではなく、質問になってしまい恐縮なのですが、

質問者様はこの状態にならず、

通常の購入ができてしまう状態ということで合っていますでしょうか?

 

(キュー田辺)

株式会社Q (キュー)
グラフィックデザイン、アパレル事業、Web制作など色々やっている渋谷区代々木の会社です。ShopifyでのECサイトの運営・開発も行なっています。
私たちについて: https://web.q-co.jp/ テックブログ: https://techlab.q-co.jp/
ky_ssm
観光客
11 1 1

お世話になります。

 

>質問者様はこの状態にならず、

>通常の購入ができてしまう状態ということで合っていますでしょうか?

→はい、通常購入の状態で商品がカートに入ります。

 

田辺様が添付された画像は1度も見たことがありません。。

Qcoltd
Shopify Partner
1049 428 412

@ky_ssm さま

 

状況承知いたしました。

 

なぜ、同様の設定をしているのに、

こちらでは購入を制限でき、そちらではできないのか、の解決については、

私では力不足なので、

商品詳細ページの表示をどうにかする方法と、

コレクションページでの該当商品の表示をどうにかする方法、

をお伝えいたします。

 

なお、「削除」はできないため、(できるのかもしれませんが、私は思いつかないため、)

あくまで「表示をどうにかする」方法になります。

 

 

商品詳細ページの表示をどうにかする

管理画面 > オンラインストア > 対象のテーマの「アクション」 > コードを編集

で、

「レイアウト」のtheme.liquidを編集します。

該当商品にアクセスがあった際に、

トップページに自動的に遷移するようにしてしまいます。

theme.liquidの3行目付近

 

  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">

 

 

の<head>の下に下記のように追記します。

  <head>
    {%- if template contains 'product' -%}
      {% if product.id == {{ 商品ID }} %}
        {% style %}
        body { display:none! important; }
        {% endstyle %}
        <meta http-equiv="refresh" content="0;URL=/">
      {%  endif %}
    {%-  endif -%}
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">

 

{{ 商品ID }} には、非表示にしたい商品のIDを入力します。

商品のIDは、管理画面でその商品の編集画面を開いた際のURLから取得できます。

 

xxxxxxx.myshopify.com/admin/products/00000000000000

 

末尾の0が並んでいるところが商品のIDになります。

(実際には0が並んでいるわけではなく、しっかり数字が並んでいますので、そちらの数字をコピーして使用してください。)

 

 

コレクションページでの該当商品の表示をどうにかする

Shopifyをあまりカスタマイズせずに利用されている場合は、

基本的に、ALLコレクションに表示される商品を調整すれば良いはずです。

管理画面 > 商品 > コレクションにて、下図のようにします。

screenshot_20220723.png

 

ALLを全角で入力してしまうと、

collections/all を編集できなくなってしまうため、

必ず半角でご入力ください。

 

 

以上になります。

なるべく簡潔に説明するために、

大雑把な方法をご紹介しましたが、

もっとここをこうするにはどうしたら良いか? などのご質問ありましたら、

こちらのスレッドに投稿ください。

 

ご参考まで。

(キュー田辺)

株式会社Q (キュー)
グラフィックデザイン、アパレル事業、Web制作など色々やっている渋谷区代々木の会社です。ShopifyでのECサイトの運営・開発も行なっています。
私たちについて: https://web.q-co.jp/ テックブログ: https://techlab.q-co.jp/
ky_ssm
観光客
11 1 1

田辺様

ご連絡ありがとうございます。


1.商品詳細ページの表示をどうにかする につきまして、

商品IDを入力したコードで編集してみましたが、

該当商品は表示されてしまいます。

<head>の後ろに

{% render 'pagefly-head' %} があるのですが、

これは関係あるのでしょうか。。。?(添付画像をご確認ください。)

 

2.コレクションページでの該当商品の表示をどうにかする につきまして、

こちらはうまくいきました!

ただ、該当商品があと2点あります。

同じように設定したら、

2点は表示されたままです。

追加で非表示にする場合はどのようにしたらいいのでしょうか?

 


お手数ですが、

改めてご教示いただけますと幸いです。

何卒よろしくお願いいたします。

 

スクリーンショット 2022-07-25 081458.png

Qcoltd
Shopify Partner
1049 428 412

@ky_ssm さま

 

> <head>の後ろに

> {% render 'pagefly-head' %} があるのですが、

> これは関係あるのでしょうか。。。?(添付画像をご確認ください。)

 

いいえ、関係ないかと思います。

アプリ (https://apps.shopify.com/pagefly?locale=ja) が挿入しているコードなだけで、

それがあるから私が提示したコードが機能しない、というのは考えにくいです。

 

考えられるのは、

  • {{ 商品ID }}の "{{" と "}}" を残してしまっている。「{{ 商品ID }}」全体を商品IDに変更してください。
  • 商品IDが誤っている。正しい商品IDが入力されているかご確認ください。「6689000000000」のような数字です。

のどちらかかと思います。

 

 

> 同じように設定したら、

> 2点は表示されたままです。

> 追加で非表示にする場合はどのようにしたらいいのでしょうか?

 

「商品の条件合致」を、「いずれかの条件」にされていないでしょうか?

その場合は、「すべての条件」にご変更ください。

 

ご参考まで。

(キュー田辺)

株式会社Q (キュー)
グラフィックデザイン、アパレル事業、Web制作など色々やっている渋谷区代々木の会社です。ShopifyでのECサイトの運営・開発も行なっています。
私たちについて: https://web.q-co.jp/ テックブログ: https://techlab.q-co.jp/
ky_ssm
観光客
11 1 1

田辺様

 

度々恐れ入ります。

 

 

1.商品詳細ページの表示をどうにかする につきまして、

 

>{{ 商品ID }}の "{{" と "}}" を残してしまっている。「{{ 商品ID }}」全体を商品IDに変更してください。

これが原因でした、、、

かっこを削除したら無事非表示となりました。

 

あと2点同様の処理をおこないたいのですが、

下記を一つの塊として、その下にに2つ塊を入れればいいのでしょうか?

<head>
  {%- if template contains 'product' -%}
{% if product.id == {{ 商品ID }} %}
{% style %}
body { display:none! important; }
{% endstyle %}
<meta http-equiv="refresh" content="0;URL=/">
{% endif %}
{%- endif -%}
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">

 

 

 

2.コレクションページでの該当商品の表示をどうにかする につきまして、

 

確認したところ、

 

「商品の条件合致」は、「すべての条件」を選択していました。

 

コレクションの作成は添付画像1で合ってますでしょうか?

 

画像1のように設定すると、

 

画像2のような表示になります。

 

 

 

お手数ですが、

 

ご確認くださいますようお願いいたします。

 

ご連絡お待ちしております。

 

何卒よろしくお願いいたします。

 

 

 

Qcoltd
Shopify Partner
1049 428 412

@ky_ssm さま

> あと2点同様の処理をおこないたいのですが、

> 下記を一つの塊として、その下にに2つ塊を入れればいいのでしょうか?

 

はい、それでも大丈夫です。

しかし、下記のようにした方が簡単です。

    {%- if template contains 'product' -%}
      {% if product.id == {{ 商品①ID }} or product.id == {{ 商品②ID }} or product.id == {{ 商品③ID }} %}
        {% style %}
        body { display:none !important; }
        {% endstyle %}
        <meta http-equiv="refresh" content="0;URL=/">
      {%  endif %}
    {%-  endif -%}

 

 

> コレクションの作成は添付画像1で合ってますでしょうか?

> 画像1のように設定すると、

> 画像2のような表示になります。

 

合っています。

画像1に、「このコレクションには商品がありません」と表示されているのが気になりますが、

おそらく、スクリーンショットを撮るために、別の開発ストアを使われただけ、だと思いますので、

一旦横に置かせていただきます。

 

画像2についてですが、

Featured Collectionに設定しているコレクションは何でしょうか?

もし、ALLを設定していれば、これまでの設定で、商品は表示されないはずです。

ALL以外のコレクションを設定されているようでしたら、

ALLでの設定同様、特定の商品名を持つ商品を除外するように、そのコレクションにも設定することで解決されるかと思います。

 

(キュー田辺)

株式会社Q (キュー)
グラフィックデザイン、アパレル事業、Web制作など色々やっている渋谷区代々木の会社です。ShopifyでのECサイトの運営・開発も行なっています。
私たちについて: https://web.q-co.jp/ テックブログ: https://techlab.q-co.jp/
ky_ssm
観光客
11 1 1

田辺様

 

度々恐れ入ります。

 

合っています。

画像1に、「このコレクションには商品がありません」と表示されているのが気になりますが、

おそらく、スクリーンショットを撮るために、別の開発ストアを使われただけ、だと思いますので、

一旦横に置かせていただきます。

「別の開発ストア」とは何を指すのでしょうか、、、?

 

サブスクリプションの商品を3点販売しようと思っており、

 

1回きりの販売はしないよう設定しているのでそのような表示になっているのでしょうか?

 

 

また、

 

画像2はカートのスクリーンショットでした。

 

失礼しました。

 

「collections/all」のページは添付画像のようになりました。

 

ありがとうございます。

 

ちなみに、

 

カートページも非表示にすることはできますでしょうか?

 

ご教示いただけますと幸いです。

 

ご連絡お待ちしております。

 

お手数ですが何卒よろしくお願いいたします。

スクリーンショット 2022-07-25 212908.png

 

 

 

 

 

 

 

Qcoltd
Shopify Partner
1049 428 412

「別の開発ストア」とは何を指すのでしょうか、、、?

 

前提として、

商品がいくつかある中にサブスクリプション商品が混ざっている、と考えていますので、

私がお伝えした設定によって、サブスクリプション商品が除外されたとしても、

他の商品がコレクションに残るはずですから、

「このコレクションには商品がありません」

と表示されているのは不可解でした。

 

考えられるのは、

こちらのコミュニティへの投稿は一般に公開されているものですから、

質問者様のストアの商品を公開しないために、

他の開発ストアを用意して、

スクリーンショットを撮られたのかな、

と考えた次第です。

 

また、

こちらのコミュニティに投稿される方は、

ShopifyでのECサイト構築を会社として請け負っていらっしゃる方が多い印象です。(私もそうです。)

その場合は、Shopify Partnerに登録されていることがあるので、

複数の開発ストアを無料で持つことができます。

(もし、質問者様もShopify Partnerを登録されていないようでしたら、一切費用はかけずに開発ストアを自由に構築でき、検証が楽になりますから、Partnerに登録されることをおすすめします。 https://help.shopify.com/ja/partners)

 

 

さて、本題ですが、

/collections/all は、ご希望通りの表示になったとのことでよかったです。

 

カート画面については、

前回の返信でお伝えした通り、

Featured Collectionに設定されているコレクションをご確認ください。

 

確認の仕方は、

管理画面 > オンラインストア > 現在使用しているテーマの「カスタマイズ」 

あとは下図のようにします。

screenshot_20220726.png

 

ご参考まで。

(キュー田辺)

株式会社Q (キュー)
グラフィックデザイン、アパレル事業、Web制作など色々やっている渋谷区代々木の会社です。ShopifyでのECサイトの運営・開発も行なっています。
私たちについて: https://web.q-co.jp/ テックブログ: https://techlab.q-co.jp/
ky_ssm
観光客
11 1 1

商品がいくつかある中にサブスクリプション商品が混ざっている、と考えていますので、

私がお伝えした設定によって、サブスクリプション商品が除外されたとしても、

他の商品がコレクションに残るはずですから、

「このコレクションには商品がありません」

と表示されているのは不可解でした。


サブスクリプション商品のみ販売しております。

他の商品はありません。

そうすると、

「このコレクションには商品がありません」と表示は正しいでしょうか?

 

 

> Partnerに登録されることをおすすめします。

ありがとうございます。

こちら登録してみました。

 

 

> Featured Collectionに設定されているコレクション

こちら非表示にいたしました。

ありがとうございます。

Qcoltd
Shopify Partner
1049 428 412

> サブスクリプション商品のみ販売しております。

> 他の商品はありません。

> そうすると、

> 「このコレクションには商品がありません」と表示は正しいでしょうか?

 

はい、それでしたら、コレクションに商品がない状態が正しいです。

株式会社Q (キュー)
グラフィックデザイン、アパレル事業、Web制作など色々やっている渋谷区代々木の会社です。ShopifyでのECサイトの運営・開発も行なっています。
私たちについて: https://web.q-co.jp/ テックブログ: https://techlab.q-co.jp/
ky_ssm
観光客
11 1 1

成功

田辺様

 

ご丁寧に対応いただきありがとうございました。

 

また機会がありましたらよろしくお願いいたします。