Quip для MODX. Более рабочий вариант

Quip — Не плохая система комментариев. Ее проблема для меня в том, что из коробки она идет немного кривой. В этой статье я постараюсь дать алгоритм, который ускорит базовую настройку Quip.

Установите Quip из репозитория MODx, поместите этот код в шаблон:

[[!Quip?
  &thread=`thread[[*id]]`
  &useGravatar=`0`
  &dateFormat=`%d %b %Yг. в %H:%M`
]]
[[!QuipReply? 
  &thread=`thread[[*id]]` 
  &moderate=`0` 
  &useGravatar=`0`
  &closeAfter=`0`
]]

Теоретически на этом все готово, но я заменяю существующие чанки тем, что внутри этого архива.

Tips:

  • Поменять заголовок "Комментрии" — Управление словарями / quip / ru / quip.comments или в шаблоне — core/components/quip/elements/chunks/quipcomments.chunk.tpl

Постраничная навигация и ajax-подгрузка в Quip

По-идеи достаточно лишь добавить &limit=`10` для сниппета Quip, но на деле нудны допилы.

Первый косяк — навигация отображается даже когда второй страницы нет, и получается, что неактивная циферка "1" бессмысленно весит. Можно, конечно удалять ее скриптом, или скрввать в CCS с помощью :only-child, но лучше зарубить накорню. Для этого нужно отредактировать файл core/components/quip/model/quip/quip.class.php, функцию buildPagination:

// добавив в самом начале функции:
$page_limit = !empty($options['limit']) ? $options['limit'] : 1;
$pageCount = $options['count'] / $page_limit;
// закомментить или удалить строчку:
//$pageCount = $options['count'] / (!empty($options['limit']) ? $options['limit'] : 1);

//Обернуть цикл for ($i=0;$i<$pageCount;$i++) в условие:
if($pageCount > 1){
...
}

Если нужно сделать так чтобы при нажатии на кнопку "показать больше комментариев" подгружались еще комментарии комментируем цикл for, и вставляем такую строку (после цикла for, или вместо него):

$pages = "<div class='pagination-show-more' data-pagecount='".$pageCount."' data-pagelimit='".$page_limit."' data-pagecurrent='1'><button>Посмотреть еще отзывы</button></div>";

Далее создаем ресурс с пустым шаблоном и помещаем туда сниппет, в который в свою очередь копируем нижеследующий код:

if( !isset($_GET['thread']) || !isset($_GET['pagelimit']) || !isset($_GET['pagecurrent']) ){
  return "";
}
$output = $modx->runSnippet('Quip',array(
  'thread' => $_GET['thread'],
  'useGravatar' => '0',
  'dateFormat' => '%d %b %Yг. в %H:%M',
  'tplComment' => 'tplComment',
  'start' => $_GET['pagecurrent'] * $_GET['pagelimit'],
  'limit' => $_GET['pagelimit'],
  'sortBy' => 'approvedon'
));
echo $output;
А в шаблоне, на страниже у нас есть типа такой вот JS код:
$(".pagination-show-more").find("button").click(function(){
  var t = $(this).parent();
  var dataAjax = {};
  dataAjax.thread = "thread[[*id]]";
  dataAjax.pagecount = parseInt(t.attr("data-pagecount"),10);
  dataAjax.pagelimit = parseInt(t.attr("data-pagelimit"),10);
  dataAjax.pagecurrent = parseInt(t.attr("data-pagecurrent"),10);
  if(dataAjax.pagecurrent == dataAjax.pagecount){
    t.remove();
  }
  var wrapper = $(".quip-comment-list");
  $.ajax({
    url: '[[~1275]]', // ссылка на ресурс, сожержащий предыдущий сниппет 
    data: dataAjax,
    success: function(data){
      wrapper.append($(data).find(".quip-comment-list").html());
      console.log("OK");
      if(dataAjax.pagecurrent+1 == dataAjax.pagecount){
        t.remove();
      }else{
        t.attr("data-pagecurrent", dataAjax.pagecurrent+1);
      }
    },
	error: function (xhr, ajaxOptions, thrownError){
		console.log(xhr.responseText);
    console.log("ERROR");
	}
  });
});<fixedpre>
</pre>

<h2>Quip в pop-up (в лайтбоксе)</h2>
<p>Создаем свой сниппет и помещаем на пустую страницу:</p>
<pre class="brush: js;auto-links: false;toolbar:false;">
  echo $modx->runSnippet('Quip',array(
    'thread' => "thread".(int)$_GET['quipid']
    ,'useGravatar' => '0'
    ,'dateFormat' => '%d %b %Yг. в %H:%M'
  ));
  echo $modx->runSnippet('QuipReply',array(
    'thread' => "thread".(int)$_GET['quipid']
    ,'moderate' => '0'
    ,'useGravatar' => '0'
    ,'closeAfter' => '0'
  ));
if($_GET['quip_approved'] == 1){
  $parents = $modx->getParentIds($_GET['quipid'], 2); 
  $parent = $parents[0];
  
  $url = $modx->makeUrl($parent);
  $modx->sendRedirect($url);
}
</pre>
<p>В шаблон помещаем что-то типа:</p>
<pre class="prettyprint"><fixedpre><a href="/ajax-otziv.html?quipid=[[+id]]" class="fancybox-ajax">Отзывы</a>

Подключаем fancybox, подцепляем класс fancybox-ajax, ну и в общем-то все.

Капча для Quip (reCaptcha)

  1. При вызове сниппета QuipReply поставить &recaptcha=`1`;
  2. https://www.google.com/recaptcha/admin — Получить код реКапчи;
  3. MODx / системные настроки / recaptcha recaptcha.private_key вставить Secret key;
  4. MODx / системные настроки / recaptcha recaptcha.public_key вставить Site key;
  5. Убедиться, что в шаблоне добавления комментарияев (по-умолчанию — core/components/quip/elements/chunks/quipaddcomment.chunk.tpl) не удален код капчи:
<div class="quip-fld recaptcha">
[[+quip.recaptcha_html]]
<span class="quip-error">[[+error.recaptcha]]</span>
</div>

Заметки и ссылки по теме:

Комментарии (1)

  1. Андрей 11 января 2020, 14:27 # 0
    Как убрать обязательное поле Email, не нарушив функционал?
    *Комментарий будет опубликован после проверки модератором

    Комментарии easyComm

    Александр 31 августа 2018, 09:05

    Подскажите пожалуйста как вы сделали отправку комментариев ajax ???

    Администратор

    Через модуль easyComm. Ajax из коробки.
    https://webstool.ru/oformlenie-i-nastrojka-easycomm.html

    Похожие статьи

    Наш сайт использует куки, нажмите «ОК» если вы не против
    OK