Я пытаюсь сделать так, чтобы сообщения появлялись на главной странице блога 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.
Буду признателен за любую помощь.