Уважаемые пользователи seo-vebmaster.ucoz.net. Вы найдете у нас на портале - различные скрипты сайтов, уникальные, бесплатные шаблоны, модули, хаки и релизы популярных CMS . С Уважением Администрация seo-vebmaster.ucoz.net

Расширенные комментарии v2 для uCoz




Описание
Встречали в интернет-магазинах комментарии (в идеале отзывы), с возможностью указать достоинства и недостатки товара?
Теперь тоже самое Вы можете сделать и у себя!

Установка:

Зайдите в ПУ > Управление дизайном > Форма добавления комментариев и замените код на этот:

Код
<div class="comment-add">
<div class="ca-top">Оставить комментарий</div>
<div class="ca-form">
<div class="caf-extra-block">
<div class="caf-extra">
<label for="caf-plus">Достоинства</label>
<textarea id="caf_plus"></textarea>
</div>
<div class="caf-extra">
<label for="caf-minus">Недостатки</label>
<textarea id="caf_minus"></textarea>
</div>
</div>
<div class="caf-main">
<label for="caf-comm">Комментарий</label>
<textarea id="caf_comm"></textarea>
</div>
<div class="caf-default">
<textarea name="message" id="message"></textarea>
</div>
<?if($SECURITY_CODE$)?>$SECURITY_CODE$<?endif?>
<div class="ca-bottom">
<div class="cab-submit">
<input id="addcBut" type="submit" name="submit" value="Отправить">
</div>
<div class="cab-error">$ERROR$</div>
<div class="cab-select-extra">
<input id="change_extra" type="button" value="Расширенный" title="Изменить тип комментария">
</div>
</div>
</div>

<script>
$('#caf_plus, #caf_minus, #caf_comm').bind('keyup keydown', function(){
let valComm = $('#caf_comm').val(), isActive = $('.comment-add .caf-extra-block').hasClass('caf-active');
if(isActive){
let valPlus = $('#caf_plus').val(), valMinus = $('#caf_minus').val();
valPlus = (valPlus ? '[b]Достоинства:[/b]\n'+valPlus+'\n\n' : '');
valMinus = (valMinus ? '[b]Недостатки:[/b]\n'+valMinus+'\n\n' : '');
valComm = (valComm ? '[b]Комментарий:[/b]\n'+valComm : '');
$('#message').val((valPlus+valMinus+valComm));
} else $('#message').val(valComm);
});

$('#change_extra').on('click', function(){
let thisVal = $(this).val();
$(this).val(thisVal == 'Расширенный' ? 'Обычный':'Расширенный');
$('.comment-add .caf-extra-block').toggleClass('caf-active');
$('.comment-add textarea').val('');
});
</script>


Далее перейдите в ПУ > Управление дизайном > Таблица стилей (CSS) и добавьте вниз:

Код
.comment-add {display: block; width: 100%; background: #fff; color: #333; padding: 10px; box-sizing: border-box;}
.comment-add label {display: block;}
.comment-add textarea {font-weight: inherit; font-famaly: inherit; font-size: inherit; color: inherit; box-sizing: border-box; overflow: hidden auto;}
.comment-add .ca-top {display: block; width: 100%; font-size: 1rem; font-size: bold; margin-bottom: 10px;}
.comment-add .ca-form {display: block; width: 100%; margin-bottom: 10px;}
.comment-add .ca-form textarea {width: 100%; height: 80px; padding: 5px; border: 1px solid #aaa; border-radius: 5px; resize: none;}
.comment-add .ca-form textarea:hover {border-color: #999;}
.comment-add .ca-form textarea:focus {border-color: #07f;}
.comment-add .ca-form .caf-extra-block {display: none; width: 100%; margin-bottom: 5px;}
.comment-add .ca-form .caf-extra-block.caf-active {display: block;}
.comment-add .ca-form .caf-extra-block .caf-extra {display: inline-block; float: left;}
.comment-add .ca-form .caf-extra-block .caf-extra::after {content: ''; display: block; clear: both;}
.comment-add .ca-form .caf-extra-block .caf-extra:first-child {width: calc(50% - 10px); margin-right: 10px;}
.comment-add .ca-form .caf-extra-block .caf-extra:last-child {width: 50%;}
.comment-add .ca-form .caf-main {display: block; width: 100%; margin-bottom: 10px;}
.comment-add .ca-form .caf-main textarea {width: 100%; min-height: 80px; height: 80px; max-height: 300px; resize: vertical;}
.comment-add .ca-form .caf-default {display: none;}
.comment-add .ca-form .recaptcha-wrapper {margin-bottom: 10px;}
.comment-add .ca-bottom {display: block; width: 100%;}
.comment-add .ca-bottom::after {content: ''; display: block; clear: both;}
.comment-add .ca-bottom input {display: block; height: 30px; border-radius: 5px; background: #ddd; color: #333; border: 1px solid #ddd; box-sizing: border-box; cursor: pointer;}
.comment-add .ca-bottom input:hover {border-color: #07f;}
.comment-add .ca-bottom .cab-submit,
.comment-add .ca-bottom .cab-error,
.comment-add .ca-bottom .cab-select-extra {display: inline-block; float: left; height: 30px;}
.comment-add .ca-bottom .cab-submit,
.comment-add .ca-buttom .cab-submit input {width: 90px;}
.comment-add .ca-bottom .cab-error {width: calc(100% - 215px); margin: 0 5px; line-height: 30px;}
.comment-add .ca-bottom .cab-error .commError {text-align: left;}
.comment-add .ca-bottom .cab-select-extra,
.comment-add .ca-bottom .cab-select-extra input {width: 115px;}

Поделись ссылкой с друзьями:

Комментариев: 0
Просмотров: 101
Дата: 23.12.2020
avatar
Мини профиль
Для просмотра мини профиля,войдите на сайт как пользователь.
Мы в ВКонтакте
Популярные новости
Рамка для ...
Рамка для ...
Рамка для ...
Рамка для ...
Рамка для ...
Рамка для ...
Рамка для ...
Мини-чат
Для добавления необходимо
войти или зарегистрироваться
Статистика
Счетчики сайта
Top.Mail.Ru

Анализ сайта seo-vebmaster.ucoz.net Яндекс.Метрика Catalog.ru.net - Каталог сайтов
Сейчас online
Онлайн всего: 1
Гостей: 1
Пользователей: 0
Сегодня наш сайт посетили
Счетчик пользователей
Сегодня нас посетило
Счетчики сайта
  • Счетчик юзеров
  • Всего юзеров: 5
    За месяц: 0
    За неделю: 0
    За вчера: 0
    Сегодня: 0
  • Счетчик материалов
  • Всего файлов: 812
    Всего новостей: 0
    Всего статей: 0
    Темы форума: 806
    Категории
    Шаблоны Ucoz бесплатно [24]
    Тут найдете и скачаете Шаблоны Ucoz бесплатно
    Скрипты Ucoz бесплатно [23]
    Тут найдете и скачаете Скрипты Ucoz бесплатно
    Шапки для Ucoz [0]
    Тут найдете и скачаете Шапки Ucoz бесплатно
    Иконки для Ucoz [4]
    Тут найдете и скачаете Иконки Ucoz бесплатно
    Кнопки Ucoz бесплатно [2]
    Тут найдете и скачаете Кнопки Ucoz бесплатно
    Уроки Ucoz бесплатно [2]
    Тут найдете и скачаете Уроки Ucoz бесплатно
    Для Форумов Ucoz бесплатно [0]
    Тут найдете и скачаете Для Форумов Ucoz бесплатно
    Разное Ucoz бесплатно [34]
    Тут найдете и скачаете Разное Ucoz бесплатно
    Партнеры сайта
    Стать партнером Стать партнером Стать партнером Стать партнером
    Интересные файлы
    Шаблон Coo...
    Фоны для ф...
    Шрифт - Bo...
    Скрап набо...
    Фоны для ф...
    Стиль для ...
    Стили для ...