Как использовать JavaScript в WordPress, чтобы автоматически свернуть содержимое публикации на странице и разрешить расширение внутри страницы - PullRequest
0 голосов
/ 26 марта 2019

Я пытаюсь сделать так, чтобы сообщения появлялись на главной странице блога WordPress таким образом, чтобы содержимое всегда сворачивалось за пределы второго абзаца, а под вторым абзацем добавлялась кнопка «развернуть», которая после нажатия полностью разверните содержимое и переключите кнопку в режим «свертывания».

Я тщательно обыскал это здесь ( выдержка из WordPress, чтобы показать 2 абзаца , Развернуть / свернуть выдержку и содержимое , Как добавить автоматически свернуть / развернуть содержимое WordPress ( single.php)? ) и в других местах и ​​(если я не владею javascript) лучшее, что я могу сделать, показано в ссылке ниже на jsfiddle:

https://jsfiddle.net/dezoxkbw/

, который использует:

    $(document).ready(function(){
  $(".entry-content").each(function(){
  var contentBox = $(this);
  if (contentBox.find('p').length > 1){ 
    var lastOne = contentBox.find('p').length - 1;
    contentBox.append('<div class="button"><button id="toggle" class="btn">Read More</button></div>');
    $('.entry-content p').not('.entry-content p:first-child' || '.entry-content p:nth-child(2)').wrap('<div class="text" />');  
    contentBox.find(".text").hide();
    contentBox.find(".btn").click(function(){
      if($(this).attr('class').indexOf('btnDown')==-1){
        contentBox.find(".text").slideDown("slow");
        $(this).addClass("btnDown");
        $(this).html("Read Less");
      }else{
        contentBox.find(".text").slideUp("slow");
        $(this).removeClass("btnDown");
        $(this).html("Read More");
      }
    });
  }

В прилагаемом примере я могу только обернуть содержимое за пределы первого абзаца, так как по какой-то причине псевдо-селектор nth-child не работает. Я также не уверен, почему свойства дополнения скрытых абзацев переходят сразу после раскрытия и как управлять этим поведением.

Наконец, я не уверен, что стоит интегрировать это в functions.php и content.php для использования в блоге Wordpress.

Буду признателен за любую помощь.

...