Генерация оглавления и размещение в модуле - Поиск компонентов, модулей, плагинов

Делать на js на и все. находим все элементы с определенным селектором(ну классом например)
и добавляем в какой либо блок их содержимое(text) и # +  id используем в качестве ссылки.
Простейшая логика писать минут 15-20 с оформлением. А может и готовое есть гуглите.
P.S но автоматика не есть хорошая затея. мало ли что попадется

Вот такое пытаюсь приспособить

ЗЫ
https://css-tricks.com/automatic-table-of-contents/

Вот такое пытаюсь приспособить

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

Наверно не могу нагуглить

находящийся вертикально по центру (горизонтально - прижат вправо).

А в идеале еще и спрятанный в кнопочку и раскрывающийся по клику

А на чистом CSS нет вариантов?

А, еще забыл, ширина и высота заранее не известны..

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

в общем, в топку плагины кривые и закодированные
берем пример от Волонда и чуток правим (чтобы ID-шники для заголовков автоматом ставились, вам останется просто как h3 - h6 помечать нужные заголовки).
код цепляем к шаблону.

в коде вот эта строка

Код

$('.item-page').find('h3, h4, h5, h6')

отвечает за выбор.
т.е. все h3, h4, h5, h6 внутри блока с классом item-page попадут в оглавление.

ну и вывод в модуле делается просто: создаем модуль Custom HTML (произвольный код), вставляем туда

Код

<div class="all-questions">...</div>

и публикуем. где хотим

это цеплляем как js к шаблону

Код

(function($)
{
	$(document).ready(function()
	{

var ToC =
  "<nav role='navigation' class='table-of-contents'>" +
    "<h2>On this page:</h2>" +
    "<ul>";

var newLine, el, title, link;
count=0;
$('.item-page').find('h3, h4, h5, h6').each(function() { // выбираем нужные заголовки
 cls=$(this).prop("tagName").toLowerCase();		// получаем имена тегов, чтобы сделать выделить вложенные теги лесенкой
  
  $(this).attr('id', "mytoc" + count);
  el = $(this);
  title = el.text();
 // link = "#" + el.attr("id");
 link = "#mytoc" + count;
 count++;

  newLine =
    "<li class='pad_" + cls + "' >" +
      "<a href='" + link + "'>" +
        title +
      "</a>" +
    "</li>";

  ToC += newLine;

});

ToC +=
   "</ul>" +
  "</nav>";

$(".all-questions").prepend(ToC);


	})
})(jQuery);

$(document).ready(function() {
    $("a.scroll_p").click(function () {
        var elementClick = $(this).attr("href");
        var destination = $(elementClick).offset().top;
        $('html,body').animate( { scrollTop: destination }, 1100 );
        return false;
    });
});

"<a class='scroll_p' href='" + link + "'>" +

С использование данной статьи http://jemand.ru/plavayushhij-blok-s-pomoshhyu-jquery/ вопрос с путешествующим блоком отпал. Все работает

Вот ещё проще, меньше скриптов и подключений:

а я вот измышляю над плагином сижу.
а если внутри статьи останется, то тоже под вопросом, с учетом миллиона разных шаблонов.

имхо, кому надо - сами допишут летание и сворачивание.