Images across in attachment

Vova_OB · Сообщение **Vova_OB** » 24.02.2011 19:29

угу
найду получше тултип плагин, поставлю на рабочий форум, и дам ссылку и инструкцию с пояснениями!

Vova_OB · Сообщение **Vova_OB** » 04.03.2011 8:25

Решил эту задачу по другому, но тоже эффективно и удобно

у меня 3.0.6 subsilver2

Прикреплено файл, в нем 2е папки оригиналы файлов и мои которые стоят сейчас на сервере + инструкция
сравните исходники с редактированными и важный момент в этом файле attachment.html, тут в этой теме создавали отдельные условия для img attachments и img, я сделал по другому условие вывода описания поместил во внутрь тегов каждого типа вложения (кроме image attachments и img)и убрал его с того места где стояло (в инструкции есть)

Но еще подключил всплывающие подсказки к img attachments и img и плагин lightbox2 (скачать с сайта разработчика)

ссылка на рабочий пример в файле инструкции

yordanp · Сообщение **yordanp** » 30.11.2011 9:37

Я применил инструкции Shredder - inline_attachments.zip
Images across in attachment

Изображения располагаются правильно в горизонтальный ряд, но при добавление комментария к ним, изображения снова располагаются вертикально.

Пример:

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

[attachment=0]1.jpg[/attachment][attachment=2]2.jpg[/attachment][attachment=1]3.jpg[/attachment] 
Текст, текст, текст, текст, текст, текст, текст, текст, текст, текст, текст, текст, текст, текст, текст, текст, текст, текст, текст, текст, текст, текст, текст

Во втором посте добавил комментарии к изображением.
http://prikachi.com/images/609/4093609m.jpg

Можно ли сделать так, чтобы при добавлении комментариев к файлу, изображения не перемещались в вертикальный ряд? И чтобы ширина комментария соответствовала ширине изображения.

Пример:
http://prikachi.com/images/709/4093709s.jpg

Текущая версия: 3.0.9
Стиль: Subsilver2

Shredder · Сообщение **Shredder** » 30.11.2011 11:31

yordanp писал(а):Изображения располагаются правильно в горизонтальный ряд, но при добавление комментария к ним, изображения снова располагаются вертикально.

Так и задумано.

Можно ли сделать так, чтобы при добавлении комментариев к файлу, изображения не перемещались в вертикальный ряд? И чтобы ширина комментария соответствовала ширине изображения.

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

AHTEPO · Сообщение **AHTEPO** » 08.01.2012 15:18

Вот моя версия для prosilver с установленным highslide. Кратко об отличиях с сабжем: иконки в ряд в любом случае, и вставленные через BB-код и не вставленные, с комментарием и без.
При вставке комментария иконки остаются в ряд. Комментарий, если он есть, отображается во всплывающей подсказке (размер 1.2em), появляющейся при наведении на иконку. Подсказка кроме комментария, отображает ещё и размер файла и количество просмотров. Тоже самое отображается и во всплывшем через highslide оригинале.
Находясь в тексте, через BB, иконки не препятствуют переходу на новую строку.
Итак, понеслась:

Открыть viewtopic_body.html
Найти:

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

			<!-- IF postrow.S_HAS_ATTACHMENTS -->
				<dl class="attachbox">
					<dt>{L_ATTACHMENTS}</dt>
					<!-- BEGIN attachment -->
						<dd>{postrow.attachment.DISPLAY_ATTACHMENT}</dd>
					<!-- END attachment -->
				</dl>
			<!-- ENDIF -->

Заменить на:

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

			<!-- IF postrow.S_HAS_ATTACHMENTS -->
				<div class="attachbox">
					<h4>{L_ATTACHMENTS}</h4><hr />
					<!-- BEGIN attachment -->
						<div class="thumbnail">{postrow.attachment.DISPLAY_ATTACHMENT}</div>
					<!-- END attachment -->
				</div>
			<!-- ENDIF -->

Открыть attachment.html
Найти:

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

		<!-- IF _file.S_THUMBNAIL -->
		<dl class="thumbnail">
			<dd class="highslide-gallery"><a href="{_file.U_DOWNLOAD_LINK}/{_file.DOWNLOAD_NAME}" class="highslide" onclick="return hs.expand(this, { slideshowGroup: '{_file.THUMB_POST_ID}' })"><img src="{_file.THUMB_IMAGE}" alt="{_file.DOWNLOAD_NAME}" title="{_file.DOWNLOAD_NAME} ({_file.FILESIZE} {_file.SIZE_LANG}) {_file.L_DOWNLOAD_COUNT}" /></a><div class="highslide-caption">{_file.DOWNLOAD_NAME} ({_file.FILESIZE} {_file.SIZE_LANG}) {_file.L_DOWNLOAD_COUNT}</div></dd>
			<!-- IF _file.COMMENT --><dd> {_file.COMMENT}</dd><!-- ENDIF -->
		</dl>
		<!-- ENDIF -->

Заменить на:

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

		<!-- IF _file.S_THUMBNAIL -->
		<div class="thumbnail">
			<a href="{_file.U_DOWNLOAD_LINK}/{_file.DOWNLOAD_NAME}" class="highslide" onclick="return hs.expand(this, { slideshowGroup: '{_file.THUMB_POST_ID}' })" title="<!-- IF _file.COMMENT --><span style='font-size:1.2em;'>{_file.COMMENT}</span><br /><!-- ENDIF -->({_file.FILESIZE} {_file.SIZE_LANG}) {_file.L_DOWNLOAD_COUNT}"><img src="{_file.THUMB_IMAGE}" alt="" /></a><div class="highslide-caption"><!-- IF _file.COMMENT --><span style="font-size:1.2em;">{_file.COMMENT}</span><br /><!-- ENDIF --><span style="font-size:0.8em;">({_file.FILESIZE} {_file.SIZE_LANG}) {_file.L_DOWNLOAD_COUNT}</span></div>
		</div>
		<!-- ENDIF -->

Открыть content.css
Найти:

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

.content h2, .panel h2 {

Вставить перед:

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

.content br {
   clear: left;
}

Найти:

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

div.inline-attachment dl.thumbnail, div.inline-attachment dl.file {
	display: block;
	margin-bottom: 4px;
}

Заменить на:

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

div.inline-attachment dl.file {
	display: block;
	margin-bottom: 4px;
}

div.inline-attachment {
	display: block;
}

div.thumbnail {
	width: auto;
	float: left;
	margin: 2px;
}

Теперь всё как я хотел.

Удачи, друзья.

sinister · Сообщение **sinister** » 20.07.2012 4:11

Поместил полную инструкцию для subsilver2 во вложении.
update:
заменил на версию с <div>'ами

наконец то нашел картинки в строчку для subsilver2

спасибо тебе
и еще прикрутил Highslide-4.1.8-Mod-v4.0.5 вообще класс

Di_Mok · Сообщение **Di_Mok** » 07.12.2012 12:38

AHTEPO писал(а):Вот моя версия для prosilver с установленным highslide.

Кстати, можно чуть облагородить это решение.

Когда в сообщении размещены изображения разной высоты, выглядит это довольно небрежно:

bef.JPG

Лечится так:

в /highslide/highslide.css

найти

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

.highslide img {	
border: 2px solid silver;

добавить после

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

height: 240px;

(вместо 240px ставите значение на свой вкус, с "привязкой к местности")

Получается не много нарядней:

aft.JPG

shakal · Сообщение **shakal** » 02.06.2013 15:01

AHTEPO писал(а):Вот моя версия для prosilver с установленным highslide. Кратко об отличиях с сабжем: иконки в ряд в любом случае, и вставленные через BB-код и не вставленные, с комментарием и без.
При вставке комментария иконки остаются в ряд. Комментарий, если он есть, отображается во всплывающей подсказке (размер 1.2em), появляющейся при наведении на иконку. Подсказка кроме комментария, отображает ещё и размер файла и количество просмотров. Тоже самое отображается и во всплывшем через highslide оригинале.
Находясь в тексте, через BB, иконки не препятствуют переходу на новую строку.
Итак, понеслась:

Открыть viewtopic_body.html
Найти:
Код: Выделить всё
			
				<dl class="attachbox">
					<dt>{L_ATTACHMENTS}</dt>
					
						<dd>{postrow.attachment.DISPLAY_ATTACHMENT}</dd>
					
				</dl>
			
Заменить на:
Код: Выделить всё
			
				<div class="attachbox">
					<h4>{L_ATTACHMENTS}</h4><hr />
					
						<div class="thumbnail">{postrow.attachment.DISPLAY_ATTACHMENT}</div>
					
				</div>
			
Открыть attachment.html
Найти:
Код: Выделить всё
		
		<dl class="thumbnail">
			<dd class="highslide-gallery"><a href="{_file.U_DOWNLOAD_LINK}/{_file.DOWNLOAD_NAME}" class="highslide" onclick="return hs.expand(this, { slideshowGroup: '{_file.THUMB_POST_ID}' })"><img src="{_file.THUMB_IMAGE}" alt="{_file.DOWNLOAD_NAME}" title="{_file.DOWNLOAD_NAME} ({_file.FILESIZE} {_file.SIZE_LANG}) {_file.L_DOWNLOAD_COUNT}" /></a><div class="highslide-caption">{_file.DOWNLOAD_NAME} ({_file.FILESIZE} {_file.SIZE_LANG}) {_file.L_DOWNLOAD_COUNT}</div></dd>
			<dd> {_file.COMMENT}</dd>
		</dl>
		
Заменить на:
Код: Выделить всё
		
		<div class="thumbnail">
			<a href="{_file.U_DOWNLOAD_LINK}/{_file.DOWNLOAD_NAME}" class="highslide" onclick="return hs.expand(this, { slideshowGroup: '{_file.THUMB_POST_ID}' })" title="<span style='font-size:1.2em;'>{_file.COMMENT}</span><br />({_file.FILESIZE} {_file.SIZE_LANG}) {_file.L_DOWNLOAD_COUNT}"><img src="{_file.THUMB_IMAGE}" alt="" /></a><div class="highslide-caption"><span style="font-size:1.2em;">{_file.COMMENT}</span><br /><span style="font-size:0.8em;">({_file.FILESIZE} {_file.SIZE_LANG}) {_file.L_DOWNLOAD_COUNT}</span></div>
		</div>
		
Открыть content.css
Найти:
Код: Выделить всё
.content h2, .panel h2 {
Вставить перед:
Код: Выделить всё
.content br {
   clear: left;
}
Найти:
Код: Выделить всё
div.inline-attachment dl.thumbnail, div.inline-attachment dl.file {
	display: block;
	margin-bottom: 4px;
}
Заменить на:
Код: Выделить всё
div.inline-attachment dl.file {
	display: block;
	margin-bottom: 4px;
}

div.inline-attachment {
	display: block;
}

div.thumbnail {
	width: auto;
	float: left;
	margin: 2px;
}
Теперь всё как я хотел. Удачи, друзья.

сделал все как тут, но картинки как стояли в столбик так и стоят. что делать?
http://forum.domostroy42.ru/viewtopic.php?f=8&t=1416

Slash · Сообщение **Slash** » 02.06.2013 15:09

shakal писал(а):что делать?

Обновите темы, шаблоны, почистите кэш.
У меня работает...

Добавлено спустя 2 минуты 8 секунд:
Кстати: в attachment.html, заменил:

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

<span style="font-size:1.2em;">{_file.COMMENT}</span><br />

на {_file.COMMENT} так как в некоторых обозревателях появляются эти теги во всплывающем окне.

shakal · Сообщение **shakal** » 02.06.2013 23:28

Raisin писал(а):Кстати: в attachment.html, заменил:
Код: Выделить всё

<span style="font-size:1.2em;">{_file.COMMENT}</span><br />

на {_file.COMMENT} так как в некоторых обозревателях появляются эти теги во всплывающем окне.

заменил все как написано выше.. прочистил все. результата 0.

shakal · Сообщение **shakal** » 06.06.2013 15:03

AHTEPO писал(а):
<div class="thumbnail">
<a href="{_file.U_DOWNLOAD_LINK}/{_file.DOWNLOAD_NAME}" class="highslide" onclick="return hs.expand(this, { slideshowGroup: '{_file.THUMB_POST_ID}' })" title="<span style='font-size:1.2em;'>{_file.COMMENT}</span><br />({_file.FILESIZE} {_file.SIZE_LANG}) {_file.L_DOWNLOAD_COUNT}"><img src="{_file.THUMB_IMAGE}" alt="" /></a><div class="highslide-caption"><span style="font-size:1.2em;">{_file.COMMENT}</span><br /><span style="font-size:0.8em;">({_file.FILESIZE} {_file.SIZE_LANG}) {_file.L_DOWNLOAD_COUNT}</span></div>
</div>

где то в этом коде недочет. т. к появляется такая фигня

1.jpg

Сообщение **Татьяна5** » 06.06.2013 15:44

shakal
решение чуть выше, через пост

shakal · Сообщение **shakal** » 06.06.2013 16:29

Татьяна5 писал(а):решение чуть выше, через пост

это решение я понял. но как сделать чтобы комментарий был вверху и размер с просмотрами внизу?

artmichurinsk · Сообщение **artmichurinsk** » 18.01.2014 15:12

имеется такой код:

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

<!-- IF _file.S_THUMBNAIL -->
			<div class="highslide-gallery">
				<a href="{_file.U_DOWNLOAD_LINK}/{_file.DOWNLOAD_NAME}" class="highslide" onclick="return hs.expand(this, { captionText: '<!-- IF _file.COMMENT -->{_file.COMMENT}<!-- ENDIF -->' } )"><img src="{_file.THUMB_IMAGE}" alt="{_file.TOPIC_TITLE}" /></a><br />
				<div class="highslide-caption"></div>
			</div>
		<!-- ENDIF -->
		
		<!-- IF _file.S_IMAGE -->
			<img src="{_file.U_INLINE_LINK}" alt="{_file.TOPIC_TITLE}" /><br />
			
		<!-- ENDIF -->

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

Shredder · Сообщение **Shredder** » 18.01.2014 15:31

artmichurinsk
Вот так:
http://www.phpbb-work.ru/vistraivaem-ka ... d-t14.html

phpBB Guru - Официальная русская поддержка форума phpBB

Images across in attachment

Re: Images across in attachment

Re: Images across in attachment

Re: Images across in attachment

Re: Images across in attachment

Re: Images across in attachment

Re: Images across in attachment

Re: Images across in attachment

Re: Images across in attachment

Re: Images across in attachment

Re: Images across in attachment

Re: Images across in attachment

Re: Images across in attachment

Re: Images across in attachment

Re: Images across in attachment

Re: Images across in attachment