Спойлер или Cut для содержимого content

Здравствуйте, товарищи, погуглил — не нашел.
Есть задача, текст контента прятать под спойлер, выводя только первое предложение, после него оставляя кнопку Подробнее, чтобы появлялось остальное содержимое контента страницы (там будет только текст). Нашел снипет, как красиво обрезать первое предложение, а вот как вытащить оттуда вторую часть (которая спрятана) не разобрался. По сути нужно контент разбить на две части: одна в виде первого предложения, вторая в виде всего контента за минусом первого предложения. Подскажите, как это сделать правильно средствами Modx?

Максим

09 ноября 2021, 01:30

1 309

Комментарии: 7

alex

09 ноября 2021, 09:00

Можно все это через js сделать. Отображаете первое предложение, остальное прячете в скрытый блок, при клике разворачиваете его.

Алексей

09 ноября 2021, 11:33

Добрый день!
Вот, мне кажется ваш вариант.
Кнопка Показать больше/Показать меньше

Максим

09 ноября 2021, 19:25

Нет. Этот вариант мне не подходит, в этом варианте нужно добавлять теги в текст, чтобы обрезать его на ДО и ПОСЛЕ, я не могу вмешиваться в поток content и добавлять туда теги. Если это делать руками, то придется 160 страниц править.

Александр Мельник

09 ноября 2021, 19:32

Все зависит от того зачем вы это делаете. Пока что выглядит так, что вам поможет javascript. Получить весь текст, найти кусок до точки, остальное скрыть. Добавить ссылку — подробнее, подвесить на нее событие, которое откроет остальной текст.
Но это будет иметь смысл, если вы не из СЕО соображений это делаете, потому что в исходном коде, который вернул сервер будет присутствовать весь текст.

Максим

09 ноября 2021, 19:49

Вдруг кому будет полезно.

<script>
  const pageWidth = document.documentElement.scrollWidth
  if(pageWidth < 659){
    var bukvi = document.getElementById('spoiler');
  var sentens = bukvi.textContent;
  var spoilerON = sentens.split('.')[0];
  var lenS = spoilerON.length;
  var sentensP2 = sentens.slice(lenS + 1);
  bukvi.innerHTML = '<span class="begin_spoiler">' + spoilerON + '.' + '</span>' + '<span id="end_spoiler" class="end_spoiler">' + sentensP2 + '</span>';
  
  var button = document.createElement('button');
  bukvi.after(button);
  button.innerText = "Подробнее";
  button.id = "spoilerBT"
  button.onclick = function (){
    var spoilerTXT = document.getElementById("end_spoiler");
    spoilerTXT.classList.toggle("active");
    if(button.innerText == "Подробнее"){
      button.innerText = "Cкрыть";
    }
    else{
      button.innerText = "Подробнее";
    }
  }
  }
</script>

И стили:

.end_spoiler{
      display: none;
    }
    .end_spoiler.active{
      display: inline;
    }

Александр Мельник

09 ноября 2021, 19:50

Если же для вас важно, чтобы и поисковая система видела только первое предложение, то да — немного сложнее. Нужно нагуглить как писать свои модификаторы и написать такой, который можно применить к текстовому выводу {$contents|showFirstSentence}
После этого в шаблоне прописать ссылку — показать еще. При клике по ней нужно совершить ajax запрос на ваш файл, в котором вы подключите объект modx по учебнику docs.modx.com/current/en/extending-modx/modx-class/loading-externally, каким то образом (через data атрибут ссылки ?) получите идентификатор ресурса, на котором идет запрос текста, получите весь текст (чтобы не заморачиваться с отрезанием первого предложения, которое уже есть на странице) и поместите этот текст на страницу, перезаписав первое предложение и кнопку — подробнее.

Максим

09 ноября 2021, 20:07

Не, нужно чтобы ПС видели все, что есть на странице) Спасибо за Ваш вариант! В моем случае JS норм)

Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.