Акция! Дизайн «MyBB Technical Support»
Превью первой картинки топика на странице списка тем
Добавляет к ячейке с названием топика первую картинку из топика.
Автор: satsana (за идею благодарим nou)
Скрипт создан по заказу администрации проекта ForumD.ru!
При копировании информации указывайте ссылку на эту тему!
Платформа: MyBB
Демо: Портфолио // Каталог стилей
В Html-низ:
<!-- Превью первой картинки топика (с) satsana, 2018 -->
<style>
.punbb .prev-pic img {
max-width: 300px;
min-height: 160px;
}
</style>
<script type="text/javascript">
var prevForum = [33, 81];
if (document.URL.indexOf('viewforum.php?id=') != -1) {
var forumNow = +document.URL.match(/viewforum.php\?id=\d+/)[0].match(/\d+/)[0];
} else {var forumNow = 0}
if (prevForum.indexOf(forumNow) != -1 || (forumNow != 0 && (!prevForum || prevForum.length == 0))) {
$('.forum table tbody tr td.tcl').append('<div class="prev-pic"></div>');
var prevTheme = $('.forum table tbody tr');
for (c=0; c<prevTheme.length; c++) {
var hr = $(prevTheme[c]).find('.tcl .tclcon a').attr('href');
$.ajax({
url:hr,
context:prevTheme[c],
success:function(res){
res = $(res).find('.post-content:first-of-type').html().replace(/\"/mgi, '"').replace(/\</mgi, '<').replace(/\>/mgi, '>').match(/<img[\s\S]*?src="[\s\S]*?"[\s\S]*?>/mi)[0];
$(this).find('td.tcl div.prev-pic').html(res);
}
});
}
}
</script>Пояснения
Размер превью картинки настраивается тут:
<style>
.punbb .prev-pic img {
max-width: 300px; /* ширина */
min-height: 160px; /* высота */
}
</style>
Форумы, в которых работает скрипт настраиваются здесь:
var prevForum = [33, 97];
Если удалить эту строчку, скрипт сработает на ВСЕ топики во всех форумах.
Стиль блока с картинкой можно настроить через селектор:
.prev-pic {
...тут коды...
}
Скрипт импортирует первую картинку каждого топика. Если нужно убрать картинки с важных тем, то впишите между тегами <style>:
.punbb .isticky .prev-pic {display: none;}
по аналогии можно поступить с закрытыми темами (.iclosed) и другими типами топиков.
Скрипт идеально сочетается со скриптом разворота картинок
Если установить его, при клике на картинку, она развернется на полный размер.
За перестройкой стиля страницы топик-листа под эдакий "форум-галерею" (как на скринах) можно обратиться к команде ForumD.ru - Сделать заказ
