MEGAsoft-Все для uCoz
Пусто
25.06.2025
 
| Главная | Форум | Поиск | Фотоальбом | FAQ | Ваша ссылка | Регистрация | Вход | Выход |
MEGAsoft-Все для uCoz MEGAsoft-Все для uCoz
[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Информер популярных новостей для uCoz
Nk_CheCДата: Четверг, 21.03.2013, 05:42 | Сообщение # 1



Сообщений: 27
[ 1 ]
ICQ:610471162

Offline


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

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

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

в Админ панель => Инструменты => Информеры => Создать информер

Раздел: Новости сайта
Тип данных: Материалы
Способ сортировки: Количество просмотров А
Количество материалов: 10
Количество колонок: 1

удаляем в нём старый html код и устанавливаем новый:

Код
<li><strong>$NUMBER$</strong><a href="$ENTRY_URL$" title="$CATEGORY_URL$"  
target="_blank">$TITLE$</a></li>

А на страницу сайта в нужное место устанавливаем сам информер:


Код
Код
<ul class="top_news">    
    $MYINF_1$    
     </ul>

Не забывайте, что $MYINF_1$ является номером вашего информера и его стоит прописывать именно системной переменной, а не отдельной ссылкой на js.

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

Теперь когда наш информер новостей готов, стоит прописать следующие css стили:

Код
/* Информер популярных новостей для uCoz №5    
    ------------------------------------------*/    
  .top_news{    
     float:left;    
     padding:0;    
     width:230px;    
     margin: 10px 15px 10px 15px;     
  }    

  .top_news li {    
     list-style:none;     
     margin-bottom: 0px;    
     padding: 8px 0px 8px 0px;     
     border-bottom: 1px solid #CAD3DA;     
  }    

  .top_news li a:link,    
  .top_news li a:visited {color:#555;}    
  .top_news li a:hover {color:#2C68A6;;}    

  .top_news li strong {    
     float:left;    
     color:#fff;    
     text-shadow: 1px 1px 1px #777;    
     margin: 0px 10px 5px 0px;     
     padding:2px 5px;     
     background: #CBCBCB;     
     border-radius:3px;     
  }

Примечание:

Если ваши заголовки новостей являются слишком длинными и они портят внешний
дизайн данного информера, а вы хотите чтобы заголовок выглядел красивым и
аккуратным, к примеру в одну строку, то следует использовать следующий
html код:

Код
Код
<li><strong>$NUMBER$</strong><a href="$ENTRY_URL$" title="$CATEGORY_URL$"  
target="_blank"><?if(len($TITLE$)>28)?><?substr($TITLE$,0,26)?>...<?else?>$TITLE$<?endif?></a></li>
  • Страница 1 из 1
  • 1
Поиск:
Реклама
 
MEGAsoft-Все для uCoz
 
Все материалы размещенные на сайте пренадлежат их владельцам и предоставляются исключительно в ознакомительных целях.
Администрация ответственности за содержание материала не несет и убытки не возмещает.
По истечении 24 часов материал должен быть удален с вашего компьютера.
Незаконная реализация карается законами РФ и Украины: "Об авторском и смежном праве".
При копировании материала, ссылка на сайт обязательна!