Страница 1 из 2

Новые Би-Би-кодовые кнопочки в форме ответа. Учимся.

СообщениеДобавлено: 01 дек 2010, 09:30
Сергий
Быть может некоторые из вас заметили, что в форме ответа прибавилось кнопочек. Они созданы на основе пользовательского Би-Би-кода и призваны облегчить написание постов.
В этой теме я презентую новые кнопочки и расскажу о том, как их использовать.

Краткий экскурс по нашим Би-Би-кнопкам:


Обратили внимание на то, что заголовок статьи распологается по центру? Раньше этого сделать было нельзя. Теперь же нет ничего невозмодного. Пишим фразу, выделяем её курсором и нажимаем кнопочку "center"
Получаем:
Код: Выделить всё
[center]Краткий экскурс по нашим Би-Би-кнопкам:[/center]

Ну, или сначала кликаем на упомянутую кнопочку, а затем, между тегами
Код: Выделить всё
[center]и[/center]
пишем нужную нам фразу.
В итоге получится:
Краткий экскурс по нашим Би-Би-кнопкам:

Ну а я, кроме того, раскрасил надпись другим цветом (палитра находится справа от основного окна в форме ответа), выделил жирным (ну это старая кнопочка "В", её наверняка все знают) и увеличил размер (с помощью старого окошка "размер шрифта"). В итоге, до того, как я отправил это сообщение, заголовок выглядел так:
Код: Выделить всё
[size=150][color=#800000][center][b]Краткий экскурс по нашим Би-Би-кнопкам:[/b][/center][/color][/size]


Это в кодовом виде. А после отправки получилось то, что вы видите в заглавии статьи. Кстати, не забываем про старую кнопочку "code". Она поможет нам поделиться с другими пользователями кодовым видом надписи. Вы видите код заголовка статьи потому, что я поместил его между тегами
Код: Выделить всё
[code]и[/code]
которые появились после нажатия этой кнопки.

Чтож, размещать текст посередине сообщения мы научились. Это называется выравнивание по центру. Также, благодаря другим новым кнопочкам, нам доступно выравнивание текста
по левой стороне поста


по правой стороне


и по ширине



Теперь разбираем как это делается:

Чтобы выравнять текст по левой стороне кликаем на кнопочку "left" и между тегами
Код: Выделить всё
[left]и[/left]
пишем текст. Для примера возьмём тот текст, что я написал вначале этого поста:
Быть может некоторые из вас заметили, что в форме ответа прибавилось кнопочек. Они созданы на основе пользовательского Би-Би-кода и призваны облегчить написание постов.
В этой теме я презентую новые кнопочки и расскажу о том, как их использовать.
Итак, до отправки сообщения, этот текст в кодовом виде будет выглядеть так:
Код: Выделить всё
[left]Быть может некоторые из вас заметили, что в форме ответа прибавилось кнопочек. Они созданы на основе пользовательского Би-Би-кода и призваны облегчить написание постов.
В этой теме я презентую новые кнопочки и расскажу о том, как их использовать.[/left]
А после отправки так:
Быть может некоторые из вас заметили, что в форме ответа прибавилось кнопочек. Они созданы на основе пользовательского Би-Би-кода и призваны облегчить написание постов.
В этой теме я презентую новые кнопочки и расскажу о том, как их использовать.

Точно также можно выравнять текст по правой стороне. Кликаем на кнопочку "right" и между тегами
Код: Выделить всё
[right]и[/right]
пишем текст. Возьмём тот текст:
Быть может некоторые из вас заметили, что в форме ответа прибавилось кнопочек. Они созданы на основе пользовательского Би-Би-кода и призваны облегчить написание постов.
В этой теме я презентую новые кнопочки и расскажу о том, как их использовать.
Итак, до отправки сообщения, этот текст в кодовом виде будет выглядеть так:
Код: Выделить всё
[right]Быть может некоторые из вас заметили, что в форме ответа прибавилось кнопочек. Они созданы на основе пользовательского Би-Би-кода и призваны облегчить написание постов.
В этой теме я презентую новые кнопочки и расскажу о том, как их использовать.[/right]
А после отправки так:
Быть может некоторые из вас заметили, что в форме ответа прибавилось кнопочек. Они созданы на основе пользовательского Би-Би-кода и призваны облегчить написание постов.
В этой теме я презентую новые кнопочки и расскажу о том, как их использовать.

Точно также выравнивается текст по ширине, но уже с использованием кнопки "justify".
Помимо того, что текст можно вписывать между тегами, есть вариант сначала написать тескт, а затем выделить его курсором и нажать на нужную кнопку. Эффект будет тот же.


Ну что, вы уже кликнули на оранжевый прямоугольник с надписью "чтобы увидеть другие виды выравнивания текста, кликните сюда" и ознакомились с довольно пространным текстом про то, как можно выравнивать написанное по левому, правому краю и по ширине? Если нет, кликайте сейчас же!
Обратили внимание как много текста скрывалось под этим прямоугольником? Это называется спойлер. С его помощью можно визуально сокращать размер вашего поста, умещая при этом в нём много информации. Весьма удобно для тех, кто ваш пост давно прочли и теперь заходят на страницу для чтения других постов размещённых после вашего. Им теперь надо гораздо меньше прокручивать страницу вниз, ну а если надо будет перечитать ваш пост целиком, достаточно кликнуть на спойлер и скрытая часть текста откроется. На многих форумах есть спойлеры для написания длинных постов. Часть поста пишется обычным образом, а большая часть скрывается в спойлере. Весьма юзерфрендли. На нашем форуме спойлера до сих пор не было, а теперь он появился и здесь. Так что пользуемся.

Как это сделать?
Кликаем на кнопочку "spoiler=", появляются такие теги:
Код: Выделить всё
[spoiler=][/spoiler]
Значок = внутри первого тега всегда в Би-Би-кодах означает, что после него можно вписать текст. Вот после этого значка вписываем вводную к спойлеру, например "нажми сюда", или несколько первых строк из того текста, который мы хотим упрятать в спойлер.

Для примера, спрячем в спойлер только что написанную мною фразу. Используем оба варианта.

1. Нажимаем на кнопку "spoiler=".
2.
Код: Выделить всё
[spoiler=сюда вписываем вводную]сюда скрываемый текст[/spoiler]

3. В первом варианте в кодовом виде получается
Код: Выделить всё
[spoiler=нажми здесь]Значок = внутри первого тега всегда в Би-Би-кодах означает, что после него можно вписать текст. Вот после этого значка вписываем вводную к спойлеру, например "нажми сюда", или несколько первых строк из того текста, который мы хотим упрятать в спойлер.[/spoiler]


А после отправки:
Значок = внутри первого тега всегда в Би-Би-кодах означает, что после него можно вписать текст. Вот после этого значка вписываем вводную к спойлеру, например "нажми сюда", или несколько первых строк из того текста, который мы хотим упрятать в спойлер.


А во втором варианте в кодовом виде получается
Код: Выделить всё
[spoiler=Значок = внутри первого тега всегда в Би-Би-кодах означает], что после него можно вписать текст. Вот после этого значка вписываем вводную к спойлеру, например "нажми сюда", или несколько первых строк из того текста, который мы хотим упрятать в спойлер.[/spoiler]


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


Кстати, заметили, в пером спойлере (там, где я рассказывал про выравнивание текста) есть как бы табличка? Фразы "по левой стороне поста", "по правой стороне", "и по ширине" написаны как вы в трёх линеечках. Этот эффект называется горизонтальная линия. Он нужен, когда хотят отделить какую-то часть поста от другой, или вот как я - для создания строчной таблицы.
Для этого существует кнопка "hr". Ею пользоваться немножко сложнее, хотя, если разобраться, ничего сложного нет. Итак, для создания горизонтальной линии, кликаем на эту кнопку. Появляются теги:
Код: Выделить всё
[hr]и[/hr]
Дальше делаем следующее:
Код: Выделить всё
между тегами [hr]вот здесь[/hr] пишем две латинские буквы hr. Или копируем их из тега и вставляем между тегами, чтобы не менять раскладку клавиатуры с русской на английскую
получаем следующий код:
Код: Выделить всё
[hr]hr[/hr]
После отправки сообщения этот код станет горизонтальной линией.

Рассмотрим как делать таблицу из этих линий на примере из начала моего повествования про выравнивание текста:

Вот так это выглядит до отправки сообщения:
Код: Выделить всё
Также, благодаря другим новым кнопочкам, нам доступно выравнивание текста
по левой стороне поста
[hr]hr[/hr]
по правой стороне
[hr]hr[/hr]
и по ширине
[hr]hr[/hr]

А так, после:
Также, благодаря другим новым кнопочкам, нам доступно выравнивание текста
по левой стороне поста


по правой стороне


и по ширине



Ещё есть кнопочка, благодаря которой можно сделать в вашем сообщении ник пользователя ссылкой на его профиль на форуме. Вот вы о ком-то из форумчан упоминаете и тот, кто вас читает может кликнуть на его ник и тут же узнать о нём все подробности. Очень, надо сказать, удобно. Теперь не надо много раз листать форум, чтобы справиться о ком-нибудь из форумчан, чьё имя вас заинтересовало. Так что пользуйтесь, пожалуйста новой кнопкой. Эта кнопка "user". Кликаем на неё и между тегами
Код: Выделить всё
[user]и[/user]
точно воспроизводим ник пользователя. (А иной ник лучше всего скопировать и потом вставить между тегов. :wink:) Например, я упомянул Антония, скажем в новостной теме о награждениях:

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

Итак, я в упомянутой фразе помещаю имя Антония между тегами
Код: Выделить всё
[user]и[/user]

Получаем
Код: Выделить всё
Сегодня [user]Антоний[/user] был номинирован мною на медаль "дружба".


И после отправки сообщения имя Антония становится ссылкой на его профиль:
Сегодня Антоний был номинирован мною на медаль "дружба".


Offtopic: Кстати, чтобы не быть пустословом, номинирую ка я сегодня ему и вправду эту медаль, сразу после того, как напишу, наконец, этот пост! :wink:

Обратили внимание как написана последняя моя фраза? Это ещё одна кнопочка поработала. Называется "offtopic". Все знают, что оффтопик вещь на форумах неприемлимая. Однако, порою некоторые юзеры, извиняясь, выделяют часть сообщения синим цветом и пишут "оффтопик". Таким образом они сразу предупреждают модераторов, что понимают, что перешли за рамки темы, но очень уж хотелось в данный момент по ходу речи вот это сказать. А также, выделяя свой оффтопик, они предупреждают и остальных участников обсуждения - то, что выделено не требует развития в данной ветке дискуссии. В умеренном виде такой вот интеллегентный оффтопик допустим. Повторюсь, в умеренном виде. Так вот, чтобы не обременять тех, кто использует такую форму оффтопика, необходимостью пространных извинений перед модераторами и пользователями, а также необходимостью цветового выделения оффтопной части поста и существует эта кнопка.

Пользоваться ею просто:
1.Нажимаем "offtopic".
2. Появляются теги
Код: Выделить всё
[offtopic]и[/offtopic]

3. Между ними пишется оффтопная часть поста
Например:
Код: Выделить всё
[offtopic]вот смотрю я сейчас на пролетающий по монитору снег и думаю: "вот и рождественский пост наступил. Время работы над собой. Что я принесу по его окончании к яслям Младенца Христа?"[/offtopic]

4. После опубликования поста этот оффтопик будет выглядеть так:
Offtopic: вот смотрю я сейчас на пролетающий по монитору снег и думаю: "вот и рождественский пост наступил. Время работы над собой. Что я принесу по его окончании к яслям Младенца Христа?"


Ещё есть кнопочка "Uho". Она нужна для того, чтобы писать подпись не под картинкой, а сбоку от неё.
Пример:
Изображениеновогодний смайл


А вот как это выглядит до отправки сообщения:
Код: Выделить всё
[Uho][img]http://strastoterptsy.ru/storage/strastoterptsy_myfor_ru/images/smile227.gif[/img]новогодний смайл[/Uho]

То есть, между тегами
Код: Выделить всё
[Uho]и[/Uho]
мы помещаем ещё теги картинки,
Код: Выделить всё
[img]и[/img]
(для этого последовательно нажимаем кнопочки "Uhо" и "img"), внутрь последних тегов помещаем адрес картинки:
Код: Выделить всё
[Uho][img]http://strastoterptsy.ru/storage/strastoterptsy_myfor_ru/images/smile227.gif[/img][/Uho]
, а между тегами
Код: Выделить всё
[/img]и[/Uho]
пишем подпись к картинке. Вот, собственно, и весь фокус.

С помощью кнопки "mp3" можно размещать прямо на форуме музыку и другие аудиофайлы в Мр3 формате. Нажав эту кнопку вы установите прямо в ваше сообщение маленький Мр3-плеер, да ещё и с функцией скачивания файла!

Жмём кнопочку "mp3", и вставляем между тегами
Код: Выделить всё
[mp3]и[/mp3]
прямую ссылку на аудиофайл. Свои аудиофайлы можно загружать на какой-нибудь аудиохостинг. Проще всего - сюда: http://www.yapfiles.ru/upload/. На этом хостинге можно размещать файлы без регистрации, довольно быстро и абсолютно безплатно.
Вот, к примеру, ссылка размещённого мною там файла песни "Светлый путь" группы "Металлугрия", чьи музыканты - наши форумчане:
Код: Выделить всё
http://www.yapfiles.ru/files/155552/9939f67b662747ebd5b253573d17cb20.mp3
Эту ссылку я вставляю между тегами и получаю следующий код:
Код: Выделить всё
[mp3]http://www.yapfiles.ru/files/155552/9939f67b662747ebd5b253573d17cb20.mp3[/mp3]
После отправки сообщения код превратился в плеер:

Podcast


А можно ещё и выделить этот плеер различными способами. Вот как, например, я выделил его в сообщении в теме про песню "Светлый путь":

Код: Выделить всё
[center][size=150][color=#0000FF][b]Теперь прослушать песню "Светлый путь"
можно прямо на нашем форуме,
благодаря маленькому плееру расположенному ниже:[/b][/color][/size][/center]
[hr]hr[/hr]
[mp3]http://www.yapfiles.ru/files/155552/9939f67b662747ebd5b253573d17cb20.mp3[/mp3]
[hr]hr[/hr]
[center][size=150][color=#FF4000][b]Кстати, с помощью этого плеера песню можно и скачать себе на компьютер! Наслаждайтесь![/b]
[/color][/size][/center]


И в результате получилось следующее:

Теперь прослушать песню "Светлый путь"
можно прямо на нашем форуме,
благодаря маленькому плееру расположенному ниже:



Podcast




Кстати, с помощью этого плеера песню можно и скачать себе на компьютер! Наслаждайтесь!


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

Также с помощью новых кнопочек можно вставлять прямо на форум видеофайлы из сайтов ютуб (кнопочка "youtube"), рутуб (кнопочка "rutube"), ВКонтакте (кнопочка "vkontakte") и Гуглвидео (кнопочка "googlevid").

Рассмотрим на примере кнопки "youtube":

1.Нажимаем "youtube"
2. Вставляем между тегами
Код: Выделить всё
[youtube]и[/youtube]
адрес видеоролика на ютубе.
3. Например:
Код: Выделить всё
[youtube]http://www.youtube.com/watch?v=Yyv_5D67XT0&feature=related[/youtube]

4. После отправки сообщения, получаем видеоролик ютуба в своём сообщении:

Очень удобно. Теперь пользователям нашего форума православной молодёжи не надо переходить на ютубовский сайт. Видео можно смотреть не покидая форум! :215:

Ещё есть кнопки переводчика "en" и "ru". С помощью первой кнопки часть текста который надо перевести на английский превращается в ссылку, которая ведёт на сайт переводчика и там можно прочесть английский вариант введённого текста. С помощью же второй - можно так же перевести текст на русский язык. Теперь общение в англоязычном разделе форума станет проще! :)

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

Re: Новые Би-Би-кодовые кнопочки в форме ответа. Учимся.

СообщениеДобавлено: 08 дек 2010, 04:07
A®ian
Прекрасные кнопочки. Необходимость в некоторых уже давно назрела. Спаси Господи, Сергий!

Как вставить видео с Яндекс.видео

СообщениеДобавлено: 26 дек 2010, 17:46
Сергий
Добавил новую кнопочку для вставки видеоролика с Яндекс.видео.
Это кнопочка "yandexvideo"
Нажимаем на эту кнопочку и между тегами
Код: Выделить всё
[yandexvideo]и[/yandexvideo]
вставляем адрес ролика.
Теперь рассмотрим, как взять этот адрес.
Для примера возьмём этот ролик:
В верхнем левом углу плеера есть кнопочка "код для вставки". Нажимаем на неё и видим три графы:
1. "адрес ролика"


2. "Код для Я.ру и других блогов"


3. "Код для Liveinternet"



Нам нужна вторая графа: "Код для Я.ру и других блогов". Копируем этот код, нажав на кнопочку "скопировать" напротив кода, а затем берём из этого кода только адрес.

Например, для рассматриваемого нами ролика код такой:
<object width="450" height="360"><param name="video" value="http://static.video.yandex.ru/lite/rlihoy/14rmoheka5.403/"></param><param name="allowFullScreen" value="true"></param><param name="scale" value="noscale"></param><embed src="http://static.video.yandex.ru/lite/rlihoy/14rmoheka5.403/" type="application/x-shockwave-flash" width="450" height="360" allowFullScreen="true" scale="noscale" ></embed></object>
Красным цветом я выделил тот участок кода (адрес ролика) который нам надо взять. Копируем этот адрес и вставляем между тегами
Код: Выделить всё
[yandexvideo]и[/yandexvideo]

Получаем
Код: Выделить всё
[yandexvideo]http://static.video.yandex.ru/lite/rlihoy/14rmoheka5.403/[/yandexvideo]

После отправки сообщения получаем:
и наслаждаемся просмотром видео!

Re: Новые Би-Би-кодовые кнопочки в форме ответа. Учимся.

СообщениеДобавлено: 27 дек 2011, 14:14
Сергий
Друзья, благодаря трудам Ариана и Пацифиста, наша коллекция кнопочек пополнилась. Они установили два кода preimg для уменьшения вставляемых картинок ( твоих принтскринов :) ) и marquee бегущая строка.





Это пример их работы. :)

Добавили ВВ-код и скрипт выбора стиля шрифта

Этот код работает вот таким образом!

Добавили скрипт для применения нескольких ВВ-кодов к одному и тому же тексту. Теперь текст достаточно выделить один раз и после этого щёлкать по всем кнопочкам кодов. Очень удобно, когда ты одновременно изменяешь размер шрифта, его цвет и прочее...

Кроме того, интересней стал работать код URL. Если ты сначала вставляешь ссылку, а потом применяешь этот код, то всё работает как и прежде, а вот если сначала нажимаешь на этот код, то тут же получаешь возможность создать гипер-ссылку. Выскочит окошко с просьбой вставить ссылку (вставляешь-подтверждаешь), потом окно с описанием этой ссылки (пишем слово/слова, которые будут видны при просмотре сообщения) и готово.

Re: Новые Би-Би-кодовые кнопочки в форме ответа. Учимся.

СообщениеДобавлено: 27 дек 2011, 16:33
Иерей Димитрий
"Сеогий" писал(а):
Жмём кнопочку "mp3", и вставляем между тегами

У меня почему-то плеер появляется, а композиция, к которой ведет ссылка, не воспроизводится. :!?:

Re: Новые Би-Би-кодовые кнопочки в форме ответа. Учимся.

СообщениеДобавлено: 27 дек 2011, 17:58
Сергий
А ссылка ведёт на япфайлы?

Re: Новые Би-Би-кодовые кнопочки в форме ответа. Учимся.

СообщениеДобавлено: 27 дек 2011, 18:02
Иерей Димитрий
"Сергий" писал(а):
А ссылка ведёт на япфайлы?


Ведет. Что-то я не так делаю. Разберусь не торопясь попозже...

Offtopic: Сергий, как Ваше здоровье?

Re: Новые Би-Би-кодовые кнопочки в форме ответа. Учимся.

СообщениеДобавлено: 27 дек 2011, 18:17
Сергий
Не знаю...я несколько раз замечал, что музыка в этом плеере не воспроизводится...причём в тех постах, где раньше воспроизводилась... Потом опять налаживалось...
Может, это на япфайлах глюки какие...

Offtopic: Сегодня сижу дома...Температура невысока...Пью много жидкости и стараюсь меньше двигаться.

Re: Новые Би-Би-кодовые кнопочки в форме ответа. Учимся.

СообщениеДобавлено: 27 дек 2011, 19:35
A®ian
Плагины надо было обновить.
Сейчас работает...

Re: Новые Би-Би-кодовые кнопочки в форме ответа. Учимся.

СообщениеДобавлено: 11 фев 2012, 02:12
Сергий
Как вставить на форум видео из Вконтакта?
В общем, делаем так. На страничке с видеороликом есть ссылка"получить код видео". Нажимаем на неё, копируем код Далее на форуме надо нажать в форме ответа на би-би кодовую кнопочку "vkontakte" и появятся теги:
Код: Выделить всё
[vkontakte]и[/vkontakte]
Вставляем между ними код Вашего ролика.

Возьмём для примера код ролика нашего отца Михаила:
Код: Выделить всё
<iframe src="http://vk.com/video_ext.php?oid=42554573&id=161946922&hash=b27cc27c11815db0&hd=1" width="607" height="360" frameborder="0"></iframe>


После вставки кода в теги получаем:
Код: Выделить всё
[vkontakte]<iframe src="http://vk.com/video_ext.php?oid=42554573&id=161946922&hash=b27cc27c11815db0&hd=1" width="607" height="360" frameborder="0"></iframe>[/vkontakte]


Раньше на этом всё и заканчивалось. После отправки сообщения ролик появлялся на форуме. Однако, би-би кодовая кнопочка "vkontakte" была заточена под старый адрес этой соц.сети - http://vkontakte.ru/ Теперь соцсеть переехала на адрес http://vk.com/ и в кодах для вставки даётся этот адрес. Что же делать? Очень просто. Надо вручную сменить адрес в коде с нового на старый. Делаем это так:

[vkontakte]<iframe src="http://vk.com/video_ext.php?oid=42554573&id=161946922&hash=b27cc27c11815db0&hd=1" width="607" height="360" frameborder="0"></iframe>[/vkontakte]

Выделенное красным заменяем на http://vkontakte.ru/ Получаем:
Код: Выделить всё
[vkontakte]<iframe src="http://vkontakte.ru/video_ext.php?oid=42554573&id=161946922&hash=b27cc27c11815db0&hd=1" width="607" height="360" frameborder="0"></iframe>[/vkontakte]
Теперь отправляем сообщение и, после отправки сообщения, видео появляется на форуме:


И всё. Ни на какой ВК ходить не надо. Можно наслаждаться видео прямо на форуме!!!