Бесплатный раздел

    Уважаемые друзья и пользователи сайта ART-UCOZ!

    Уведомляем вас о том, что мы приняли трудное, но обдуманное решение о закрытии проекта в качестве Интернет-магазина ART-UCOZ. С 05.11.2022 года сайт ART-UCOZ.RU продолжит работать в качестве каталога файлов, статей и информации. Будет закрыт только раздел интернет-магазина!

    Все товары были перенесены в наш новый проект SHOPTHEMES - Vendor Marketplace (https://shopthemes.ru), над которым мы долго работали и продолжаем улучшать его в настоящее время.
    Вас ждут: личный кабинет, возможность пополнения баланса на любую сумму, зачисление бонусов за посещение, перевод средств между пользователями, вывод средств (для продавцов), личный чат, больше новых цифровых товаров и многое другое.

    Уважаемые пользователи!
    Доводим до вашего сведения, что мы не занимаемся обучениями по системе uCoz и настройками Ваших сайтов.
    Подобные просьбы и вопросы - будут игнорироваться!

    Новый вид информера популярных новостей v2

    Дата добавления: 02.11.2013 - 13:53
    Категория: Информеры
    Добавил: newil
    Количество просмотров: 2.6k
    Количество комментариев: 0
    Размер файла: 144.0 Kb
    Рейтинг материала: 0.0 / 0
    Новый вид информера популярных новостей v2
    рейтинг 0.0
    /
    голосов 0
    Шаг 1 - Установим HTML:
    Для начала на следует создать информер популярных новостей, для этого идём в Админ панель => инструменты => Информеры

    и создаём информер со следующими параметрами:

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

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

    HTML


    Код
    <div class="news_top$NUMBER$">  
    <a href="$ENTRY_URL$" title="$TITLE$">  
    <img src="$IMG_SMALL_URL1$"><img src="$IMG_URL1$">  
    <span>  
    28)?>...$TITLE$  
    </span>  
    </a>  
    </div>


    -обратите внимание, что классу news_top я прописал системную переменную uCoz, которая будет отображать номер материала, тем самым мы сможем изменить седьмой вид изображение по всей ширине основной ячейки div

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

    Теперь создадим основной контейнер div и поместим в него выше созданный информер:

    JS


    Код
    <div id="content_new_news"> $MYINF_1$</div>


    Шаг 2 - Установим CSS:
    Наш с вами информер популярных новостей готов, пропишем ему основные css стили:

    CSS-Code


    Код
    /* Новый вид информера популярных новостей  
    ------------------------------------------*/  
    #content_new_news {  
      width:240px;  
      overflow:hidden;  
      padding: 10px 0px 10px 0px;  
    }  

    #content_new_news a:link,  
    #content_new_news a:visited {color:#bababa;}  
    #content_new_news a:hover {color:#60a62c;}  

    #content_new_news div {  
      float:left;  
      width:110px;  
      height:90px;  
      overflow:hidden;  
      position:relative;  
      margin: 5px 5px 5px 5px;  
    }  

    #content_new_news span {  
      float:left;  
      width:100%;  
      left: 0px;  
      bottom: 0px;  
      position:absolute;  
      background: url(http://art-ucoz.ru/files/informs/4/pix_title.png) repeat;  
      padding: 2px 5px 2px 5px;  
      font: 9px Verdana,Arial,Helvetica, sans-serif;  
    }  

    .news_top7 {  
      float:left;  
      text-align:center;  
      width:230px!important;  
      height:85px!important;  
    }


    Источник: http://www.center-dm.ru
    Добавлять комментарии могут только зарегистрированные пользователи.


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