"Unnesting" вложенные блок-цитаты с использованием jQuery (чтобы соответствовать обновлению tumblr в сентябре 2015 года)

Question

Я работаю над новой темой Tumblr для очень интенсивного блога. Согласно последнему обновлению цепочки комментариев, некоторые сообщения становятся очень длинными. Несмотря на то, что он отлично выглядит на моей панели, он разрушает мой блог из-за вложенных цитат.

Я хотел бы подражать тому, как комментарии выглядят на моей панели, без значков пользователя и тому подобного, и с чередующимся цветом, чтобы помочь дифференцировать комментаторов. (Бонус, если я могу удалить "пустые" комментарии, но я смогу разобраться с этим позже.)

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

Я очень плохо знаком с HTML, CSS и jQuery, поэтому любая помощь будет высоко ценится!

Answer 1

Кажется, нет официального способа сделать это. Однако можно добиться эффекта с помощью JS. Следующий скрипт сгладит вложенные цитаты, а также уберет ":" после названий блогов и вместо этого добавит к ним "- ". Просто поместите это в новый script тег под body тег.

$(function() {
    // flatten reblogs
    $("div.cont blockquote").each(function() {
        $(this).parent().prepend($(this).children());
        $(this).remove();
    });

    // remove : and add -
    $("div.cont a.tumblr_blog").each(function() {
        var authorPTag = $(this).parent();
        authorPTag.html($(this));
        authorPTag.prepend("- ");
    });
});

Это похоже на тему по умолчанию:

Однако обратите внимание, что это может сломаться в следующий раз, когда Tumblr обновит способ отображения реблогов. Это также не будет работать с бесконечной прокруткой.

Answer 2

Ответ @relgukxilef почти сработал для меня.

Мне пришлось вставить jQuery в тему, а затем дождаться инициализации jQuery. Tumblr также обновил свои теги.

Вот решение, с которым я пошел:

<script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>

<script type="text/javascript">
  $(document).ready(function () {
    // flatten reblogs
    $("div.post-content blockquote").each(function() {
      $(this).parent().prepend($(this).children());
      $(this).remove();
    });

    // remove : and add -
    $("div.post-content a.tumblr_blog").each(function() {
      var authorPTag = $(this).parent();
      authorPTag.html($(this));
      authorPTag.prepend("- ");
    });
  });
</script>

Я добавил это в конец темы, и все работало отлично