Shopifyのブログ記事のコメントでDiscourseを最も効率的に活用する方法は？

開発
7

OPの質問に完全には答えられていないことに気づきました。これは、Shopifyの商品ページまたはブログ投稿に機能する一般的なアプローチです。ストアの「テーマ / カスタマイズ」セクションから、Discourseコメントを追加したいページテンプレートに移動します。ページに応じて、セクションにカスタムLiquidブロックを追加するか、新しいカスタムLiquidセクションを追加します。次に、セクションにDiscourse埋め込みコードを追加します。

埋め込みコードの discourseEmbedUrl には location.href を使用します。これにより、discourseEmbedUrl が自動的に設定されます。例：

<div id='discourse-comments'></div>
<meta name='discourse-username' content='DISCOURSE_USERNAME'>

<script type="text/javascript">
  DiscourseEmbed = {
    discourseUrl: 'DISCOURSE_URL',
    discourseEmbedUrl: location.href,
    // className: 'CLASS_NAME',
  };

  (function() {
    var d = document.createElement('script'); d.type = 'text/javascript'; d.async = true;
    d.src = DiscourseEmbed.discourseUrl + 'javascripts/embed.js';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(d);
  })();
</script>

Shopifyのブログ投稿の場合、コメントセクションを中央に配置し、幅を制限するために、LiquidセクションにカスタムCSSを追加する必要があるでしょう。例：

div#discourse-comments {
  max-width: 726px;
  margin: 0 auto;
}

商品ページとは異なり、ブログ投稿では、Discourseが適切なコンテンツをトピックにうまく取り込んでいることがわかります。

image
image1061×1151 150 KB