Me di cuenta de que no respondí completamente a la pregunta del OP. Aquí hay un enfoque general que funcionará para las páginas de productos o las publicaciones de blog de Shopify. Desde la sección Temas / Personalizar de tu tienda, ve a la plantilla de página a la que deseas agregar comentarios de Discourse. Dependiendo de la página, agrega un bloque de Liquid personalizado a una sección o agrega una nueva sección de Liquid personalizado. Luego, agrega el código de inserción de Discourse a la sección.
Para discourseEmbedUrl del código de inserción, usa location.href. De esa manera, discourseEmbedUrl se establecerá automáticamente. Por ejemplo:
<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>
Para las publicaciones de blog de Shopify, probablemente necesitarás agregar CSS personalizado a la sección Liquid para mantener la sección de comentarios centrada y limitar su ancho. Por ejemplo:
div#discourse-comments {
max-width: 726px;
margin: 0 auto;
}
Con las publicaciones de blog, a diferencia de las páginas de productos, encuentro que Discourse hace un buen trabajo al extraer el contenido apropiado en el tema:
