Подтвердить что ты не робот

Как использовать комментарии disqus в блоге github pages (Markdown)?

Можно ли интегрировать комментарии disqus html в блоге с помощью github-страниц? Мне нравится идея использования github, jekyll и markdown для управления моим сайтом и блогом для простоты. Тем не менее, я хотел бы включить возможность комментирования disqus. Однако, поскольку markdown генерирует html - как включить код html/js для disqus?

4b9b3361

Ответ 1

Самый простой и чистый способ сделать это - создать частичный с HTML, который disqus предоставляет в вашей папке _includes/ (например, _includes/disqus.html), а затем просто включить его в файл макета сообщений (например, _layouts/post.md)

{% include disqus.html %}

Здесь вы можете увидеть пример: post layout и disqus partial.

Ответ 2

Существует "официальный" способ выполнить эту задачу. Вы можете найти индикацию Disqus в эту ссылку.

Подробнее, процедура следующая:

Добавьте переменную с именем comments в переднюю материю YAML (т.е. заголовок вашего почтового файла) и установите ее значение true. Образец фронтального объекта может выглядеть так:

layout: default
comments: true
# other options

Создайте новый файл шаблона (т.е. disqus.html) и поместите туда Universal Embed Code, между % if page.comments % и % endif %

Включите файл disqus.html в шаблон публикации.

Надеюсь, это поможет:)

Ответ 3

Включите комментарий disqus в свой post.html и установите идентификатор ссылки на комментарий:

<div id="disqus_thread"></div>
<script type="text/javascript">
    var disqus_shortname = '<your-disqus-name>'; 
    var disqus_identifier = '{{ page.id }}'; 
...
</script>

В вашем шаблоне default.html укажите количество комментариев script:

<script type="text/javascript">
    /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
    var disqus_shortname = '<your-disqus-name>';
...
</script>

Затем добавьте ссылку на комментарии, используя атрибут data-disqus-identifier, чтобы счетчик комментариев появлялся после каждого сообщения на главной странице вашего блога:

<a href="{{post.id}}" data-disqus-identifier="{{post.id}}">Leave a comment</a>

Ответ 4

Настоящий Jekyll отобразит HTML из ваших файлов Markdown (локально используя Jekyll или удаленно, нажав на gh-страницы). Однако это не имеет особого значения, поскольку этот тип кода должен быть в слое, поэтому не в исходном файле Markdown.

_layouts
    `- default.html
    `- post.html <- `layout: default` in the YAML header
_posts
    `- YYYY-MM-DD-my-post.md <- `layout: post` in the YAML header

Следуя этому древовидному представлению, вы сможете отображать свои файлы Markdown, используя макет сообщения, который может содержать ваш Disqus script.

Ответ 5

Откройте config.yml и добавьте следующую строку кода disqus_shortname: username. Замените username своим коротким именем Disqus.

Создайте файл с именем disqus_comments.html в папке Jekylls _includes и добавьте свой универсальный код для диска Disqus между тегами {% if page.comments %} и {% endif %}

{% raw %}{% if page.comments != false %}
<div id="disqus_thread"></div>
<script type="text/javascript">
  var disqus_shortname  = '{{ site.disqus_shortname }}';
  var disqus_identifier = '{{ page.url }}';

  (function() {
    var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
    dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
  })();
</script>
<noscript>Please enable JavaScript to view the <a href="#" onclick="location.href='http://disqus.com/?ref_noscript'; return false;">comments powered by Disqus.</a></noscript>
{% endif %}{% endraw %}

Вы просто добавляете comments: false в любые сообщения front-matter, чтобы отключить комментарии к сообщению.

Наконец, откройте файл post.html и добавьте следующий тег include, расположенный сразу после тега </article>.

{% if site.disqus_shortname %}
  {% include disqus_comments.html %}
{% endif %}

Вы можете следить за моим подробным сообщением в блоге о том, как добавить комментарии Disqus к Jekyll, если вы застряли.