FROM CACHE - jp_header

Shopify運営サイトのソース表示の空白を直したい

Shopify運営サイトのソース表示の空白を直したい

mumako
適用対象外
2 0 0

shopify初心者です。
有料のテーマBroadcastを使用して、サイトを実際公開して運営しているのですが、
公開されたサイトのソースを見るとTitle and descriptionの表記の部分が下記のように空白ができてしまう状況です。

 

<title>
		XXXXXXXX公式オンラインストア
		
		
		
		&ndash; XXXXXXXX公式オンラインストア
		
		</title>


 こちらを下記のようなソース表示にしたいのですが、コード(theme.liquid)をどのように修正したらよろしいでしょうか??

<title>XXXXXXXX|XXXXXXXX公式オンラインストア</title> 

 不慣れなためこの症状に関しまして詳しい方がいらっしゃいましたらご教示いただけますと幸いです。
どうぞよろしくお願いいたします。

2件の返信2

NIIGAKI_HYUGA
Shopify Partner
54 24 15

@mumako 様

初めまして。新垣です。

 

Title and description部分のコードについて解説します。

  <!-- Title and description ================================================ -->
  {% capture seo_title %}
    {% assign title_content = page_title %}// 現在のページのタイトルを取得
    {% if template == 'password' %}
      {% assign title_content = shop.name %}
    {%- endif -%}
    {{ title_content }}// ページのタイトルを追加
    {% if current_tags %} // 選択されているタグがある場合(コレクションやブログページでの絞り込み時に利用される)
      {%- assign meta_tags = current_tags | join: ', ' %} &ndash; {{ 'general.meta.tags' | t: tags: meta_tags -}} // 選択されているタグの情報を追加
    {% endif %}
    {% if current_page != 1 %} // 1ページ目でない場合
      &ndash; {{ 'general.meta.page' | t: page: current_page }} // ページの情報を追加
    {% endif %}
    {% unless page_title contains shop.name %} // ページのタイトルに店舗名が含まれていない場合
      &ndash; {{ shop.name }} // ストア名を追加する
    {% endunless %}
  {% endcapture %}
  <title>{{ seo_title }}</title>

 

例えば、TOPページでしたら、最初に{{ title_content }}にてホームページタイトルが追加されます。ホームページでは選択されているタグやページに1枚目や2枚目は無いので、ホームページタイトルとストア名が一致していなければ、&ndash; {{ shop.name }}が追加されます。

なので最終的な出力としては下記のようになるはずです。

<title>{{ title_content }} - {{ shop.name }}</title> //&ndash;はハイフン

 

弊ストアでは、特に追加の編集を加えずとも上記のように表示されております。

なので、おそらく修正すべきはコードでは無く、設定 > ストアの詳細 > ストア名や、販売チャネル > オンラインストア > 各種設定 > ホームページタイトルの部分になるかと思います。

 

以上、参考になりましたら幸いです。

Freelance Solution Engineer | 新垣
JavaScript Liquid Theme, React Remix App
投稿は参考になりましたか?「いいね!」でお教えください。
解決しない場合、個別に対応も可能ですのでプロフィールからお気軽にメッセージください
mumako
適用対象外
2 0 0

新垣様

初めまして

Title and descriptionをとてもわかりやすく解説していただきありがとうございます!

ストア名とページタイトルに問題があるかというご指摘ですが、ストア名とページタイトルは一致させず、別の表記にしたいと考えております。
こちらは一致させた方が良いのでしょうか??

試行錯誤して色々いじっておりましたら、theme.liquidの

Title and descriptionに下記のコードだけ入れるとChromeで開いた時のソースに余分な空白がなく表示されるようになりました。

 

<!-- Title and description ================================================ -->

        {% capture seo_title %}

        <title>{{ seo_title }}</title>

 

そこで質問なのですが、Title and descriptionに上記のみの記載ですと何かSEOや技術的に問題はありますでしょうか??

ご教示いただきましたTitle and descriptionのコードはマストで入れておくべきなのでしょうか??

 

もしTitle and descriptionでいらない表記などがありましたらご教示いただけますと幸いです。

どうぞよろしくお願いいたします。