Расширение, позволяющее добавить на форум список последних тем.

Изображение


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

Выглядеть наша модификация будет так:
Recent Topics - Список последних тем форума для phpBB 3.2 и 3.3 - recent.png

Для модификации нам понадобятся сами расширения.
Расширение Recent Topics можно скачать на официальном сайте phpbb здесь.
А так же расширение Topic Preview - здесь.

Если у вас не было этих расширений - ставьте оба. Если уже стоят, то сразу переходим к модификациям.

Чтобы не утомлять своими правками, что править, что удалять, сразу добавлю правки.
Скачиваем:
recenttopics-columns.zip
3.63 КБ 1325 скачиваний
topicpreview_for_recenttopics-column.zip
2.55 КБ 1339 скачиваний
Разархивируем оба архива. В каждом архиве по цепочке папок, как в расширении по нужному пути, лежат нужные нам файлы. Если вы используете prosilver стилем по умолчанию, то просто копируете содержимое архива в папку ext, соглашаетесь на объединение и у вас в папке styles расширения добавляется ещё одна папка prosilver. Если вы используете другой стиль, то просто переименуйте папку на название вашего стиля.

Кому интересно как это работает.
Расширение предпросмотра тем выводит содержимое через определённое условие в шаблоне, мы подменяем это условие своим и выводим уже не через всплывающее окно, а напрямую на страницу.

Цветовое оформление поправить/изменить под используемый стиль можно в стилевом файле в модификации Recent Topics.

Если стиль использует всю ширину экрана, то трёх колонок может быть мало и потребуются дополнительные стили, а так же увеличение количества выводимых тем.
Комментарии: 55

CabinetAdmin 02 сен 2020, 16:59 Сообщение

Не должно, если есть непрочитанные сообщения, то {{ recent_topics.U_NEWEST_POST }} перекинет на первое непрочитанное сообщение, если их нет, то {{ recent_topics.U_LAST_POST }} перекинет на последнее. Это родные переменные из расширения, я ничего нового не вносил, просто объединил два кода:

Код: Выделить всё

						{% if recent_topics.S_UNREAD_TOPIC and not S_IS_BOT %}
						<a href="{{ recent_topics.U_NEWEST_POST }}">
						<i class="icon fa-file fa-fw icon-red icon-md" aria-hidden="true"></i><span class="sr-only"></span>
						</a> {% endif %}
и

Код: Выделить всё

						{% if not S_IS_BOT %}
							<a href="{{ recent_topics.U_LAST_POST }}" title="{{ lang('GOTO_LAST_POST') }}">
								<i class="icon fa-external-link-square fa-fw icon-lightgray icon-md" aria-hidden="true"></i>
								<span class="sr-only">{{ VIEW_LATEST_POST }}</span>
							</a> {% endif %}
Может перекидывает на 25, потому что там есть непрочитанные сообщения?
  • 0
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!

romaamor 02 сен 2020, 19:06 Сообщение

CabinetAdmin писал(а): 02 сен 2020, 16:59 Может перекидывает на 25, потому что там есть непрочитанные сообщения?
Может. А как сделать, что бы перекидывало на последнее сообщение не зависимо от того читал ли я сообщения, или нет ?
  • 0

CabinetAdmin 02 сен 2020, 20:17 Сообщение

Так:

Код: Выделить всё

							{{ recent_topics.LAST_POST_TIME }}
							{% if not S_IS_BOT %}
								<a href="{{ recent_topics.U_LAST_POST }}" title="{{ lang('GOTO_LAST_POST') }}">
									<i class="icon fa-external-link-square fa-fw icon-lightgray icon-md" aria-hidden="true"></i>
									<span class="sr-only">{{ lang('GOTO_LAST_POST') }}</span>
								</a>
							{% endif %}
  • 1
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!

romaamor 02 сен 2020, 22:58 Сообщение

Заметил ещё ошибку. В плитке отображается одна краткая информация, а при переходе к последнему сообщению пост совсем о другом. То есть показывает первое сообщение в теме а не последнее.
  • 0

CabinetAdmin 03 сен 2020, 17:36 Сообщение

Не должно быть такого, возможно были какие нибудь правки в расширении до этого? Потому что если навести на заголовок, то появляется всплывашка с описанием...

Ага, понял, у меня была не самая последняя версия.
Скопировать overall_footer_after.html из styles/all/template/event в папку styles/prosilver/template/event и заменить всё содержимое файла на:

Код: Выделить всё

{% if S_TOPICPREVIEW and TOPICPREVIEW_THEME %}
	{% INCLUDECSS '@vse_topicpreview/' ~ TOPICPREVIEW_THEME ~ '.css' %}
	{% INCLUDEJS '@vse_topicpreview/topicpreview.js' %}
	<script>
		jQuery(function() {
			jQuery('.topictitle').not('.ca_recent-topics .topictitle').topicPreview({
				dir: '{{ S_CONTENT_DIRECTION }}',
				delay: {{ TOPICPREVIEW_DELAY }},
				width: {{ TOPICPREVIEW_WIDTH }},
				drift: {{ TOPICPREVIEW_DRIFT }},
				position: {left: 35, top: 25},
				noavatar: '{{ T_THEME_PATH }}/images/no_avatar.gif'
			});
		});
	</script>
{% elseif S_TOPICPREVIEW and not TOPICPREVIEW_THEME %}
	<script>
		jQuery(function() {
			jQuery('.topictitle').not('.ca_recent-topics .topictitle').attr('title', function() {
				return jQuery(this).closest('li, tr').find('.topic_preview_first').text() || undefined;
			});
		});
	</script>
{% endif %}
Либо перекачать архив, сейчас я его заменю.

По поводу сообщения. Модификация устроена таким образом, что если нет последнего сообщения (одно сообщение в теме) - будет показано первое, а так же если в админке отключен показ последнего сообщения.
  • 1
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!

romaamor 03 сен 2020, 18:04 Сообщение

Теперь работает как надо. :drink:
  • 0

Ashiro 22 сен 2020, 09:34 Сообщение

Есть ли возможность переделать под такой вариант вид, как возможно такое реализовать!
Recent Topics - Список последних тем форума для phpBB 3.2 и 3.3 - bandicam 2020-09-22 12-32-23-999.jpg
Recent Topics - Список последних тем форума для phpBB 3.2 и 3.3 - bandicam 2020-09-22 12-32-23-999.jpg (38.68 КБ) 5480 просмотров
  • 0

CabinetAdmin 23 сен 2020, 17:35 Сообщение

В теории - да, на практике... даже не знаю... Если посмотреть на скрин, то в нём помимо заголовка и времени нету ни текста, ни аватара, следовательно модификация из этой темы для вас будет бесполезна, слишком много правок делать придётся, проще по новой всё сделать.
А вот изображение, вот здесь уже будет сложнее, Topic Preview не выводит изображения, только тексты и аватары.
  • 0
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!

Ashiro 24 сен 2020, 05:24 Сообщение

Ну даже если не так идеально, то есть вариант хоть картинку прикрутить к данному расширению?
  • 0

CabinetAdmin 24 сен 2020, 17:08 Сообщение

Ни у одно из этих расширений нет возможности вывести изображение. Возможно есть какое нибудь другое расширение именно для Recent Topics, для вывода изображения из темы. Мне такое пока не попадалось. Если вдруг найдёте, то можно будет сделать, можно даже один в один как на скриншоте сделать.
  • 0
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!

romaamor 04 окт 2020, 18:41 Сообщение

CabinetAdmin писал(а): 01 сен 2020, 18:28 Если пытаться добиться именно одинаковой высоты, блок к блоку, то это надо использовать другой метод.
А какой метод ?
  • 0

CabinetAdmin 05 окт 2020, 15:38 Сообщение

Начало кода до .ca_rt-item (включительно) поменять на:

Код: Выделить всё

.ca_recent-topics ul.topics {
	margin: 0 -7px;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.ca_recent-topics ul.topics .row {
	border-width: 0;
	background: none !important;
	width: 33.3%;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
}
.ca_recent-topics li.header dt {
	color: #4C5D77;
}
.ca_rt-item {
	padding: 18px 26px;
	position: relative;
	border-radius: 2px;
	transition: all 0.3s;
	border-radius: 5px;
	background-image: linear-gradient(#d9d9da,#6e7070);
	margin: 0 7px 13px;
	width: 100%;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: column;
	-webkit-flex-direction: column;
	flex-direction: column;
}
найти .ca_rt-footer { и добавить к нему margin-top: auto;.

Найти:

Код: Выделить всё

@media (max-width: 768px) {
    .ca_recent-topics ul.topics {
		-webkit-column-count: 2;
		column-count: 2;
	}
}
и поменять на:

Код: Выделить всё

@media (max-width: 768px) {
    .ca_recent-topics ul.topics .row {
		width: 50%;
	}
}
Найти:

Код: Выделить всё

@media (max-width: 580px) {
	.ca_recent-topics {
		margin: 0 -5px;
	}
	.ca_recent-topics ul.topics {
		-webkit-column-count: 1;
		column-count: 1;
		margin-bottom: 10px;
	}
	.ca_recent-topics ul.topics .row {
		margin: 0;
		border-width: 1px 0;
	}
	.ca_recent-topics ul.topics .row:hover .ca_rt-item {
		box-shadow: none;
	}
	.ca_rt-item {
		border-radius: 0;
		margin: 0;
	}
	.ca_recent-topics ul.topics .row:last-child {
		border-width: 0;
	}
}
и поменять на:

Код: Выделить всё

@media (max-width: 580px) {
	.ca_recent-topics {
		margin: 0 -5px;
	}
	.ca_recent-topics ul.topics {
		margin-bottom: 10px;
	}
	.ca_recent-topics ul.topics .row {
		width: 100%;
		margin: 0;
		border-width: 1px 0;
	}
	.ca_recent-topics ul.topics .row:hover .ca_rt-item {
		box-shadow: none;
	}
	.ca_rt-item {
		border-radius: 0;
		margin: 0;
	}
	.ca_recent-topics ul.topics .row:last-child {
		border-width: 0;
	}
}
  • 1
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!

romaamor 06 окт 2020, 22:28 Сообщение

Интересует такой вопрос - а можно таким же макаром сделать форумы не горизонтальным списком а квадратами ?
  • 0

CabinetAdmin 07 окт 2020, 11:57 Сообщение

У меня есть стиль в разработке с блоками вместо списка, может быть я его когда нибудь всё таки добью и опубликую.
Если нужно готовое решение, то вот например стиль с официальной поддержки https://www.phpbb.com/customise/db/styl ... 3/demo/3.2. Можно скопировать оттуда шаблон и стили для этого места.
  • 0
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!

romaamor 07 окт 2020, 14:24 Сообщение

CabinetAdmin писал(а): 07 окт 2020, 11:57 сли нужно готовое решение, то вот например стиль с официальной поддержки
Пробовал я этот стиль. Криво получается. Есть ещё несколько попыток такое создать, но у всех недостатки с отображением. CSS страдает. Наверно по этому такой вид стиля не популярный у разработчиков.
CabinetAdmin писал(а): 07 окт 2020, 11:57 У меня есть стиль в разработке с блоками вместо списка, может быть я его когда нибудь всё таки добью и опубликую.
А есть демо версия для просмотра онлайн ? Что бы посмотреть, оценить фигуру. Так сказать - пощупать.
  • 0

Похожие темы