Немного усовершенствовать чат Shoutbox - Дизайн и модификация Invision Power Board

Перейти к содержимому

 

Правила раздела

Здесь обсуждаются вопросы по настройке и администрированию форумов IPB 3.x.
Пожалуйста, не оффтопьте, если зашли сюда случайно, и обратите внимание на соседние разделы.
Установка, настройка и обслуживание форумов IPB 2.x.
Оформление форумов, включая верстку скинов.
Размещение рекламы на форумах.
SEO оптимизация форума.
Техническая поддержка наших скинов и модов.

СвернутьПрикрепленные теги

Теги не найдены

  • 2 Страниц +
  • 1
  • 2

Немного усовершенствовать чат Shoutbox

#1 Пользователь не на сайте   Одмин ответил: »

 
 
  • Advanced
  • ***
  • Insert nick to fast reply form
  • Quote selected text to fast reply form
  • Группа: Пользователи
  • Сообщений: 574
  • Регистрация: 21-Апрель 13
  • Репутация: 41
  • IPB version:3.4.x
 

Отправлено 01 Март 2015 - 13:22

Добрый день!

Ребят, подскажите, как в чате shoutbox поле ввода текста и кнопки (скрин №1) перенести под чат (как на втором скрине)? Где копать? Спасибо.

Вложение  1.JPG (46,79К)
Количество загрузок: 24
0

#2 Пользователь не на сайте   Одмин ответил: »

 
 
  • Advanced
  • ***
  • Insert nick to fast reply form
  • Quote selected text to fast reply form
  • Группа: Пользователи
  • Сообщений: 574
  • Регистрация: 21-Апрель 13
  • Репутация: 41
  • IPB version:3.4.x
 

Отправлено 01 Март 2015 - 13:23

Скрин №2:

Вложение  22.JPG (40,66К)
Количество загрузок: 22
0

#3 Пользователь не на сайте   Атаман ответил: »

 
 
  • Advanced
  • Смотреть блог
  • Insert nick to fast reply form
  • Quote selected text to fast reply form
  • Группа: IPB Skins.ru Team
  • Сообщений: 2 152
  • Регистрация: 13-Апрель 12
  • Репутация: 327
  • Откуда:no
  • IPB version:1.x
 

Отправлено 01 Март 2015 - 13:37

В настройках: Shoutbox: Global
0

#4 Пользователь не на сайте   Viktar83 ответил: »

 
 
  • Advanced
  • ***
  • Insert nick to fast reply form
  • Quote selected text to fast reply form
  • Группа: Пользователи
  • Сообщений: 120
  • Регистрация: 10-Декабрь 14
  • Репутация: 71
  • Откуда:РБ
  • IPB version:3.4.x
 

Отправлено 01 Март 2015 - 15:11

Просмотреть сообщениеАтаман 01 Март 2015 - 13:37 сказал(а):

В настройках: Shoutbox: Global

Да. А конкретнее

Настройки: -> Hook: Global Shoutbox -> Global Shoutbox Look: Theme1 / Theme2
Вложение  Буфер обмена-1.jpg (27,5К)
Количество загрузок: 10
1

#5 Пользователь не на сайте   Атаман ответил: »

 
 
  • Advanced
  • Смотреть блог
  • Insert nick to fast reply form
  • Quote selected text to fast reply form
  • Группа: IPB Skins.ru Team
  • Сообщений: 2 152
  • Регистрация: 13-Апрель 12
  • Репутация: 327
  • Откуда:no
  • IPB version:1.x
 

Отправлено 01 Март 2015 - 15:20

theme2

Сообщение изменено: Атаман (01 Март 2015 - 15:22)

0

#6 Пользователь не на сайте   Viktar83 ответил: »

 
 
  • Advanced
  • ***
  • Insert nick to fast reply form
  • Quote selected text to fast reply form
  • Группа: Пользователи
  • Сообщений: 120
  • Регистрация: 10-Декабрь 14
  • Репутация: 71
  • Откуда:РБ
  • IPB version:3.4.x
 

Отправлено 01 Март 2015 - 15:29

Просмотреть сообщениеАтаман 01 Март 2015 - 15:20 сказал(а):

theme2

Спасибо, но это было уточнение, а не вопрос :)

---------

Кстати, раз уж зашла тема об "усовершенствовании чата Shoutbox" :-)

Имеется такая идея: реализовать дополнительное окно (вкладку, чат-комнату) только для общения определенной группы пользователей (в идеале, конечно, просто мультиокна/вкладки).
Но не знаю в каком направлении двигаться:
- создать отдельную таблицу в БД (а если вкладок несколько сделать ?) ?
- или к сообщениям из отдельно взятой вкладки приаттачивать код-индентификатор, соответственно по нему и сортировать по окнам/вкладкам ?
0

#7 Пользователь не на сайте   Атаман ответил: »

 
 
  • Advanced
  • Смотреть блог
  • Insert nick to fast reply form
  • Quote selected text to fast reply form
  • Группа: IPB Skins.ru Team
  • Сообщений: 2 152
  • Регистрация: 13-Апрель 12
  • Репутация: 327
  • Откуда:no
  • IPB version:1.x
 

Отправлено 01 Март 2015 - 15:37

Вроде есть такое дополнений, чат для администрации в боковом блоке.
0

#8 Пользователь не на сайте   Viktar83 ответил: »

 
 
  • Advanced
  • ***
  • Insert nick to fast reply form
  • Quote selected text to fast reply form
  • Группа: Пользователи
  • Сообщений: 120
  • Регистрация: 10-Декабрь 14
  • Репутация: 71
  • Откуда:РБ
  • IPB version:3.4.x
 

Отправлено 01 Март 2015 - 16:29

Просмотреть сообщениеАтаман 01 Март 2015 - 15:37 сказал(а):

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

Спасибо, нашёл какой-то Staffbox, он вроде. Но посмотрим, как будет работать. Хотелось, бы конечно на движке одного компонента и не плодить сущности. И две вкладки. На крайний случай сверстать вкладки: в одной Shoutbox, в другой Staffbox <_< . А потом еще надо бы поддержку чата в мобильной версии (как в стиле Customobile)... морока одна.

Ладно, если не пойдет, буду дальше крутить Shoutbox
0

#9 Пользователь не на сайте   Одмин ответил: »

 
 
  • Advanced
  • ***
  • Insert nick to fast reply form
  • Quote selected text to fast reply form
  • Группа: Пользователи
  • Сообщений: 574
  • Регистрация: 21-Апрель 13
  • Репутация: 41
  • IPB version:3.4.x
 

Отправлено 01 Март 2015 - 19:16

Подскажите по теме, как из чата shoutbox удалить кнопки "Очистить" и "Обновить"?
0

#10 Пользователь не на сайте   Viktar83 ответил: »

 
 
  • Advanced
  • ***
  • Insert nick to fast reply form
  • Quote selected text to fast reply form
  • Группа: Пользователи
  • Сообщений: 120
  • Регистрация: 10-Декабрь 14
  • Репутация: 71
  • Откуда:РБ
  • IPB version:3.4.x
 

Отправлено 01 Март 2015 - 21:02

Просмотреть сообщениеОдмин 01 Март 2015 - 19:16 сказал(а):

Подскажите по теме, как из чата shoutbox удалить кнопки "Очистить" и "Обновить"?

Похоже, только удалив из шаблона:

Правка стиля -> skin_shoutbox_hooks -> hookGlobalShoutbox (это для глобального хука):

искать
<input type='button' id='shoutbox-clear-button'...
и
<input type='button' id='shoutbox-refresh-button'

Но зачем? Я бы удалил ВВ-коды (это всего лишь справка по ним, и пользы в глобальном хуке не вижу. Хук он для быстрых коротких сообщений. Кто захочет красиво оформить и использовать ВВ-коды, перейдет на вкладку Чат с полноразмерным редактором). Ну и "очистить" можно, раз мешает.

ПС:
Я так понимаю - из-за того, что не влазят в одну строку?
1

#11 Пользователь не на сайте   Одмин ответил: »

 
 
  • Advanced
  • ***
  • Insert nick to fast reply form
  • Quote selected text to fast reply form
  • Группа: Пользователи
  • Сообщений: 574
  • Регистрация: 21-Апрель 13
  • Репутация: 41
  • IPB version:3.4.x
 

Отправлено 01 Март 2015 - 21:21

Viktar83, да, именно из-за этого, перфекционист мать его :D
BB-коды если честно тоже надо удалить, они там вообще ни к месту. Кнопка "Удалить" вообще непонятно для чего, если можно всё очистить вручную...
А кнопка "Обновить" в моем случае лишняя, ибо у меня чат быстренько обновляется...
Но благодарю за ответ. Иска-искал до Вашего совета, но так и не нашел...
0

#12 Пользователь не на сайте   Viktar83 ответил: »

 
 
  • Advanced
  • ***
  • Insert nick to fast reply form
  • Quote selected text to fast reply form
  • Группа: Пользователи
  • Сообщений: 120
  • Регистрация: 10-Декабрь 14
  • Репутация: 71
  • Откуда:РБ
  • IPB version:3.4.x
 

Отправлено 01 Март 2015 - 21:29

Ну как знаете )
Если не только для глобального хука, но и для основного чата - то там же в шаблонах skin_shoutbox все должно быть по идее...

А когда удалите все лишнее, может получиться так, что останется пустое место справа от кнопок. В таком случае можно растянуть поле ввода текста. Чуть позже выложу, если интересует (пойду гляну, как я это делал)...
1

#13 Пользователь не на сайте   Одмин ответил: »

 
 
  • Advanced
  • ***
  • Insert nick to fast reply form
  • Quote selected text to fast reply form
  • Группа: Пользователи
  • Сообщений: 574
  • Регистрация: 21-Апрель 13
  • Репутация: 41
  • IPB version:3.4.x
 

Отправлено 01 Март 2015 - 21:52

Viktar83, в общем удалил только ББ-коды... а что касается лишнего места, то у меня там его (справа) не так уж и много осталось. Но в идеале, конечно, желательно бы поле ввода растянуть на максимум, чтобы было идеально))
0

#14 Пользователь не на сайте   Viktar83 ответил: »

 
 
  • Advanced
  • ***
  • Insert nick to fast reply form
  • Quote selected text to fast reply form
  • Группа: Пользователи
  • Сообщений: 120
  • Регистрация: 10-Декабрь 14
  • Репутация: 71
  • Откуда:РБ
  • IPB version:3.4.x
 

Отправлено 01 Март 2015 - 22:19

Просмотреть сообщениеОдмин 01 Март 2015 - 21:52 сказал(а):

Viktar83, в общем удалил только ББ-коды... а что касается лишнего места, то у меня там его (справа) не так уж и много осталось. Но в идеале, конечно, желательно бы поле ввода растянуть на максимум, чтобы было идеально))

Согласен. Тем более, если ширина у сайта не фиксированная. А к тому же у стандартного стиля она задана в %. Т.е. в зависимости от монитора может быть довольно широкой. И тогда уж точно будет пустое место справа. но мы ведь перфекционисты )) Поэтому:

1) из шаблона глобального хука удаляем ненужные более кнопки

Вот что было:

<input type='text' id='shoutbox-global-shout' size='70' class='input_text' />
<input type='button' id='shoutbox-submit-button' value='{$this->lang->words['shout']}' class='input_submit' />
<input type='button' id='shoutbox-clear-button' value='{$this->lang->words['clear']}' class='input_submit alt' />
<input type='button' id='shoutbox-refresh-button' value='{$this->lang->words['refresh']}' class='input_submit alt' />
<if test="$this->settings['shoutbox_allow_smilies']"> <input type='button' id='shoutbox-smilies-button' value='{$this->lang->words['smilies']}' class='input_submit alt' data-clicklaunch="populateSmilies" data-scope="shoutbox" /></if>
<if test="$this->settings['shoutbox_allow_bbcode']"> <input type='button' id='shoutbox-bbcode-button' value='{$this->lang->words['bbcode']}' class='input_submit alt' /></if>
<input type='button' id='shoutbox-myprefs-button' value='{$this->lang->words['my_prefs']}' class='input_submit alt' />


я удалил только кнопку "ВВ-коды"

Вот что осталось:

<input type='text' id='shoutbox-global-shout' class='input_text' />
<input type='button' id='shoutbox-submit-button' value='{$this->lang->words['shout']}' class='input_submit' />
<input type='button' id='shoutbox-clear-button' value='{$this->lang->words['clear']}' class='input_submit alt' />
<input type='button' id='shoutbox-refresh-button' value='{$this->lang->words['refresh']}' class='input_submit alt' />
<if test="$this->settings['shoutbox_allow_smilies']"> <input type='button' id='shoutbox-smilies-button' value='{$this->lang->words['smilies']}' class='input_submit alt' data-clicklaunch="populateSmilies" data-scope="shoutbox" /></if>
<input type='button' id='shoutbox-myprefs-button' value='{$this->lang->words['my_prefs']}' class='input_submit alt' />



2) оборачиваем кнопки и поле ввода в разные слои:

при этом поле ввода текста теперь смещаем вниз

<div id='shoutbox-right'>
	<input type='button' id='shoutbox-submit-button' value='{$this->lang->words['shout']}' class='input_submit' />
	<input type='button' id='shoutbox-clear-button' value='{$this->lang->words['clear']}' class='input_submit alt' />
	<input type='button' id='shoutbox-refresh-button' value='{$this->lang->words['refresh']}' class='input_submit alt' />
	<if test="$this->settings['shoutbox_allow_smilies']"> <input type='button' id='shoutbox-smilies-button' value='{$this->lang->words['smilies']}' class='input_submit alt' data-clicklaunch="populateSmilies" data-scope="shoutbox" /></if>
	<input type='button' id='shoutbox-myprefs-button' value='{$this->lang->words['my_prefs']}' class='input_submit alt' />
</div>
<div id='shoutbox-left'>
	<input type='text' id='shoutbox-global-shout' class='input_text' />
</div>


3) прописываем в CSS (ipshoutbox.css) следующие свойства (просто добавляем в конце):

#shoutbox-left { margin-right: 480px; }  /* сумма длин кнопок справа + отступы между ними - нужно будет просто подобрать */
#shoutbox-global-shout { width: 100%; }  /* текстовое поле должно быть растянуто на всю ширину родителя */
#shoutbox-right { float: right; }  /* слой с кнопками вправо */
#shoutbox-right input { width: 90px !important; }  /* тут я жестко задал длину для каждой из кнопок, иначе она зависела от вмещающего текста (названия) и могла быть непостоянной */

#shoutbox-shouts  { background: #FFFFFF !important; } /* по желанию */
table.shoutbox_table tr:nth-child(even) { background: #F6F6F6 !important;} /* это по желанию: чередование цвета полосок с сообщениями */
table.shoutbox_table tr:nth-child(odd) { background: #FFFFFF !important; } /* это по желанию: чередование цвета полосок с сообщениями */


4) Результат: при разной ширине поле ввода текста всегда растягивается на максимум
Вложение  0.jpg (26,17К)
Количество загрузок: 13 Вложение  1.jpg (21,75К)
Количество загрузок: 18

Пробуйте, вроде ничего не упустил...

Сообщение изменено: Viktar83 (01 Март 2015 - 22:26)

1

#15 Пользователь не на сайте   Одмин ответил: »

 
 
  • Advanced
  • ***
  • Insert nick to fast reply form
  • Quote selected text to fast reply form
  • Группа: Пользователи
  • Сообщений: 574
  • Регистрация: 21-Апрель 13
  • Репутация: 41
  • IPB version:3.4.x
 

Отправлено 01 Март 2015 - 22:50

Viktar83, отлично, благодарствую! Правда на сегодня закончился лимит "спасибок"! ))
Если сможете додумать, как сделать, чтобы при обновлении аякса, когда исчезает кнопка "Обновить", либо растягивалось поле ввода, либо утолщались во всю длину остальные кнопки, - было бы вообще высший пилотаж! А так, теперь когда происходит обновление чата, исчезает кнопка "Обновить" (ну она и раньше исчезала), и соответственно, во время ее исчезания, остается пустое поле. Не совсем красиво...
0

Сообщить об этой теме:


  • 2 Страниц +
  • 1
  • 2


Быстрый ответ

  

1 пользователей читают эту тему
0 зарегистрированных, 1 гостей, 0 скрытых


Контактная информация

Вопросы по работе сайта

+7 (917) 501-4765
C 10 до 20 в рабочие дни (время московское)

Техническая поддержка

Контактные данные специалистов

Дизайн форумов

IPB 3.x ¦ IPB 2.x

Бесплатные шаблоны

IPB 3.2 – 3.4 ¦ IPB 3.1 ¦ IPB 3.0 ¦ IPB 2.2 – 2.3 ¦ IPB 2.1 ¦ Клипарт
Лицензия на использование ¦ Ваша поддержка ¦ О проекте
Copyright © 2005-2016 IPBSkins.ru Team
При копировании материалов с сайта
прямая ссылка на источник обязательна