Картинки вместо кнопок в форме ответа Subsilver2 и prosilver

Есть любые вопросы, связанные со стилями/темами для phpBB 3.0.x? Задайте их здесь!
Правила форума
Местная Конституция | Шаблон запроса | Документация (phpBB3) | Переход на 3.0.6 и выше | FAQ-3 (phpbb3) | Как задавать вопросы | Как устанавливать моды

Ваш вопрос может быть удален без объяснения причин, если на него есть ответы по приведённым ссылкам (а вы рискуете получить предупреждение ;) ).
Альтаир Бергадлер
phpBB 2.0.5
Сообщения: 495
Стаж: 16 лет 5 месяцев
Благодарил (а): 80 раз
Поблагодарили: 16 раз

Re: Картинки вместо кнопок в форме ответа Subsilver2 и prosi

Сообщение Альтаир Бергадлер »

Показываю что сделал

Код: Выделить всё

button{
width: 50px;}

Код: Выделить всё

<input type="button" class="button"  name="addbbcode0"  style="background-image: url('{T_THEME_PATH}/images/bold_button.png '); width: 50px;" onclick="bbstyle(0)" title="{L_BBCODE_B_HELP}" />
Где теперь ошибка?
Картинка начала троится :D
Аватара пользователя
Айдар
Former team member
Сообщения: 1687
Стаж: 15 лет 9 месяцев
Откуда: KZN
Благодарил (а): 93 раза
Поблагодарили: 189 раз

Re: Картинки вместо кнопок в форме ответа Subsilver2 и prosi

Сообщение Айдар »

Альтаир Бергадлер писал(а):Где теперь ошибка?
Вот это: надо заменить на это:

Код: Выделить всё

a.button, input.button {
А еще убедиться, что к "button" уже где-либо не прописан класс (в этом плане лучше придумать другое имя, хотя бы "button_picture")

И все же очень сомневаюсь по поводу id картинки, который 0.
In Web We Trust
Альтаир Бергадлер
phpBB 2.0.5
Сообщения: 495
Стаж: 16 лет 5 месяцев
Благодарил (а): 80 раз
Поблагодарили: 16 раз

Re: Картинки вместо кнопок в форме ответа Subsilver2 и prosi

Сообщение Альтаир Бергадлер »

Айдар писал(а):И все же очень сомневаюсь по поводу id картинки, который 0.
проверял, все как и должно быть....
Щас подковырну
Аватара пользователя
HAMMER663
Former team member
Сообщения: 2032
Стаж: 16 лет 5 месяцев
Откуда: Зеленоград
Благодарил (а): 77 раз
Поблагодарили: 249 раз

Re: Картинки вместо кнопок в форме ответа Subsilver2 и prosi

Сообщение HAMMER663 »

Что я делал в стилях

Код: Выделить всё

class="button2"
заменял на

Код: Выделить всё

class="btnbbcode"
в colours.css
перед (возможно у вас будет отличаться)

Код: Выделить всё

a.button2, input.button2, input.button3 
добавил

Код: Выделить всё

.btnbbcode {
	background-color: #DCE1E5;
	background-repeat: no-repeat;
	width: 30px;
	border-style: none;
	background-position: center;
}
Аватара пользователя
HAMMER663
Former team member
Сообщения: 2032
Стаж: 16 лет 5 месяцев
Откуда: Зеленоград
Благодарил (а): 77 раз
Поблагодарили: 249 раз

Re: Картинки вместо кнопок в форме ответа Subsilver2 и prosi

Сообщение HAMMER663 »

PS: классы button и button2 в стилях я не трогал
Аватара пользователя
Nekstati
Поддержка
Поддержка
Сообщения: 3365
Стаж: 17 лет 6 месяцев
Благодарил (а): 37 раз
Поблагодарили: 1454 раза

Re: Картинки вместо кнопок в форме ответа Subsilver2 и prosi

Сообщение Nekstati »

Если кому интересно — на яваскрипте всё это делается немного проще. Раз этак в двадцать. Пример на Mootools:

Код: Выделить всё

$$('#format-buttons input').each(function(e) {
	e.setStyles('width: 25px !important; background: url({T_IMAGESET_PATH}/button-' + e.name + '.png) !important');
	e.value = '';
});
Картинки называем button-addbbcode10.png, button-palette.png и т. п., соответственно атрибуту name каждой кнопки. Скрипт вставляем в низ файла posting_buttons.html.

Если потом добавите новый пользовательский ББ-код, кодить ничего не придётся, надо будет только нарисовать новую картинку.
Аватара пользователя
HAMMER663
Former team member
Сообщения: 2032
Стаж: 16 лет 5 месяцев
Откуда: Зеленоград
Благодарил (а): 77 раз
Поблагодарили: 249 раз

Re: Картинки вместо кнопок в форме ответа Subsilver2 и prosi

Сообщение HAMMER663 »

Некстати, ну где же вы были раньше? спасибо большое.
Аватара пользователя
Айдар
Former team member
Сообщения: 1687
Стаж: 15 лет 9 месяцев
Откуда: KZN
Благодарил (а): 93 раза
Поблагодарили: 189 раз

Re: Картинки вместо кнопок в форме ответа Subsilver2 и prosi

Сообщение Айдар »

Nekstati писал(а):Если кому интересно
Еще как интересно - полночи безрезультатных плясок! :)
Че-то кнопка "благодарить" не работает...
In Web We Trust
Альтаир Бергадлер
phpBB 2.0.5
Сообщения: 495
Стаж: 16 лет 5 месяцев
Благодарил (а): 80 раз
Поблагодарили: 16 раз

Re: Картинки вместо кнопок в форме ответа Subsilver2 и prosi

Сообщение Альтаир Бергадлер »

Айдар писал(а):Че-то кнопка "благодарить" не работает...

ага....
Аватара пользователя
Nekstati
Поддержка
Поддержка
Сообщения: 3365
Стаж: 17 лет 6 месяцев
Благодарил (а): 37 раз
Поблагодарили: 1454 раза

Re: Картинки вместо кнопок в форме ответа Subsilver2 и prosi

Сообщение Nekstati »

То же самое на обычном яваскрипте.

Код: Выделить всё

<script type="text/javascript">

var buttons = document.getElementById('format-buttons').childNodes;
for (i = 0; i < buttons.length; i++) {
	if (buttons[i].type == 'button') {
		buttons[i].style.width = '28px';
		buttons[i].style.height = '26px';
		buttons[i].style.background = 'url({T_IMAGESET_PATH}/button-' + buttons[i].name + '.png)';
		buttons[i].style.border = 'none';
		buttons[i].style.color = 'transparent';
		buttons[i].value = '';
		buttons[i].className = '';
	}
}

</script>
Картинки называем button-addbbcode10.png, button-palette.png и т. п., соответственно атрибуту name каждой кнопки с приставкой button-, и кладём в папку styles/stylename/imageset/. Скрипт вставляем в низ файла posting_buttons.html.

Значения атрибутов width и height в скрипте меняйте в зависимости от размера ваших картинок.
Альтаир Бергадлер
phpBB 2.0.5
Сообщения: 495
Стаж: 16 лет 5 месяцев
Благодарил (а): 80 раз
Поблагодарили: 16 раз

Re: Картинки вместо кнопок в форме ответа Subsilver2 и prosi

Сообщение Альтаир Бергадлер »

А можно инструкцию по подключению?
Аватара пользователя
Nekstati
Поддержка
Поддержка
Сообщения: 3365
Стаж: 17 лет 6 месяцев
Благодарил (а): 37 раз
Поблагодарили: 1454 раза

Re: Картинки вместо кнопок в форме ответа Subsilver2 и prosi

Сообщение Nekstati »

Заключаете скрипт между тэгами <script type="text/javascript"> и </script> и вставляете в конец файла posting_buttons.html.
Аватара пользователя
Айдар
Former team member
Сообщения: 1687
Стаж: 15 лет 9 месяцев
Откуда: KZN
Благодарил (а): 93 раза
Поблагодарили: 189 раз

Re: Картинки вместо кнопок в форме ответа Subsilver2 и prosi

Сообщение Айдар »

Nekstati, этот скрипт только для просильвера или к субсильверу также прикручивается?
Попробовал протестировать с кнопкой "жирный шрифт" таким образом:
1. Делаю картинку, обзываю ее addbbcode0.png по аналогии с атрибутом name соответствующей кнопки
2. Кидаю ее в папку /styles/subsilver2/theme/images
3. Вставляю в самый конец шаблона posting_butons.html:

Код: Выделить всё

<script type="text/javascript">
var buttons = document.getElementById('format-buttons').childNodes;
for (i = 0; i < buttons.length; i++) {
	if (buttons[i].type == 'button') {
		buttons[i].style.minWidth = '25px';
		buttons[i].style.background = 'url({T_IMAGESET_PATH}/button-' + buttons[i].name + '.png)';
		buttons[i].style.border = 'none';
		buttons[i].value = '';
	}
}
</script>
В итоге изменений не вижу, а IE упорно выдает script error. :(
In Web We Trust
Аватара пользователя
Nekstati
Поддержка
Поддержка
Сообщения: 3365
Стаж: 17 лет 6 месяцев
Благодарил (а): 37 раз
Поблагодарили: 1454 раза

Re: Картинки вместо кнопок в форме ответа Subsilver2 и prosi

Сообщение Nekstati »

Код: Выделить всё

document.getElementById('format-buttons')
Что это означает? «Найти элемент с id="format-buttons"». В Субсильвере такого элемента нет.

Для Субсильвера:

Код: Выделить всё

<script type="text/javascript">
var buttons = document.getElementsByTagName('input');
for (i = 0; i < buttons.length; i++) {
	if (buttons[i].className == 'btnbbcode') {
		buttons[i].style.width = '28px';
		buttons[i].style.height = '26px';
		buttons[i].style.background = 'url({T_IMAGESET_PATH}/button-' + buttons[i].name + '.png)';
		buttons[i].style.border = 'none';
		buttons[i].style.verticalAlign = 'bottom';
		buttons[i].value = '';
	}
}
</script>
Картинки называем button-addbbcode0.png, button-addbbcode2.png и т. п., соответственно атрибуту name каждой кнопки с приставкой button-, и кладём в папку styles/subsilver2/imageset/. Скрипт вставляем в низ файла posting_buttons.html.

Значения атрибутов width и height в скрипте меняйте в зависимости от размера ваших картинок.
Аватара пользователя
R3mbrant
phpBB 1.2.1
Сообщения: 26
Стаж: 17 лет 10 месяцев
Благодарил (а): 4 раза

Re: Картинки вместо кнопок в форме ответа Subsilver2 и prosi

Сообщение R3mbrant »

Айдар писал(а):1. Делаю картинку, обзываю ее addbbcode0.png по аналогии с атрибутом name соответствующей кнопки
2. Кидаю ее в папку /styles/subsilver2/theme/images
3. Вставляю в самый конец шаблона posting_butons.html:
Я так понял, называть её надо button-addbbcode0.png и кидать в папку /prosilver(subsilver2)/imageset
Но у меня все равно не пашет.

Вернуться в «Стили для phpBB 3.0.x»