Фильтр по:
  

Дополнительные шрифты и цвета к BB-кодам на форум. JavaScript

Как сделать...

  • Страница 1 из 2
  • 1
  • 2
  • »
Модератор форума: likbezz  
Скрипты и коды для юкоз - Форум аццкого кодера » Как сделать? Информация для вновь прибывших » Как сделать... » Дополнительные шрифты и цвета к BB-кодам на форум. JavaScript (Как добавить шрифтов и цветов в панель bb-кодов на форуме?)
Дополнительные шрифты и цвета к BB-кодам на форум. JavaScript
Дата: Среда, 08.02.2012, 13:17 |
SKh
Генерал-майор
Группа: Проверенные
Сообщений: 314
Награды: 0
Репутация: 5
Статус: Offline


 Привет!
Давно меня вопрос мучает, а сейчас увидел что ты решил эту задачу!

Поискал у тебя на сайте инструкции - не нашел.
Как можно добавить шрифтов и цветов?
Вот такой комплект меня вполне удовлетворяет, т.к. есть мой любимый шрифт) (в списке последним):
И этот комплект устраивает но в него желательно добавить #F5FFF5 - цвет фона окна на форуме.
Прикрепления: 9887525.jpg (5.8 Kb) · 5247929.jpg (6.2 Kb)

 
Дата: Среда, 08.02.2012, 23:18 |
likbezz
Аццкий кодер
Группа: Администраторы
Сообщений: 9093
Награды: 23
Репутация: 459
Статус: Unknown


 SKh,
Quote (SKh)
Привет!
Давно меня вопрос мучает, а сейчас увидел что ты решил эту задачу!
Поискал у тебя на сайте инструкции - не нашел.
Как можно добавить шрифтов и цветов?

А скриншотики, как я понял, с моего форума сняты? )))
Сейчас напишу.
...

 
Дата: Среда, 08.02.2012, 23:38 |
SKh
Генерал-майор
Группа: Проверенные
Сообщений: 314
Награды: 0
Репутация: 5
Статус: Offline
Quote (likbezz)

А скриншотики, как я понял, с моего форума сняты? )))


Ну ясно дело!
Я честно об этом так и написал.)
Меня многие убеждали, что это невозможно на юкозе.
Что-то дернуло заглянуть как у тебя - и увидел, что возможно wink

Сообщение отредактировал SKh - Среда, 08.02.2012, 23:40
 
Дата: Четверг, 09.02.2012, 00:05 |
likbezz
Аццкий кодер
Группа: Администраторы
Сообщений: 9093
Награды: 23
Репутация: 459
Статус: Unknown


 SKh,
Всё достаточно просто:
В шаблон «Форум, форма добавления» (в самый низ) добавляются следующие скрипты:

Для добавления списка шрифтов:
Code
<script type="text/javascript">
function setFFamily(){
var obj=document.getElementById('ffont'),olen=obj.options.length;
var family=[['Verdana','Verdana'],['Tahoma','Tahoma'],['Georgia','Georgia'],['Palatino','Palatino Linotype'],['Monotype Corsiva','Monotype Corsiva']];
for(i=0,len=family.length;i<len;i++){
obj.options[olen]=new Option(family[i][0],family[i][1]);olen++;
};};
if(document.getElementById('ffont')){setFFamily();};
</script>

Где:
Quote
var family=[['Verdana','Verdana'],['Tahoma','Tahoma'],['Georgia','Georgia'],['Palatino','Palatino Linotype'],['Monotype Corsiva','Monotype Corsiva']];

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


Для добавления списка цветов:
Code
<script type="text/javascript">
function setFColor(){
var obj=document.getElementById('fcolor'),olen=obj.options.length;
var colors=[['Розовый','#f1f'],['Коричневый','#630'],['Бордовый','#933'],['Салатовый','#3c6']];
for(i=0,len=colors.length;i<len;i++){
obj.options[olen]=new Option(colors[i][0],colors[i][1]);
obj.options[olen].setAttribute('style','color:'+colors[i][1]);
olen++;
};};
if(document.getElementById('fcolor')){setFColor();};
</script>

Где:
Quote
var colors=[['Розовый','#f1f'],['Коричневый','#630'],['Бордовый','#933'],['Салатовый','#3c6']];

- массив добавляемых цветов, в котором: первое значение - имя/название цвета (любое) - будет отображаться в выпадающем списке; второе значение - точный код цвета (возможные значения HEX, RGB, Ключевое слово) - будет вписываться в bb-код и в цвет названия цвета в списке.
И первое и второе значение - в кавычках.
...

Список ограничен лишь разумными пределами.
...

 
Дата: Четверг, 09.02.2012, 02:43 |
SKh
Генерал-майор
Группа: Проверенные
Сообщений: 314
Награды: 0
Репутация: 5
Статус: Offline


 Спасибо!
Вставил таким образом:
Code
<script type="text/javascript">
function setFFamily(){var obj=document.getElementById('ffont'),olen=obj.options.length;
var family=[['Verdana','Verdana'],['Tahoma','Tahoma'],['Georgia','Georgia'],['Palatino','Palatino Linotype'],['Monotype Corsiva','Monotype Corsiva']];
for(i=0,len=family.length;i<len;i++){obj.options[olen]=new Option(family[i][0],family[i][1]);olen++;};};
if(document.getElementById('ffont')){setFFamily();};
</script>
<script type="text/javascript">
function setFColor(){var obj=byId('fcolor'),olen=obj.options.length;
var colors=[['Розовый','#f1f'],['brown','#630'],['vinous','#933'],['lime','#3c6']["light","#F5FFF5"]];
for(i=0,len=colors.length;i<len;i++){obj.options[olen]=new Option(colors[i][0],colors[i][1]);
obj.options[olen].setAttribute('style','color:'+colors[i][1]);olen++;};};
if(document.getElementById('fcolor')){setFColor();};
</script>

Шрифты
А вот у цветов где-то ошибка просочилась
Что я сделал не так?
Убирал добавленный цвет - не работало
Перевел названия цветов - не работает
Прикрепления: 6654289.jpg (4.6 Kb) · 3082233.jpg (2.1 Kb)

Сообщение отредактировал SKh - Четверг, 09.02.2012, 02:45
 
Дата: Четверг, 09.02.2012, 03:13 |
likbezz
Аццкий кодер
Группа: Администраторы
Сообщений: 9093
Награды: 23
Репутация: 459
Статус: Unknown


 SKh,
Quote (SKh)
var colors=[['Розовый','#f1f'],['brown','#630'],['vinous','#933'],['lime','#3c6']["light","#F5FFF5"]];

Запятой нету, между ['lime','#3c6'] и ["light","#F5FFF5"] ...

Вот так должно быть:
Quote
var colors=[['Розовый','#f1f'],['brown','#630'],['vinous','#933'],['lime','#3c6'],['light','#F5FFF5']];

...

Quote (SKh)
Перевел названия цветов - не работает

biggrin Это типа, всё подряд пробуем)))
Названия цветом могут быть абсолютно произвольными - хоть с маленькой буквы, хоть латиницей, хоть кириллицей и тп..
...

 
Дата: Четверг, 09.02.2012, 03:29 |
SKh
Генерал-майор
Группа: Проверенные
Сообщений: 314
Награды: 0
Репутация: 5
Статус: Offline


 Сейчас вот так
Code
<script type="text/javascript">
function setFColor(){var obj=byId('fcolor'),olen=obj.options.length;
var colors=[['pink','#f1f'],['brown','#630'],['vinous','#933'],['lime','#3c6'],["light","#F5FFF5"]];
for(i=0,len=colors.length;i<len;i++){obj.options[olen]=new Option(colors[i][0],colors[i][1]);
obj.options[olen].setAttribute('style','color:'+colors[i][1]);olen++;};};
if(document.getElementById('fcolor')){setFColor();};
</script>
и все равно не добавилось

Сообщение отредактировал SKh - Четверг, 09.02.2012, 03:30
 
Дата: Четверг, 09.02.2012, 04:22 |
likbezz
Аццкий кодер
Группа: Администраторы
Сообщений: 9093
Награды: 23
Репутация: 459
Статус: Unknown


 SKh,
Quote (SKh)
Сейчас вот так и все равно не добавилось

А, ну да ... У тебя же нет функции byId(); )))
Вот:
Code
<script type="text/javascript">
function setFColor(){var obj=document.getElementById('fcolor'),olen=obj.options.length;
var colors=[['pink','#f1f'],['brown','#630'],['vinous','#933'],['lime','#3c6'],["light","#F5FFF5"]];
for(i=0,len=colors.length;i<len;i++){obj.options[olen]=new Option(colors[i][0],colors[i][1]);
obj.options[olen].setAttribute('style','color:'+colors[i][1]);olen++;};};
if(document.getElementById('fcolor')){setFColor();};
</script>

...
Мой косяк, ща поправлю)

 
Дата: Четверг, 09.02.2012, 04:43 |
SKh
Генерал-майор
Группа: Проверенные
Сообщений: 314
Награды: 0
Репутация: 5
Статус: Offline


 А что за функция byId(); ?

Ура-а-а!!! Заработало
Прикрепления: 2458179.jpg (2.3 Kb) · 8916855.gif (71.5 Kb)

Сообщение отредактировал SKh - Четверг, 09.02.2012, 04:48
 
Дата: Четверг, 09.02.2012, 06:28 |
likbezz
Аццкий кодер
Группа: Администраторы
Сообщений: 9093
Награды: 23
Репутация: 459
Статус: Unknown


 SKh,
Quote (SKh)
А что за функция byId(); ?

Сокращение для document.getElementById();
...

 
Дата: Вторник, 24.07.2012, 17:13 |
Diana
Генерал-лейтенант
Группа: Помощники
Сообщений: 606
Награды: 0
Репутация: 20
Статус: Offline


 likbezz, А как ты сделал спецсимволы? Прикольно biggrin
Вот это:

И скажи пожалуйста - вот если у меня стандартные вв коды скрыты вообще
Code
<span style="display: none;">$BBCODES$</span>


Вот такая конструкция же будет работать?
Вроде всё работает но что то сомневаюсь. Мало ли чего. У меня правда это в комментариях поставлено а не на форуме.

Code
<span style="padding-right: 1px;">    
<select name="fsize" class="codeButtons"   onchange="alterfont(this.options[this.selectedIndex].value,'size','message','');this.selectedIndex=0; ">    
<option value=0 selected>Размер шрифта</option>    
<option value=6>6pt</option>    
<option value=7>7pt</option>
<option value=8>8pt</option>
<option value=9>9pt</option>
<option value=10>10pt</option>   
<option value=11>11pt</option>
<option value=12>12pt</option>    
<option value=13>13pt</option>   
<option value=14>14pt</option>
<option value=15>15pt</option>    
<option value=16>16pt </option>   
<option value=17>17pt </option>   
<option value=18>18pt</option>
<option value=19>19pt </option>   
<option value=20>20pt</option>   
<option value=21>21pt</option>
<option value=22>22pt</option>
</select>    
</span>
<span style="simpletag: 1px;">    
<select name="ffont" class="codeButtons"  onchange="alterfont(this.options[this.selectedIndex].value,'font','message','');this.selectedIndex=0; ">    
<option value="0">Тип шрифта</option>    
<option value="Arial">Arial</option>    
<option value="Times">Times</option>    
<option value="Courier">Courier</option>    
<option value="Impact">Impact</option>    
<option value="Geneva">Geneva</option>    
<option value="Optima">Optima</option>    
</select>    
</span>
<span style="padding-right: 1px;">    
<select name="fcolor" class="codeButtons"  onchange="alterfont(this.options[this.selectedIndex].value, 'color','message','');this.selectedIndex=0;">    
<option value=0 selected>Цвет текста</option>    
<option style="COLOR: blue" value=blue>Синий</option>    
<option style="COLOR: green" value=green>Зеленый</option>
<option style="COLOR: yellow" value=yellow>Желтый</option>   
<option style="COLOR: red" value=red>Красный</option>   
<option style="COLOR: purple" value=purple>Пурпурный</option>    
<option style="COLOR: gray" value=gray>Серый</option>   
<option style="COLOR: orange" value=orange>Оранжевый</option>
</select>    
</span>

Прикрепления: 6788965.jpg (23.6 Kb)

Сообщение отредактировал Diana - Вторник, 24.07.2012, 17:15
 
Дата: Вторник, 24.07.2012, 17:29 |
likbezz
Аццкий кодер
Группа: Администраторы
Сообщений: 9093
Награды: 23
Репутация: 459
Статус: Unknown


 Diana,
Quote (Diana, Вт, 24.07.2012, 17:13:47)
А как ты сделал спецсимволы? Прикольно

Да я замучался вспоминать как они пишуться, и сделал страницу с таблицей символов.
Вставил скрытым ифреймом, на кнопку - событие - показать фрейм ...
В самой странице скрипт такой же как для вставки bb-кодов.

Quote (Diana, Вт, 24.07.2012, 17:13:47)
Мало ли чего. У меня правда это в комментариях поставлено а не на форуме.

Ну, думаю да, ID вроде нет, конфликта с name быть не должно .. по идее.
Лучше всего проверить)

 
Дата: Четверг, 26.07.2012, 08:23 |
Diana
Генерал-лейтенант
Группа: Помощники
Сообщений: 606
Награды: 0
Репутация: 20
Статус: Offline


 likbezz,
Quote
Да я замучался вспоминать как они пишуться, и сделал страницу с таблицей символов.
Вставил скрытым ифреймом, на кнопку - событие - показать фрейм ...
В самой странице скрипт такой же как для вставки bb-кодов.

Я вот тоже пыталась раньше сделать,хотя бы для себя, потому что вечно забываю их, но я даже страницу такую с таблицей сделать не могу.
Они даже в code не отображаются текстом а ставятся просто символами.
Ты не мог бы как нибудь поподробней расписать как сделать? С примером страницы и скрипта?
При наличии времени конечно)
Я тут твою статью читаю Вот эту
Как выяснилось всё же можно сделать чтоб пользователи сами стиль поста выбирали - хоть и сложно.
Буду пробовать) Раз уж связалась с этими ВВ кодами - теперь придётся делать чтоб были приличные smile

Добавлено (26.07.2012, 08:23)
---------------------------------------------
likbezz,

Quote
Вставил скрытым ифреймом, на кнопку - событие - показать фрейм ...

Как это сделать????
Почему у тебя это работает а у меня нет? wacko
Что там еще надо дописать для него?
Code
<span id="mbc7"><input type="button" title="Спец. символы" class="codeButtons" onclick="_uMenu.show('simbol_c');" value="Simbol"><iframe id="simbol_c" src="/_theme1/_edit/bb/files/simbol.html" marginwidth="0" marginheight="0" style="visibility:hidden;display:none;position:absolute;width:177px;height:137px;" frameborder="0" scrolling="no"></iframe></span>

 
Дата: Четверг, 26.07.2012, 09:55 |
likbezz
Аццкий кодер
Группа: Администраторы
Сообщений: 9093
Награды: 23
Репутация: 459
Статус: Unknown


 Diana,
Quote (Diana, Чт, 26.07.2012, 08:23:44)
<span id="mbc7">

Релативный спан должен быть .. ифрейм относительно спана, естественно.
...
Потому что все остальное - системные функции.
Quote (Diana, Чт, 26.07.2012, 08:23:44)
_uMenu.show('simbol_c');

Это тоже системная.

 
Дата: Четверг, 26.07.2012, 10:06 |
Diana
Генерал-лейтенант
Группа: Помощники
Сообщений: 606
Награды: 0
Репутация: 20
Статус: Offline


 likbezz, Я ни слова не поняла.
Можно попроще. Типа для блондинок?
И это вообще можно сделать без PHP?

Сообщение отредактировал Diana - Четверг, 26.07.2012, 10:18
 
Скрипты и коды для юкоз - Форум аццкого кодера » Как сделать? Информация для вновь прибывших » Как сделать... » Дополнительные шрифты и цвета к BB-кодам на форум. JavaScript (Как добавить шрифтов и цветов в панель bb-кодов на форуме?)
  • Страница 1 из 2
  • 1
  • 2
  • »
Поиск:


Мобильная версия