Как спрятать сообщение под спойлер на форуме

Обновлено: 08.07.2024

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

В ряде браузеров нельзя сделать inline-элементом

Текст до тега . Метка Длинное спрятанное содержимое переносится всей строкой отдельно от предыдущего и последующего текста. В браузерах разночтение. Текст после закрывающегося тега .

Вложенный в тег

Ссылка внутри

Сделать плавное открытие и скрытие блока

Не получается анимировать блок, когда тот сворачивается. В Mozilla Firefox при display: contents; элемент раскрывается и его состояние тогда можно менять стилями.

— Это водка? — слабо спросила Маргарита.
Кот подпрыгнул на стуле от обиды.
— Помилуйте, королева, — прохрипел он, — разве я позволил бы себе налить даме водки? Это чистый спирт!

Свежесть бывает только одна — первая, она же и последняя. А если осетрина второй свежести, то это означает, что она тухлая!

— Вы не Достоевский, — сказала гражданка, сбиваемая с толку Коровьевым.
— Ну, почем знать, почем знать, — ответил тот.
— Достоевский умер, — сказала гражданка, но как-то не очень уверенно.
— Протестую, — горячо воскликнул Бегемот. — Достоевский бессмертен!

Блок раскрывается при щелчке по кнопке, а не по всей строке

Текст "открыть/закрыть" при развёртывании и свёртывании содержимого

Поменять стрелочку на знаки плюс и минус

Код закрывающейся метки внизу блока

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

ˇ Простой спойлер

Визуально спойлер представляет собой элемент разметки html-страницы, позволяющий свернуть текст и (или) изображение.
Кликнув на этот элемент, можно посмотреть его содержимое.
Например:

Прикрепленное изображение

Прикрепленное изображение

Прикрепленное изображение

Прикрепленное изображение

Прикрепленное изображение

Спойлер с названием

Визуально этот элемент выглядит так:

Прикрепленное изображение

Прикрепленное изображение

Прикрепленное изображение

Для заголовка спойлера применимы все функции форматирования текста, такие как:
– толщина шрифта (жирный шрифт)
– наклонный шрифт
– подчеркнутый шрифт
– перечеркнутый шрифт
– размер шрифта
– цвет шрифта.
Например:

Приведенный пример служит исключительно для демонстрации возможностей оформления спойлера и не должен использоваться как предмет подражания.

Добавьте кнопочку - свернутый текст! Часто первый пост оч объемный. Особенно в породных темах. Если больше кол-во текста будет под катом - будет намного проще и удобней, если часть первого поста будет скрыта - тем, кто часто заглядывает на ветку, будет удобнее разглядывать.

текст, текст, текст, текст, текст, текст, текст, текст,
текст, текст, текст, текст, текст, текст, текст, текст,

текст, текст, текст, текст, текст, текст, текст, текст,
текст, текст, текст, текст, текст, текст, текст, текст,
текст, текст, текст, текст, текст, текст, текст, текст,

Все, что не попадает в выделенный текст будет видимо без спойлера.

В кнопке специальные BB коды,также скрывается еще множество дополнительных инструментов редактирования, специально для тех, кто любит красивые, хорошо оформленные посты.

Вниманию модераторов и топикстартеров.
Если не удается сделать так, как предложено выше, потому что текст перенесен из другого места и имеет предварительное форматирование, то в окне редактирования, в котором вы набираете или вставляете текст, достаточно поставить в начале и в конце текста, который вы хотите скрыть два тега (то что в нашем примере находится в квадратных скобках вместе со скобками).:

 по хайду, спойлеру и другим BB-кодам | Инфобит - Лучший форум рунета 2020-10-25 11-07-32. jpg

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

На данный момент хайд имеют массу условий, по которым можно скрывать контент. Все эти функции собраны в одном удобном месте и доступны для каждого.
При нажатии на кнопку хайда появляется выпадающее меню со списком всех доступных функций:

 по хайду, спойлеру и другим BB-кодам | Инфобит - Лучший форум рунета 2020-10-25 11-10-53. jpg

Это обычный хайд, который скрывает контент от гостей.

Это основной хайд, который чаще всего используется на форуме.
Кнопка в меню:

 по хайду, спойлеру и другим BB-кодам | Инфобит - Лучший форум рунета 2020-10-25 11-23-15. jpg

Вставляет следующий код:

Не забываем указать число симпатий, неоходимых для просмотра контента!

 по хайду, спойлеру и другим BB-кодам | Инфобит - Лучший форум рунета 2020-10-25 11-26-35. jpg

Вставляет следующий код:

Ники пользователей нужно указывать самостоятельно при добавлении хайда!

 по хайду, спойлеру и другим BB-кодам | Инфобит - Лучший форум рунета 2020-10-25 11-27-53. jpg

Вставляет следующий код:

Нумерация групп:
2. Новичок
3. Админ
4. Мастер
5. Профи
8. Юзер
9. VIP
12. SuperVIP
16. Свой

Можно поставить хайд по количеству дней на форуме (со дня регистрации).

 по хайду, спойлеру и другим BB-кодам | Инфобит - Лучший форум рунета 2020-10-25 11-29-16. jpg

Вставляет следующий код:

Внимание!
Данный хайд можно использовать только в 2-х случаях:
1. При создании раздачи скрывать ссылку на скачивание.
2. При восстановлении мёртвых раздач, публикую новую ссылку.

Правила создания и оформления раздач | Инфобит - Лучший форум рунета 2020-10-23 12-20-29.jpg

Пример того, как должна выглядеть ссылка под хайдом:

1603437888411.jpg

Подробнее смотрите гифку-инструкцию, как ставить хайд:

Как будет выглядеть код:

ББ-код [THANKS][/THANKS] всегда располагается внутри, относительно других бб-кодов хайда.

Все инструкции по основным BB-кодам находятся в разделе Помощь на вкладке BB-коды.


На всем известном форуме 4PDA существует правило, прятать изображения под спойлер.
Мне кажется, это замечательное правило было бы уместно и на этом форуме.
Не очень то красиво смотрится страница форума с кучей огромных фотографий.
Представьте как бы смотрелся вот этот мой пост, если бы я не спрятал изображения под спойлер.
Для тех кто хочет посмотреть изображение\фото, ведь не сложно кликнуть по надписи Показать.

Возможно у кого то возникнут вопросы, а как этим спойлером пользоваться?
Вот инструкция:

Изображение

Кликните по кнопке Spoiler= Скриншот | Показать В поле написания поста появится код:

После знака = пишем название спойлера, например, Фото (не обязательно). Скриншот | Показать А между знаков ][ вставляем ссылку на изображение, или любую другую информацию которую хотим скрыть. Скриншот | Показать Не забывайте, чтобы изображение отображалось на форуме, ссылку на него нужно поместить в код:

Читайте также: