Приветствую Вас, Гость
Меню сайта
Форма входа
Реклама



Block title
Календарь
«  Январь 2015  »
ПнВтСрЧтПтСбВс
   1234
567891011
12131415161718
19202122232425
262728293031

Архив записей
Друзья сайта
!---->
  • Создать сайт
  • Сайт о управлении качеством
  • заработок на рекламе для вебмастеров
  • УМК по информатике
  • Заработок на автосерфинге
  • Учебник по OpenOffice
    • Live Traffic Feed
    Статистика
    Онлайн всего: 1
    Гостей: 1
    Пользователей: 0

    Яндекс.Метрика
    Рейтинг@Mail.ru
    Главная » 2015 » Январь » 2 » Вид новостей для uCoz
    20:49
    Вид новостей для uCoz

    Вид новостей для uCoz

     

    В этом примере помимо основного изображение новости, будет присутствовать текст и для этого решение нам понадобиться следующий html код:

    HTML
    HTML
    Выделить всё
    <div class="cell_news opacity"> 
      <h2><a href="$ENTRY_URL$" >$TITLE$</a></h2> 
      <p class="news_message">$MESSAGE$</p> 
      <div class="news_bottom">  
       
      <div class="news_author"> 
      <?if($AVATAR_URL$)?><img alt="аватар $USERNAME$" src="$AVATAR_URL$"><?else?><imgalt="нет аватара" src="http://www.center-dm.ru/img/no_avatar.jpg"><?endif?> 
      <a href="$PROFILE_URL$">$USERNAME$</a> 
      </div> 
       
      <ul class="news_statistics"> 
      <li><span>$RATING$ ($RATED$)</span><img src="http://center-dm.ru/ucoz/vid_news/v2/ico_like.png" alt="рейтинг"></li> 
      <li><span>$READS$</span><img src="http://center-dm.ru/ucoz/vid_news/v2/ico_Eye.png" alt="просмотров"></li> 
      <li><span>$COMMENTS_NUM$</span><img src="http://center-dm.ru/ucoz/vid_news/v2/ico_comment.png" alt="комментарий"></li> 
      <?if($MODER_PANEL$)?><li>$MODER_PANEL$</li><?endif?> 

      </ul>  
      </div>  
      </div>

    И css стили:

    CSS-Code
    Выделить всё
    /* Вид новостей для uCoz v2 
    ------------------------------------------*/ 
    .cell_news { 
      float:left; 
      width:500px;  
      margin-bottom: 15px; 
      overflow:hidden;  
      background: #fff;  
      border: 3px solid #ACACAC;  
      font:11px Verdana,Arial,Helvetica, sans-serif; 
      text-shadow: 1px 1px 1px #fff;  
      color:#888;  
      border-radius:5px;  
    } 

    .cell_news h2 { 
      margin:0;  
      float:left; 
      width:460px;  
      background:#f4f4f4;  
      padding: 7px 20px;  
      font: 125% Verdana,Arial,Helvetica, sans-serif; 
      font-weight: 700;  
      border-bottom: 1px solid #d1d1d1; 
    } 

    .news_message { 
      float:left; 
      width:460px;  
      padding: 10px 20px;  
      font: 115% Verdana,Arial,Helvetica, sans-serif; text-align:justify;  
    } 

    .news_message img { 
      float:left; 
      padding: 5px;  
      background:#f4f4f4;  
      margin: 0px 15px 5px 0px;  
      border: 1px solid #d1d1d1;  
    } 

    .news_bottom {  
      float:left; 
      width:100%;  
      margin-top: -3px; 
      background:#f4f4f4;  
      border-top: 1px solid #d1d1d1;  
    } 

    .news_author{ 
      float:left; 
    } 

    .news_author img { 
      float:left; 
      width:20px; 
      height:20px; 
      margin: 5px 5px 0px 20px;  
    } 

    .news_author a { 
      float:left; 
      font-weight: 700;  
      margin: 8px 5px 0px 5px;  
    } 

    .news_statistics{ 
      float:right; 
      margin:0; 
      padding: 0;  
      margin-right: -2px;  
      list-style:none; 
      border-left: 1px solid #d1d1d1;  
    } 

    .news_statistics li { 
      float:left; 
      height:20px;  
      padding: 8px 8px 2px 8px;  
      border-right: 1px solid #d1d1d1; 
      border-left: 1px solid #fff;  
    } 

    .news_statistics span{ 
      float:left; 
      margin: 0px 5px 0px 0px;  
    } 

    .opacity a:hover img {filter: progid:DXImageTransform.Microsoft.Alpha(opacity=85); -moz-opacity: 0.7; opacity: 0.7;filter: alpha(opacity=85);} 

    На этом всё, спасибо за 

    Просмотров: 697 | Добавил: Wadim | Рейтинг: 0.0/0
    Всего комментариев: 0
    Войдите:
    avatar