Катя (lytdybr) wrote in school_lj,
Катя
lytdybr
school_lj

Как сделать важные вещи при помощи LJ-тегов

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



Итак, с помощью различных lj-тегов вы можете:

Скрыть часть записи для френдленты и дневника или убрать под кат

<lj-cut [text="Заголовок"]> ... Скрываемый текст ... [</lj-cut>]


Данная конструкция позволяет позволяет делать ссылку «подробнее», разделяя запись на ее анонс и полную версию. Самое распространенное применение — перенос «под кат» всех, кроме первой, фотографий в репортаже или отчете от путешествии. При длинных записях крайне рекомендуется к применению, так как значительно упрощает чтение дневника и френдлент для друзей.

Особенности:

  • применение возможно только в записях;
  • не имеет эффекта на странице самой записи;
  • при переходе на определенную ветку комментариев в записи (thread) текст самой записи отображается до первого lj-cut, если он имеется.

Примеры:

<lj-cut /> — Скрывает весь текст, идущий после тега, а сама ссылка будет называться «Читать далее» (или «Read more» в английской локализации);

<lj-cut text="Все фотографии, 20Мб" /> — Скрывает весь текст, идущий после тега, а сама ссылка будет называться «Все фотографии, 20Мб»;

<lj-cut text="Подробности">скрываемая часть записи</lj-cut> — Скрывает часть записи, идущую после открывающего и до закрывающего тегов, ссылка при этом будет называться «Подробности».

Упомянуть пользователя или сообщество LiveJournal

<lj user="username" [title="альтернативное имя"] />


Наболее правильный способ сделать ссылку на другой журнал или сообщество, так как LiveJournal в данном случае выведет ее со всеми вспомогательными элементам, а именно с головастиком и ссылкой на профиль, правильным именем и ссылкой на журнал, контекстным меню и памяткой (доступно только платным аккаунтам), если она установлена у читающего. Также с помощью параметра title можно заменить название дневника на произвольный текст.

Особенности:

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

Примеры:

<lj user="igrick" />igrick

<lj user="igrick" title="Илья" /> — Илья

<lj user="ridus-news" />tosma

<lj user="ridus-news" title="Сообщество гражданской журналистики" />Сообщество гражданской журналистики

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

<lj-repost [button="название кнопки"]> [ ... текст записи </lj-repost>]


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

Особенности:

  • применение возможно только в записях;
  • кнопка устанавливается в месте закрывающего тега, если выбран фрагмент записи;
  • кнопка устанавливает в месте открывающего тега, если фрагмент не определен, т.е. для репоста выбрана вся запись;
  • если фрагмент не определен, тогда каждый репост публикуется вместе с самой кнопкой, сохраняющей адрес оригинала;
  • не все lj-теги могут наследоваться при репостах.

Примеры:

<lj-repost /> — Вставляет кнопку с именем «repost» для «репоста» записи целиком;

<lj-repost button="Поделиться с друзьями" /> — Вставляет кнопку с текстом «Поделиться с друзьями» для «репоста» записи целиком;

Начало записи... <lj-repost button="Поделиться"> ...Середина записи...</lj-repost> ...Конец записи — Вставляет кнопку с текстом «Поделиться» для «репоста» части записи, в данном случае текста «Середина-Записи», при этом кнопка будет вставлена между «Середина-Записи» и «Конец-Записи»

Вставить в запись кнопки от социальных сетей

<lj-like [buttons="facebook, google, vkontakte, twitter, livejournal, ..."] />


Позволяет вставить популярные кнопки от различных социальных сетей, а именно:

  • «Recommend» от Facebook (facebook или fb);
  • «+1» от Google (google или go);
  • «♥» от «ВКонтакте» (vkontakte или vk);
  • «Tweet» от Twitter (twitter или tw);
  • «+10 жетонов» от LiveJournal (livejournal или lj);

Особенности:

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

Примеры:

<lj-like /> — Вставит все доступные по умолчанию кнопки для региона автора записи;

<lj-like buttons="vkontakte" /> — Вставит только одну кнопку от vKontakte независимо от региона автора;

<lj-like buttons="google, facebook" /> — Вставит две кнопки — «+1» от Google и «Recommend» от FaceBook, именно в данной последовательности и независимо от региона автора;

Вставить в запись интерактивную карту

<lj-map url="адрес-карты" [width="W"] [height="H"] />

Позволяет встроить в запись интерактивную карту от Яндекс или Google. Для вставки необходимо зайти на один из вышеупомянутых сервисов и сгенерировать ссылку на требуемый фрагмент карты.

Особенности:

  • пока поддерживается только Яндекс и Google;
  • не все персональные настройки карты могут быть перенесены в запись, так как это зависит от способа формирования URL-фрагмента конкретного сервиса;
  • применимо как в записях, так и в комментариях;
  • закрывающий тег не требуется.

Примеры:

<lj-map url="http://maps.google.com/maps?saddr=%D0%BA%D0%B8%D0%BD%D0%BE%D1%82%D0%B5%D0%B0%D1%82%D1%80+%D0%BF%D1%83%D1%88%D0%BA%D0%B8%D0%BD%D1%81%D0%BA%D0%B8%D0%B9&daddr=%D0%BC%D0%B5%D1%82%D1%80%D0%BE+%D0%B0%D1%80%D0%B1%D0%B0%D1%82%D1%81%D0%BA%D0%B0%D1%8F&hl=en&ie=UTF8&ll=55.75837,37.603111&spn=0.031102,0.090723&sll=55.75639,37.602081&sspn=0.031104,0.090723&geocode=FcjsUgMdctg9AiEj4Q64OwjKaSmdTg7bQEq1RjEKGqXlRh0ung%3BFb61UgMdD8E9AilFqJS9TUq1RjECLka9odjtRw&mra=ltm&dirflg=w&z=14" width="800" height="600" /> — Вставит карту от Google, показывающую пеший маршрут от кинотеатра «Пушкинский» до станции метро «Арбатская», а именно:

Вставить в запись разрешенный embed

<lj-embed [width="W"] [height="H"]>embed-код</lj-embed>

Позволяет вставить любой разрешенный embed, использующий iFrame или Flash. Применять тег имеет смысл только в том случае, если необходимо проконтролировать ширину и высоту embed'а, т.е. задать параметры width и height. Во всех остальных случаях, т.е. когда embed вставляется без обрамляющих тегов, данные теги добавляются автоматически с автоопределением ширины и высоты.

<lj-embed width="640" height="390"><iframe  src="http://www.youtube.com/embed/WdVT0EWBtW8" frameborder="0" allowfullscreen></iframe></lj-embed>  Вставит в ЖЖ клип «Потап и Настя - Чумачечая Весна», т.е.:

Создать и вставить в запись опрос

<lj-poll [name="имя опроса"] [whovote="кто может голосовать"] [whoview="кто может видеть результаты"]>    <lj-pq type="тип опроса">    Текст вопроса        <lj-pi>1-ый вариант ответа</lj-pi>        <lj-pi>2-й вариант ответа</lj-pi>        <lj-pi>3-ый вариант ответа</lj-pi>        <lj-pi>...</lj-pi>        <lj-pi>N-ый вариант ответа</lj-pi>    </lj-pq></lj-poll>

Позволяет вставить в запись новый опрос (доступно только платным пользователям и в платных сообществах). Ввиду того, что построить опрос вручную, т.е. путем конфигурации тегов, достаточно сложно, я не буду останаливаться подробно на их типах, но крайне рекомендую использовать для его этого специальный визард — www.livejournal.com/poll/create.bml

Пример:

<lj-poll whovote="all" whoview="all"><lj-pq type="radio">Есть ли жизнь на Марсе?<lj-pi>Есть</lj-pi><lj-pi>Нет</lj-pi><lj-pi>Науке это еще неизвестно</lj-pi></lj-pq></lj-poll> — Вставит в запись риторический вопрос про жизнь на Марсе.

Отключить автоформатирование для всей записи или ее части

<lj-raw>текст</lj-raw>

Позволяет отключить автоформатирование, что в основном касается переносов строк, для всего текста записи или его части, помещенной между открывающим и закрывающим тегом. Полезно для тех пользователей, которые используют HTML для оформления своих записей, так как дает контроль над тем, что LiveJournal попытается преобразовать, а что нет. Вся данная запись написано с lj-raw от начала и до конца.

Создать запись на нескольких языках

<lj-lang-container>    [<lj-lang include="буквенный код языка, ...">текст для выбранного языка</lj-lang>]    ...    <lj-lang otherwise>текст по умолчанию при отсутствии определенного языка</lj-lang></lj-lang-container>

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

Пример:

<lj-lang-container>    <lj-lang include="ru, ua">Добро пожаловать!</lj-lang>    <lj-lang include="en">Welcome!</lj-lang>    <lj-lang include="de">Willkommen!</lj-lang>    <lj-lang include="it">Benvenuto!</lj-lang>    <lj-lang include="ch">歡迎!</lj-lang>    <lj-lang otherwise>We don't speak Mexican here</lj-lang></lj-lang-container> — Выводит приветствие в зависимости от языка посетителя, и «We don't speak Mexican here» в случае, если ни один из языков не подходит. Таким образом, для вас приветствие будет звучать так — Welcome!



На данный момент, думаю, хватит. За основу урока взята запись главного по ЖЖ igrick (потому что сама я так красиво кодом оформить бы точно не смогла) — он довольно часто про ЖЖ всякое интересное пишет.


Будете этими тегами пользоваться? :)

Tags: немного об html, новичку в помощь
  • Post a new comment

    Error

    Anonymous comments are disabled in this journal

    default userpic

    Your IP address will be recorded 

  • 66 comments