НОВЫЙ ВИД ДЛЯ МИНИ-ЧАТА (ПРЯМОЙ ОБМЕН СООБЩЕНИЯМИ)

НОВЫЙ ВИД ДЛЯ МИНИ-ЧАТА (ПРЯМОЙ ОБМЕН СООБЩЕНИЯМИ)

14.03.2017 1381 2 SТРАННИК Все для uCoz Скрипты для uCoz

Мне нравится5

Описание:

Это реализация нового вида для мини-чата, а точнее его заготовка. Вы можете посмотреть его в живую в предоставленной демонстрации. Возможно, в дальнейшем я его доработаю и адаптируем под готовую версию мини-чата для сайта. Пока что это просто демонстрация, но задумка, согласитесь, очень интересная.

Давайте приступим к его демонстрационной установке.

Подключим минимализированную версию библиотеки CSS стилей для скроллинга сообщений (jquery.mCustomScrollbar.min.css)

Код

<link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/malihu-custom-scrollbar-plugin/3.1.3/jquery.mCustomScrollbar.min.css'>

Теперь этот код где будет выглядит мини-чат:

Код

<div class="chat">
     <div class="chat-title">
     <h1>Sтранник</h1>
     <h2>Администратор</h2>
     <figure class="avatar">
     <img src="https://373480170.uid.me/avatar.jpg" /></figure>
     </div>
     <div class="messages">
     <div class="messages-content"></div>
     </div>
     <div class="message-box">
     <textarea type="text" class="message-input" placeholder="Введите сообщение..."></textarea>
     <button type="submit" class="message-submit">Отправить</button>
     </div>
</div>

Теперь добавим в CSS стили:

Код

<style type="text/css">
     *,
     *::before,
     *::after {
     box-sizing: border-box;
     }

     /* Chat
     --------------------*/
     .chat {
     position: absolute;
     top: 50%;
     left: 50%;
     -webkit-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
     width: 300px;
     height: 80vh;
     max-height: 500px;
     z-index: 2;
     overflow: hidden;
     box-shadow: 0 5px 30px rgba(0, 0, 0, 0.2);
     background: rgba(0, 0, 0, 0.5);
     border-radius: 20px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: justify;
     -ms-flex-pack: justify;
     justify-content: space-between;
     -webkit-box-orient: vertical;
     -webkit-box-direction: normal;
     -ms-flex-direction: column;
     flex-direction: column;
     }

     /* Chat Title
     --------------------*/
     .chat-title {
     -webkit-box-flex: 0;
     -ms-flex: 0 1 45px;
     flex: 0 1 45px;
     position: relative;
     z-index: 2;
     background: rgba(0, 0, 0, 0.2);
     color: #fff;
     text-transform: uppercase;
     text-align: left;
     padding: 10px 10px 10px 50px;
     }

     .chat-title h1,
     .chat-title h2 {
     font-weight: normal;
     font-size: 10px;
     margin: 0;
     padding: 0;
     }

     .chat-title h2 {
     color: rgba(255, 255, 255, 0.5);
     font-size: 8px;
     letter-spacing: 1px;
     }

     .chat-title .avatar {
     position: absolute;
     z-index: 1;
     top: 8px;
     left: 9px;
     border-radius: 30px;
     width: 30px;
     height: 30px;
     overflow: hidden;
     margin: 0;
     padding: 0;
     border: 2px solid rgba(255, 255, 255, 0.24);
     }

     .chat-title .avatar img {
     width: 100%;
     height: auto;
     }

     /* Messages
     --------------------*/
     .messages {
     -webkit-box-flex: 1;
     -ms-flex: 1 1 auto;
     flex: 1 1 auto;
     color: rgba(255, 255, 255, 0.5);
     overflow: hidden;
     position: relative;
     width: 100%;
     }

     .messages .messages-content {
     position: absolute;
     top: 0;
     left: 0;
     height: 101%;
     width: 100%;
     }

     .messages .message {
     clear: both;
     float: left;
     padding: 6px 10px 7px;
     border-radius: 10px 10px 10px 0;
     background: rgba(0, 0, 0, 0.3);
     margin: 8px 0;
     font-size: 11px;
     line-height: 1.4;
     margin-left: 35px;
     position: relative;
     text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
     }

     .messages .message .timestamp {
     position: absolute;
     bottom: -15px;
     font-size: 9px;
     color: rgba(255, 255, 255, 0.3);
     }

     .messages .message::before {
     content: '';
     position: absolute;
     bottom: -6px;
     border-top: 6px solid rgba(0, 0, 0, 0.3);
     left: 0;
     border-right: 7px solid transparent;
     }

     .messages .message .avatar {
     position: absolute;
     z-index: 1;
     bottom: -15px;
     left: -35px;
     border-radius: 30px;
     width: 30px;
     height: 30px;
     overflow: hidden;
     margin: 0;
     padding: 0;
     border: 2px solid rgba(255, 255, 255, 0.24);
     }

     .messages .message .avatar img {
     width: 100%;
     height: auto;
     }

     .messages .message.message-personal {
     float: right;
     color: #fff;
     text-align: right;
     background: -webkit-linear-gradient(330deg, #248A52, #257287);
     background: linear-gradient(120deg, #248A52, #257287);
     border-radius: 10px 10px 0 10px;
     }

     .messages .message.message-personal::before {
     left: auto;
     right: 0;
     border-right: none;
     border-left: 5px solid transparent;
     border-top: 4px solid #257287;
     bottom: -4px;
     }

     .messages .message:last-child {
     margin-bottom: 30px;
     }

     .messages .message.new {
     -webkit-transform: scale(0);
     transform: scale(0);
     -webkit-transform-origin: 0 0;
     transform-origin: 0 0;
     -webkit-animation: bounce 500ms linear both;
     animation: bounce 500ms linear both;
     }

     .messages .message.loading::before {
     position: absolute;
     top: 50%;
     left: 50%;
     -webkit-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
     content: '';
     display: block;
     width: 3px;
     height: 3px;
     border-radius: 50%;
     background: rgba(255, 255, 255, 0.5);
     z-index: 2;
     margin-top: 4px;
     -webkit-animation: ball 0.45s cubic-bezier(0, 0, 0.15, 1) alternate infinite;
     animation: ball 0.45s cubic-bezier(0, 0, 0.15, 1) alternate infinite;
     border: none;
     -webkit-animation-delay: .15s;
     animation-delay: .15s;
     }

     .messages .message.loading span {
     display: block;
     font-size: 0;
     width: 20px;
     height: 10px;
     position: relative;
     }

     .messages .message.loading span::before {
     position: absolute;
     top: 50%;
     left: 50%;
     -webkit-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
     content: '';
     display: block;
     width: 3px;
     height: 3px;
     border-radius: 50%;
     background: rgba(255, 255, 255, 0.5);
     z-index: 2;
     margin-top: 4px;
     -webkit-animation: ball 0.45s cubic-bezier(0, 0, 0.15, 1) alternate infinite;
     animation: ball 0.45s cubic-bezier(0, 0, 0.15, 1) alternate infinite;
     margin-left: -7px;
     }

     .messages .message.loading span::after {
     position: absolute;
     top: 50%;
     left: 50%;
     -webkit-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
     content: '';
     display: block;
     width: 3px;
     height: 3px;
     border-radius: 50%;
     background: rgba(255, 255, 255, 0.5);
     z-index: 2;
     margin-top: 4px;
     -webkit-animation: ball 0.45s cubic-bezier(0, 0, 0.15, 1) alternate infinite;
     animation: ball 0.45s cubic-bezier(0, 0, 0.15, 1) alternate infinite;
     margin-left: 7px;
     -webkit-animation-delay: .3s;
     animation-delay: .3s;
     }

     /* Message Box
     --------------------*/
     .message-box {
     -webkit-box-flex: 0;
     -ms-flex: 0 1 40px;
     flex: 0 1 40px;
     width: 100%;
     background: rgba(0, 0, 0, 0.3);
     padding: 10px;
     position: relative;
     }

     .message-box .message-input {
     background: none;
     border: none;
     outline: none !important;
     resize: none;
     color: rgba(255, 255, 255, 0.7);
     font-size: 11px;
     height: 17px;
     margin: 0;
     padding-right: 20px;
     width: 265px;
     }

     .message-box textarea:focus:-webkit-placeholder {
     color: transparent;
     }

     .message-box .message-submit {
     position: absolute;
     z-index: 1;
     top: 9px;
     right: 10px;
     color: #fff;
     border: none;
     background: #248A52;
     font-size: 10px;
     text-transform: uppercase;
     line-height: 1;
     padding: 6px 10px;
     border-radius: 10px;
     outline: none !important;
     -webkit-transition: background .2s ease;
     transition: background .2s ease;
     }

     .message-box .message-submit:hover {
     background: #1D7745;
     }

     /* Custom Srollbar
     --------------------*/
     .mCSB_scrollTools {
     margin: 1px -3px 1px 0;
     opacity: 0;
     }

     .mCSB_inside > .mCSB_container {
     margin-right: 0px;
     padding: 0 10px;
     }

     .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
     background-color: rgba(0, 0, 0, 0.5) !important;
     }

     /* Bounce
     --------------------*/
     @-webkit-keyframes bounce {
     0% {
     -webkit-transform: matrix3d(0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     4.7% {
     -webkit-transform: matrix3d(0.45, 0, 0, 0, 0, 0.45, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(0.45, 0, 0, 0, 0, 0.45, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     9.41% {
     -webkit-transform: matrix3d(0.883, 0, 0, 0, 0, 0.883, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(0.883, 0, 0, 0, 0, 0.883, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     14.11% {
     -webkit-transform: matrix3d(1.141, 0, 0, 0, 0, 1.141, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(1.141, 0, 0, 0, 0, 1.141, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     18.72% {
     -webkit-transform: matrix3d(1.212, 0, 0, 0, 0, 1.212, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(1.212, 0, 0, 0, 0, 1.212, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     24.32% {
     -webkit-transform: matrix3d(1.151, 0, 0, 0, 0, 1.151, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(1.151, 0, 0, 0, 0, 1.151, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     29.93% {
     -webkit-transform: matrix3d(1.048, 0, 0, 0, 0, 1.048, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(1.048, 0, 0, 0, 0, 1.048, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     35.54% {
     -webkit-transform: matrix3d(0.979, 0, 0, 0, 0, 0.979, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(0.979, 0, 0, 0, 0, 0.979, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     41.04% {
     -webkit-transform: matrix3d(0.961, 0, 0, 0, 0, 0.961, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(0.961, 0, 0, 0, 0, 0.961, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     52.15% {
     -webkit-transform: matrix3d(0.991, 0, 0, 0, 0, 0.991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(0.991, 0, 0, 0, 0, 0.991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     63.26% {
     -webkit-transform: matrix3d(1.007, 0, 0, 0, 0, 1.007, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(1.007, 0, 0, 0, 0, 1.007, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     85.49% {
     -webkit-transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     100% {
     -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     }

     @keyframes bounce {
     0% {
     -webkit-transform: matrix3d(0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     4.7% {
     -webkit-transform: matrix3d(0.45, 0, 0, 0, 0, 0.45, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(0.45, 0, 0, 0, 0, 0.45, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     9.41% {
     -webkit-transform: matrix3d(0.883, 0, 0, 0, 0, 0.883, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(0.883, 0, 0, 0, 0, 0.883, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     14.11% {
     -webkit-transform: matrix3d(1.141, 0, 0, 0, 0, 1.141, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(1.141, 0, 0, 0, 0, 1.141, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     18.72% {
     -webkit-transform: matrix3d(1.212, 0, 0, 0, 0, 1.212, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(1.212, 0, 0, 0, 0, 1.212, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     24.32% {
     -webkit-transform: matrix3d(1.151, 0, 0, 0, 0, 1.151, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(1.151, 0, 0, 0, 0, 1.151, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     29.93% {
     -webkit-transform: matrix3d(1.048, 0, 0, 0, 0, 1.048, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(1.048, 0, 0, 0, 0, 1.048, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     35.54% {
     -webkit-transform: matrix3d(0.979, 0, 0, 0, 0, 0.979, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(0.979, 0, 0, 0, 0, 0.979, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     41.04% {
     -webkit-transform: matrix3d(0.961, 0, 0, 0, 0, 0.961, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(0.961, 0, 0, 0, 0, 0.961, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     52.15% {
     -webkit-transform: matrix3d(0.991, 0, 0, 0, 0, 0.991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(0.991, 0, 0, 0, 0, 0.991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     63.26% {
     -webkit-transform: matrix3d(1.007, 0, 0, 0, 0, 1.007, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(1.007, 0, 0, 0, 0, 1.007, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     85.49% {
     -webkit-transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     100% {
     -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
     }
     }

     @-webkit-keyframes ball {
     from {
     -webkit-transform: translateY(0) scaleY(0.8);
     transform: translateY(0) scaleY(0.8);
     }
     to {
     -webkit-transform: translateY(-10px);
     transform: translateY(-10px);
     }
     }

     @keyframes ball {
     from {
     -webkit-transform: translateY(0) scaleY(0.8);
     transform: translateY(0) scaleY(0.8);
     }
     to {
     -webkit-transform: translateY(-10px);
     transform: translateY(-10px);
     }
     }
</style>

Теперь нам необходимо подключить плагины, jQuery и mCustomScrollbar отвечающий за скроллинг сообщений в чате.

Код

<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/malihu-custom-scrollbar-plugin/3.1.3/jquery.mCustomScrollbar.concat.min.js'></script>

Ну и в завершении, подключаем сам js обработчик нашего мини-чата

Код

<script>
     var $messages = $('.messages-content'),
     d, h, m,
     i = 0;

     $(window).load(function () {
     $messages.mCustomScrollbar();
     setTimeout(function () {
     fakeMessage();
     }, 100);
     });

     function updateScrollbar() {
     $messages.mCustomScrollbar("update").mCustomScrollbar('scrollTo', 'bottom', {
     scrollInertia: 10,
     timeout: 0
     });
     }

     function setDate() {
     d = new Date()
     if (m != d.getMinutes()) {
     m = d.getMinutes();
     $('<div class="timestamp">' + d.getHours() + ':' + m + '</div>').appendTo($('.message:last'));
     }
     }

     function insertMessage() {
     msg = $('.message-input').val();
     if ($.trim(msg) == '') {
     return false;
     }
     $('<div class="message message-personal">' + msg + '</div>').appendTo($('.mCSB_container')).addClass('new');
     setDate();
     $('.message-input').val(null);
     updateScrollbar();
     setTimeout(function () {
     fakeMessage();
     }, 1000 + (Math.random() * 20) * 100);
     }

     $('.message-submit').click(function () {
     insertMessage();
     });

     $(window).on('keydown', function (e) {
     if (e.which == 13) {
     insertMessage();
     return false;
     }
     })

     var Fake = [
     'Здравствуйте, я Buger - руководитель сайта Turbo-S.uCoz.ru, а вы?',
     'Очень приятно!',
     'Как ваши дела? Как настроение?',
     'Чем вы занимаетесь?',
     'Это потрясающе',
     'Turbo-S - отличный интернет-магазин',
     'Я думаю вам понравится здесь',
     'Почему вы так думаете?',
     'Извините, мне нужно отлучиться не на долгое время',
     'Было приятно пообщаться с вами',
     'Буду рад видеть вас здесь снова',
     'До свидания!',
     ':)'
]

     function fakeMessage() {
     if ($('.message-input').val() != '') {
     return false;
     }
     $('<div class="message loading new"><figure class="avatar"><img src="https://373480170.uid.me/avatar.jpg" /></figure><span></span></div>').appendTo($('.mCSB_container'));
     updateScrollbar();

     setTimeout(function () {
     $('.message.loading').remove();
     $('<div class="message new"><figure class="avatar"><img src="https://373480170.uid.me/avatar.jpg" /></figure>' +Fake [i]+ '</div>').appendTo($('.mCSB_container')).addClass('new');
     setDate();
     updateScrollbar();
     i++;
     }, 1000 + (Math.random() * 20) * 100);

     }
</script>

НОВЫЙ ВИД ДЛЯ МИНИ-ЧАТА (ПРЯМОЙ ОБМЕН СООБЩЕНИЯМИ)

Файлы для скачивания отсутствуют.

Поблагодарить автора Автор: SТРАННИК

ИсточникМатериал взят с другого сайта

Комментарии (2)

Добавить комментарий

Порядок вывода комментариев:

-1

1. lena1971gavr 02.04.2018 в 12:27

Не могли бы вы более подробнее/понятнее объяснить как его правильно устанавливать...

0

2. AllTmpl 02.12.2018 в 20:23

Вроде как написано, что и куда.. Или я ошибаюсь?

Шаблоны для uCoz [209]

Шаблоны - это лицо вашего сайта, его стиль и цвет выбирать Вам, а для хорошего выбора нужен большой ассортимент шаблонов, именно такой, какой находится в нашем каталоге. Шаблоны для uCoz на любой вкус: Адаптированные, игровые, варез-шаблоны, универсальные, визитки, одностраничники, образовательные, портфолио и многие другие в нашем архиве.

Скрипты для uCoz [422]

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

Меню для Сайта [44]

Меню - это глаза вашего сайта,их красота это второстепенное аспект,на который опираются вебмастеры,самое главное-это его компактность и удобство использования.

Шапки для Сайта [15]

Шапки для сайта - это графическое изображение,иногда встречаются и анимированные,которые располагаются в самом верху вашего сайта.

Кнопки для Ucoz [30]

Кнопки для Ucoz-такого рода приспособления украшают сайт и в некоторых случаях являются необходимым элементом сайта.К примеру для того что бы скачать с сайта файл нужна соответствующая кнопка скачать,которая и будет тем связующим элементом между пользователем и местом хранения файла

Вид материалов [98]

Виды материалов - отвечают за отображение материалов в списке какого-либо модуля.

Информеры [39]

Информеры - дополнительные возможности, которые позволяют сделать вывод материалов из определенного модулей на одной или нескольких страницах сайта. Для примера можете посмотреть на информер «Новое на форуме», который находится у нас на сайте справа в блоках. Информер позволит сделать сайт максимально удобным для посетителей.

Иконки форума [6]

Иконки форума-графическое изображение находящиеся на форуме сайта и выполняет функцию декорации и сигнализации о том,что данная тема либо закрыта,либо эта тема популярна среди пользователей

Иконки групп [21]

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

Слайдеры [0]

Прелоадеры (Загрузка) [0]

Ajax окна для uCoz [1]

Создать свой форум бесплатно

Новое на форуме

Мини-чат

Недавние комментарии

AllTmpl 02.12.2018 - 20:23

Вроде как написано, что и куда.. Или я ошибаюсь?

lena1971gavr 02.04.2018 - 12:27

Не могли бы вы более подробнее/понятнее объяснить как его правильно устанавливать...

milan_shubin 29.03.2018 - 11:22

Вот по этому ты меня заблокировал, смотри кто его добавил, это первый админ сайта Milan_Shubin_, А вот мой логин Milan_Shubin, без _ в конце!

Полезные ссылки