HTML-теги, которые вам пригодятся при публикации статьи
Краткое содержание:
1. Вставляем картинки в посты и комментарии
2. Вставляем видео в посты и комментарии
3. Ставим кат
4. Прячем ссылку под текст
5. Прячем ссылку под картинку и делаем превью картинки
6. Цитируем собеседника в комментариях
7. Первые четыре кнопки на панели, или Сила эмоций и оговорочки по Фрейду
1. Вставляем картинки в посты и комментарии.
Бывает так, что попадается вам какая-нибудь картинка, которую вы очень хотите вставить в пост/комментарий, но не знаете, как. С постами всё просто: нажимаете предпоследнюю кнопку на панельке
, загружаете файлы на сервер, и всё готово само собой. А как же комментарии?Тут можно поступить двумя способами.
Первый, подсказанный уважаемым 2tw_Ant: создаёте пост, сохраняете его у себя в черновиках и заливаете туда картинки, которые хотите опубликовать. А затем берёте готовую ссылку и вставляете её в комментарий.
Второй вариант потруднее, но зато он экономит место на сервере и избавляет вас от возни с черновиками. Вам понадобится этот код:
<img src="">Далее просто копируете адрес картинки (нажимаем правой кнопкой мышки, выбираем пункт «копировать адрес изображения») и вставляете этот адрес в кавычки в коде. Вуаля!
Что делать, если картинка у вас на компьютере? Всё просто. Выбираете любой бесплатный хостинг изображений, например radikal.ru, затем загружаете на него картинку — и получаете на выбор кучу ссылок. Рекомендую взять первую, прямую ссылку, и вставить её в написанный выше код.
Пожелуйста, не используйте ссылки, в которых есть квадратные скобки и всякие теги вроде [IMG]. Это несколько другой формат тегов, и картинка просто не отобразится.
2. Вставляем видео в посты и комментарии.
Оно вставляется ну до смешного просто: берём нужное видео, ищем ссылку на встраивание (на русских хостингах вроде Рутуба или русскоязычного Ютуба — слово «Встроить», на англоязычных — «Share»), нажимаем, копируем текст, который вам выдаётся, и вставляем его в комментарий. Просто так, без всяких тегов.
Например, идём на ютуб, вот сюда: Нажимаем кнопку «Встроить». Нам повезло — пользователь разрешил встраивание! Копируем открывшийся код:
<object width="480" height="385"><param name="wmode" value="opaque"></param><param name="wmode" value="opaque"></param><param name="movie" value="http://www.youtube.com/v/ZPBpXlZumNg&hl=ru_RU&fs=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/ZPBpXlZumNg&hl=ru_RU&fs=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"></embed></embed></param></param></embed></object>Примечание для тех, кто вставляет видео в пост: ни в коем случае не используйте кнопку встраивания видео (третья справа на панели
). Не знаю почему, но она не работает так, как ей стоило бы, и ваше видео не отобразится. Ограничьтесь просто скопированным кодом, кнопка ни к чему.Добавление от админа: а у меня работает, просто ссылку надо вставлять с одним параметром v, без всяких прочих:&feature=player_embedded<video>http://www.youtube.com/watch?v=ZPBpXlZumNg</video>
Пробуем:
3. Ставим кат (cut).
Что может быть проще? Вам помогут либо волшебные ножницы на панели
, либо вот этот код: <cut>Согласно правилам хорошего тона, принятым в Институте благородных девиц-и-не-только-девиц, кат нужно ставить в следующих случаях:
а) Когда у вас длинный-предлинный текст. Поражать воображение читателя лучше не сразу. Поставьте кат после первого абзаца, а то и после пары-тройки предложений — пусть читатель привыкает к мощи вашей мысли постепенно.
б) Когда у вас в посте много картинок. Как говорили древние люди, охотясь на мамонтов, много — это больше двух. Поэтому ставьте кат после первых двух фотографий, и удачной вам охоты.
в) Когда в вашем посте есть нечто, что категорически не следует видеть беременным женщинам, детям до 18, нервным и впечатлительным людям и вашей бабушке. Материалы, содержащие эротику, насилие или всякую разную жуть, безусловно относятся к подобным вещам. Так что под кат, господа, незачем зря тревожить Скотланд-ярд.
Кстати, если вам захотелось, чтоб скрытым был не весь пост, а только его часть, это тоже очень просто. Всего лишь поставьте в том месте, в котором хотите продолжить общедоступную часть поста, закрывающий тег:
</cut>Совет от уважаемого Despair: если вы хотите, чтоб вместо надписи «читать дальше» пользователей под кат приглашала другая фраза (например, «Оставь надежду, всяк сюда входящий») — пользуйтесь вот этим кодом:
<cut name="Ваш текст">4. Прячем ссылку под текст.
Нам всем хочется, чтоб то, что мы делаем, выглядело красиво. В том числе и оставляемые нами ссылки. Как вы думаете, что красивее — скороговоркой пробормотать «Господа, у нас тут, понимаете ли, сайт steampunker.ru/» или снисходительно так, с улыбкой произнести «Добро пожаловать на Стимпанкер!»
Итак, чтоб наши ссылки были красивыми, можно опять же воспользоваться двумя методами, дающими один результат. С автоматизацией: наша любимая панель
(для комментариев она в несколько укороченном виде, но нужная кнопка там тоже есть). Выбираем кнопку в виде двух звеньев цепи, которая пятая слева, и жмём на неё. Вставляем ссылку. Всё, готовый код! А как добавить слово, под которым прячется ссылка — смотрите ниже.Способ неавтоматизированный: пишем руками следующий код
<a href="ваша ссылка">слово, за которым вы её прячете</a>Это та же самая ссылка, которая бы получилась при нажатии кнопки. Только тут, как видите, мы ещё и добавили слова, которыми она будет отображаться. Слов может быть и несколько. Итак, написав код
<a href="http://steampunker.ru/">тут всё просто</a>— вы с лёгкостью можете сообщить всему сайту, что тут всё просто!
5. Прячем ссылку под картинку и делаем превью картинки
Предыдущий способ ставить ссылки можно слегка разнообразить. В самом деле, зачем что-то говорить, когда можно улыбнуться и показать табличку?
Итак, вспоминаем предыдущий код
<a href="http://steampunker.ru/"></a><img src="http://steampunker.ru/templates/skin/new/images/steampunker_logo.png">И комбинируем, вставляя код вставки картинки туда, где должно находиться слово-описание ссылки:
<a href="http://steampunker.ru/"><img src="http://steampunker.ru/templates/skin/new/images/steampunker_logo.png"></a>Щёлкните-ка по логотипу. Чудеса, правда?
Ну а что делать, если у нас есть две одинаковые картинки, большая и маленькая, и нам хочется, чтоб при клике на маленькую открывалась большая? Делать практически то же самое.
Берём адрес маленькой картинки и делаем из него код вставки изображения:
<img src="http://s57.radikal.ru/i158/1007/e3/246b1e28ed32t.jpg">Затем берём код вставки ссылки, но вместо адреса странички вставляем в него адрес большой картинки:
<a href="http://s57.radikal.ru/i158/1007/e3/246b1e28ed32.jpg"></a>И комбинируем всё это дело вместе, как я уже описала выше:
<a href="http://s57.radikal.ru/i158/1007/e3/246b1e28ed32.jpg"><img src="http://s57.radikal.ru/i158/1007/e3/246b1e28ed32t.jpg"></a>И теперь вы можете не портить себе зрение, пытаясь разобрать, что же нарисовано на маленькой превьюшке. Просто щёлкните по ней — и вы увидите полноразмерную красивую картинку. Кстати, кто её автор, я не знаю. =) Ну, щёлкните же!
6. Цитируем собеседника в комментариях
В жарком споре, настояв на своём и добившись публичного признания своей правоты, мало кто из нас удерживается от того, чтоб не упомянуть с ехидцей в голосе слова оппонента, добавив затем «Вы так говорили, и вы неправы!» А как же это сделать тут? Да проще простого.
— наша незаменимая, родная и милая панель обладает замечательной кнопочкой в виде кавычек. Просто выделяете в посте или комментарии собеседника текст, который хотите процитировать, и нажимаете на кавычки. Всё, дальше можно не беспокоиться! Цитата, заверенная виртуальным нотариусом, уже у вас в комментарии.Если же вам по какой-то причине не хочется нажимать кнопочку, вот нужный код:
<blockquote>Копируем цитату, вставляем сюда</blockquote>А здесь доказываем, что сэр Генри неправ во всём, начиная с собственного рождения.— Итак, господа, сэр Генри публично оскорбил меня 25 марта 2009 года, и ныне я об этом вспомнил и предъявляю вам текст его оскорбления:
Лорд Вестерн есть не кто иной, как проходимец, негодяй и подлец, и это заявляю вам я, сэр Генри!
Разумеется, общественность будет на вашей стороне, ибо у вас достаточно улик.
7. Первые четыре кнопки на панели, или Сила эмоций и оговорочки по Фрейду.
Что-то мы ещё упустили, не так ли? Давайте внимательно поглядим на нашу панель ещё раз. Обещаю, это последний!Мы не поговорили о первых четырёх кнопках. Да, я знаю, что большинство из вас сейчас возмущённо скажет «Нас что, считают за чайников?!» Не обижайтесь, господа. Когда я 6 лет назад первый раз в жизни увидела просторы интернета, я чуть с ума не сошла от подобных кнопочек. Моё счастье, что я быстро во всём этом разобралась — а кто-то, возможно, и посейчас разобраться не может. Мануал — так от начала до конца. В конце концов, можете это просто не читать.)
Итак, первая кнопка B помогает вам написать текст жирным шрифтом. Например для того, чтоб выразить что-то особо важное, начиная от ударения в слове и заканчивая вашими эмоциями.
<b>Текст, как вы понимаете, пишется тут.</b>Впрочем, можно просто выделить уже написанный вами текст и нажать на кнопку, всё само сделается. Вторая кнопка I выделяет текст курсивом.
Третья кнопка U подчёркивает ваш текст.
И наконец четвёртая кнопка
Другие полезные заметки:
Основной функционал при чтении топика (публикации, статьи)
Подробно о комментариях
Описание страницы коллективного блога
Мануал создан Zet_Centralia, за что ей огромное спасибо. Обсудить данную заметку и задать вопросы можно тут.