Новый, светлый мини-чат как на Zagruzka-Plus для uCoz


Новый, светлый мини-чат как на Zagruzka-Plus для uCoz

5596
8.2 из 10
Проголосовало: 13





Полностью рабочий и функциональный чат, почти такой же как и на Zagruzka-Plus
Как-то он уже был выложен в интернете, но в нём была целая гора багов..
Но я решил довести его до хорошего состояния и вот теперь он в паблике)


Описание и изменения функционала чата:

- Аватар рядом с ником
- Ник администратора красный, а остальных чёрный
- Красивая полоса прокрутки (только для Google Chrome)
- Наличие вызова правил чата
- Новая кнопка - Обновить (Вместо звуков)
- Красивая панель bb-кодов и кнопок (отправить, отмена, написать)
- Изменение цвета отдельных слов или всего сообщения
- Ну и конечно красивый, светлый дизайн)

И другие мелочи которые вы сможете увидеть, после установки

Немного скриншотов:


Гостям запрещено добавлять сообщения:


Думаю эта функция никому и не нужна..

Перейдем к установки:

Перед началом установки можете на всякий случай сохранить
"Вид материалов Мини-Чата" И "Форму добавления сообщения"
(например в блокноте на рабочем столе)

1) Убираем отображение кода безопасности пользователям:
Заходим сюда : http://адрес_вашего_сайта/panel/?a=users;l=groups;t=8
Открываем раздел "Разное"
И в напротив пункта "Не показывать код безопасности" - ставим все галки
Сохраняем

Далее заходим сюда: http://адрес_вашего_сайта/panel/?a=mchat;l=setup
Ищем строчку "Использовать код безопасности для группы "Пользователи":"
И напротив снимаем галочку и потом сохраняем

2) Скачиваем архив (по ссылке выше)
Открываем его и переносим папку serv на рабочий стол
Загружаем её в корень сайта (через FTP программу или файловый менеджер)
Путь должен получится такой: http://адрес_вашего_сайта/serv

3) Заходим в ПУ » Управление дизайном » Мини-Чат » Вид материалов
И заменяем всё на этот код:

Code
<?if($NUMBER$=1)?>  
  <link type="text/css" rel="StyleSheet" href="/serv/chatok/chat.css" />  
  <style type="text/css">  
  #body{}  
  ::-webkit-scrollbar  
  {  
  width: 5px;  
  height: 9px;  
  }  
  ::-webkit-scrollbar-track-piece  
  {  
  background-color: #ffffff;  
  -webkit-border-radius: 5px;  
  }  
  ::-webkit-scrollbar-thumb:vertical  
  {  
  height: 9px;  
  background-color: #666;  
  -webkit-border-radius: 5px;  
  }  
  ::-webkit-scrollbar-thumb:horizontal  
  {  
  width: 5px;  
  background-color: #666;  
  -webkit-border-radius: 5px;  

  }  
  </style>  
  <?endif?>  

  <div style="padding:4px;">  
  <span class="chat-message-block">  
  <table border="0" cellpadding="0" cellspacing="0" width="100%">  
  <tbody>  
  <tr>  
  <td width="40">  
  <span class="chatAvatar"><?if($AVATAR_URL$)?><img src="$AVATAR_URL$"><?else?><img src="/serv/chatok/noavatar.png"><?endif?></span></td>  
  <td style="font-size:8pt; color:#666; line-height:14px;">  
  <div style="float:right; margin-right:5px;">  
  <span class="chat-button chat-reply tipsy-top" title="Ответить" href="javascript:void('Apply to')" onclick="parent.window.document.getElementById('asrea').focus();parent.window.document.getElementById('mchatMsgF').value+='[b]$USERNAME$[/b], ';return false;"></span>  
  </div>  
  <b>  

  <?if($USER_ID$='1')?><a style="color:red;" href="$PROFILE_URL$">$USERNAME$</a><?else?><a href="$PROFILE_URL$">$USERNAME$</a><?endif?>  

  </b><br>  
  <span class="small">$DATE$ в $TIME$</span>  
  </td>  
  </tr>  
  </tbody>  
  </table>  
  <div style="padding:3px 0px 3px 0px;">  
  $MESSAGE$  
  </div>  
  </span>  
  <div class="hr"></div>  
  </div>


4) Заходим в ПУ » Управление дизайном » Мини-Чат » Форма добавления сообщения
И заменяем всё на этот код:

Code
<link type="text/css" rel="StyleSheet" href="/serv/chatok/add.css" />  
  <?if(!$CAN_ADD$)?>  
  <div class="letg">  
  <div class="chat-panel" style="">  
  <a href="$LOGIN_LINK$" style="color:#fff; text-decoration: none;">Вы не авторизованы</a>  
  </div>  
  </div>  
  <?endif?>  
  <?if($CAN_ADD$)?>  
  <script>  
  function valueCheck(){  
  $('#iChat-write-form').show();  
  $('.chat-panel').hide();  
  $('#mchatMsgF').focus();  
  }  
  </script>  
  <div class="letg">  
  <div class="chat-panel">  
  <?if($USER_ID$='1')?><?if($MSGCTRL_URI$)?><span class="chat-panel-button button-archive tipsy-top" title="Управление сообщениями" href="$MSGCTRL_URI$" original-title="Управление сообщениями"> </span><?endif?><?else?><span class="chat-panel-button button-archive tipsy-top" onclick="new _uWnd.alert('Данное действие разрешено только <b>Администратору</b>','Управление сообщениями',{w:400,h:60,tm:3500,close:1})" title="Управление сообщениями" href="javascript://" original-title="Управление сообщениями"> </span><?endif?>  
  <span class="chat-panel-button chat-send-button" onclick="$('#iChat-write-form').toggle(500);$('.chat-panel').toggle(500);return false;">Написать</span>  
  <span class="chat-panel-button button-rules tipsy-top" title="Правила" href="javascript://" onclick="new _uWnd('commadd','Правила Мини-Чата',300,200,{align:'left',min:0,shadow:1,header:1,max:0,resize:0},'<b>Запрещено:</b><br><span id=plp>Развязывать разборки (для этого есть ЛС)</span><br><span id=plp> Писать 3-и или более сообщений подряд</span><br><span id=plp>Добавлять спам, рекламу флуд..</span><br><span id=plp>Оскорбление администрации</span><br><span id=plp>Часто писать с вкл. Caps Lock</span>');" original-title="Правила"> </span>  
  <span class="chat-panel-button button-sound tipsy-top" title="Обновить" onclick="document.getElementById('mchatIfm2').src='/mchat/?'+Math.random();return false;" original-title="Обновить"> </span>  
  </div>  
  </div>  
  <div class="letg">  
  <textarea id="asrea" onFocus="valueCheck()"></textarea>  
  <div id="iChat-write-form" style="display:none">  
  <div class="ichat-editor">  
  <div class="bbcodes-p">  
  <span id="b_b" class="editor_button" href="javascript:void('Apply to')" onclick="bbCode('b');return false;"><img title="Полужирный" src="/serv/chatok/bold.png" width="16" height="16" border="0" alt=""></span>  
  <span id="b_i" class="editor_button" href="javascript:void('Apply to')" onclick="bbCode('i');return false;"><img title="Курсив" src="/serv/chatok/italic.png" width="16" height="16" border="0" alt=""></span>  
  <span id="b_i" class="editor_button" href="javascript:void('Apply to')" onclick="bbCode('u');return false;"><img title="Подчёркнутый текст" src="/serv/chatok/underline.png" width="16" height="16" border="0" alt=""></span>  
  <span id="b_s" class="editor_button" href="javascript:void('Apply to')" onclick="bbCode('s');return false;"><img title="Зачеркнутый текст" src="/serv/chatok/stroke.png" width="16" height="16" border="0" alt=""></span>  
  <span id="b_emo" class="editor_button" href="$SMILES_URI$"><img title="Вставка смайликов" src="/serv/chatok/emoticon.png" width="16" height="16" border="0" alt=""></span>  
  <span id="b_color" class="editor_button" id="kmn" title="Выбрать цвет" onclick="openLayerB('sda',0,'/serv/chatok/zvetaf.xml','Выбор цвета',200,210,'1','','',0,'justify');return false;"><img src="/serv/chatok/colors.png" width="16" height="16" border="0" alt=""></span>  
  <span id="b_quote" class="editor_button" href="javascript:void('Apply to')" onclick="bbCode('quote');return false;"><img title="Вставка цитаты" src="/serv/chatok/quotes.png" width="16" height="16" border="0" alt=""></span>  
  </div>  
  </div>  
  <textarea name="mcmessage" class="mchat" id="mchatMsgF" title="Сообщение" onkeyup="countMessLength();"></textarea>  
  <script type="text/javascript" src="/serv/chatok/bbcodes.js"></script>  
  <div style="border:0px;" class="button-panel" align="center">  
  <span style="display:none" id="mchatAjax" align="center">  
  <span class"aer"><img src="/serv/chatok/next_load.gif"></span></span>  
  <input type="submit" class="zp-button" value="Отправить" id="mchatBtn">  
  <input type="button" class="zp-button" value="Отмена" onclick="$('#iChat-write-form').toggle(500);$('.chat-panel').toggle(500);return false;">$IMG_SECURE$$FLD_SECURE$  
  </div>  
  </div>  
  </div>  
  <input type="hidden" name="numa" id="numa832" value="0">  
  <input type="hidden" name="a" value="18">  
  <input type="hidden" id="ajaxFlag" name="ajax" value="1">  
  <?endif?>


Готово, Удачи
При копировании материала устанавливайте источник!
Автор публикации: Загрузка
Загрузка
Fatal1ti, это его n материал
Источник: http://novi4ok.ru
  • Всего комментариев: 24

rayven
0
rayven написал: Написано 03 Ноября 2015 в 12:10
Комментарий №24
интересный чат, но зараза так и не заработал.

IIul{Ys
0
IIul{Ys написал: Написано 05 Марта 2014 в 19:53
Комментарий №22
зачем делать цвет ника для 1 пользователя/админа? у меня может 1000 админов? почему нельзя сделать сразу для всей группы <?if($GROUP_ID$=4)?>??? проще, не?

Xgibit
0
Xgibit написал: Написано 05 Марта 2014 в 22:00
Комментарий №23
тебе так удобно, ты и делай. Кому не понравится сам переправит, не под тебя настраивали данный код.

ibook
0
ibook написал: Написано 21 Октября 2013 в 18:07
Комментарий №21
Помогите! Как отправить сообщение?

Nesqik
0
Nesqik написал: Написано 12 Апреля 2013 в 16:59
Комментарий №20
А как изменить правила на свои?

Fatal1ti
0
Fatal1ti написал: Написано 13 Января 2013 в 07:58
Комментарий №19
Вместо этой части кода:
Код
<?if($USER_ID$=1)?>

Вставь эту:
Код
<?if($USER_ID$=1 || $USER_ID$=2)?>


Где 2 - id второго админа
Если для трёх надо то так:
Код
<?if($USER_ID$=1 || $USER_ID$=2 || $USER_ID$=3)?>


Проделай это и в виде и в форме..

Насчёт изображения размером 128x128 не понятно
BB-code разрешены в чате?

Skr1ll3x
0
Skr1ll3x написал: Написано 25 Ноября 2012 в 08:37
Комментарий №16
а у меня где пишешь сообщение , не как на скрине белый фон, у меня темный что делать?

Fatal1ti
0
Fatal1ti написал: Написано 25 Ноября 2012 в 08:47
Комментарий №17
ссылку на сайт в лс скинь
посмотрю

Fatal1ti
0
Fatal1ti написал: Написано 25 Ноября 2012 в 13:56
Комментарий №18
в Таблицу стилей(CSS) добавь:
Code

.mchat {
background: white !important;
}

Jippik
0
Jippik написал: Написано 22 Ноября 2012 в 10:53
Комментарий №14
Klassno, Но как можно сделать "Форма добавления сообщения" по центру? она у меня на лево ушла, я пытался сделать <center> но не получилось

Fatal1ti
0
Fatal1ti написал: Написано 24 Ноября 2012 в 11:38
Комментарий №15
Отступ необходимо задать, и выровнять под дизайн
margin-left тебе в помощь

EVG-95
-1
EVG-95 написал: Написано 04 Ноября 2012 в 12:51
Комментарий №13
[удалено]

Ross_Kemp
0
Ross_Kemp написал: Написано 03 Ноября 2012 в 18:00
Комментарий №10
почему у меня ввиде материалов $MESSAGE$ размер текста большой че на зугрузке плюс?

Fatal1ti
0
Fatal1ti написал: Написано 03 Ноября 2012 в 18:17
Комментарий №11
Заключи $MESSAGE$ в этот код:
Code
<div style="font-size: 11px;">
$MESSAGE$
</div>


11px - меняй под себя

Ross_Kemp
0
Ross_Kemp написал: Написано 03 Ноября 2012 в 19:00
Комментарий №12
спс

Samlab
0
Samlab написал: Написано 02 Ноября 2012 в 12:19
Комментарий №2
Как мне его немного по ширине уменьшить? А то в блок не влезает.

Вовчик
+1
Вовчик написал: Написано 02 Ноября 2012 в 12:37
Комментарий №3
Quote (Samlab)
Как мне его немного по ширине уменьшить?

biggrin biggrin

ищи width:ЧИСЛОpx; и уменьшай по шире XD))

Samlab
+1
Samlab написал: Написано 02 Ноября 2012 в 22:45
Комментарий №5
мда, и че тут смешного, если я не русский dry

Fatal1ti
+1
Fatal1ti написал: Написано 02 Ноября 2012 в 15:00
Комментарий №4
Вот сделал стиль чтобы панель добавления сообщения была меньше
Ещё меньше уже никак не сделать, либо придётся кнопки убирать..

В "Форме добавления сообщения" заменяем эту строчку:
Code
<link type="text/css" rel="StyleSheet" href="/serv/chatok/add.css" />


На эту:

Code
<link type="text/css" rel="StyleSheet" href="http://fatal1ti.ucoz.ru/serv/chatok/add.css" />

Samlab
0
Samlab написал: Написано 03 Ноября 2012 в 12:18
Комментарий №6
еще немного нужно)

Fatal1ti
0
Fatal1ti написал: Написано 03 Ноября 2012 в 12:20
Комментарий №7
Что у тебя за контейнер такой узкий??

Samlab
0
Samlab написал: Написано 03 Ноября 2012 в 13:56
Комментарий №8
ну не сильно узкий) вот сайт [удалено] точка ру

Fatal1ti
0
Fatal1ti написал: Написано 03 Ноября 2012 в 14:01
Комментарий №9
Мсори..не то в тот раз написал
Code

<link type="text/css" rel="StyleSheet" href="http://fatal1ti.ucoz.ru/serv/chatok/adds.css" />

Вот на это, а то там add и adds перепутал

Winston888
0
Winston888 написал: Написано 02 Ноября 2012 в 12:19
Комментарий №1
Неплохо

  • Оставить комментарий:
Добавлять комментарии могут только зарегистрированные пользователи.
Регистрация | Вход
Меню сайта
Категории
Для помощи создания сайта uCoz 24
Скрипты и модификации для Ucoz 2101
Шаблоны форумов Ucoz 28
Шаблоны сайтов Ucoz 429
Авторство Webo4ki 309
php скрипты для ucoz 57
Графика для uCoz 40
Мини-чат
Последние комментарии
Поставил ваш код он начинает считать от 0 до 100 и останавливаеться. я думал он будет в случайном порядке показывать цыфры
как поставить свою ссылку и логотип
  • Сатурн-1 написал:
  • Похвально.
  • Winston888 написал:
  • Я не говорил что делаю только скрипты. Я делаю шаблоны, скрипты, адаптации с разных движков под ucoz и на оборот + я ещё и сам рисую. В данный момент занимаюсь дизайном для webo4ka сам рисую сам верстаю.
  • Сатурн-1 написал:
  • Заметь, мы делаем почти одну и ту же работу.
    Ты - скрипты, я -шаблон. И каждый делает это бесплатно, НО
    ты делаешь скрипты без шаблона, я делаю шаблон без скриптов (не считая основных).
    Я тоже могу сказать что твои скрипты не идеальны, но не буду т.к. даже не знаю какие из всех существующих твои.
    Поэтому ты не сравнивай скрипты и шаблоны да еще и на Ucoz'e, мы же не на хакатоне каком нибудь.
    Последние темы
    Опрос
    205
    А
    Р
    Что произойдёт: $("#...
    Статистика
    Анализ интернет сайта
    0
    онлайн
    0
    наших
    0
    чужих
    Онлайн всего: 4
    Гостей: 4
    Пользователей: 0
    0
    Сегодня были
    Топ пользователей: