Иконка новинки на скрин новости для сайтов ucoz

Отличный вид придает сайтам с тематикой Онлайн Фильмы, и им подобным тематикам где постер или скриншот обязателен для вывода информации о материале.
Красная прозрачная полоска с надписью новинка отлично информирует пользователя о состояние материала и его свежести. Подобный тип вывода новостей использовался на сайте нашем ucozon.ru с иконкой которая имела надпись NEW, не чем не отличается код и тут только что используется стиль для наложение необходимой PNG графики на постер.

Сама иконка вторым слоем выводится через DIV массив из таблицы стиле при помощи класса news_ucozon_pr
Копируем строчку и вставляем непосредственно перед свое картинкой, и следующие все изменения делаем уже в строчке стиля.
А именно в размерах отступа по оси координат учитывая X & Y так же с минусом и положительным размером.
Условия вложены для того что бы иконка выводилась только тогда когда материал свежий, то есть все материалы за сегодняшний день
будут выводится с красивой красной иконкой новинки.

Приступим к установке.
Вот само условие с классом:

Code

<div class="news_ucozon_pr"></div>

Заходим непосредственно в вид материалов и находим строчку HTML кода которая выводит скрин, не важно через какую форму, через какое поле, на важно что бы <div> массив стоял непосредственно перед самой картинкой как я вам указал на пример ниже

Code

<div class="news_ucozon_pr"></div>
<img src="$IMG_URL1$" width="150px" alt=" ">

Так а что бы наш класс работал, то мы заходим в таблицу стилей своего сайта ucoz и вставляем вот такую строчку такого стиля CSS в самый низ:

Code

.news_ucozon_pr {background-image:url("http://filmsd.ru/Templates/design/img/new_ucozon.png");background-repeat:no-repeat;height:77px;margin-left:79px;margin-top:6px;position:absolute;width:77px;}

Все готово, смотрим результат, только позаботитесь что бы новость была сегодняшние , а то начнется с комментария что не работает код и он не актуален для вашего сайта.
Все настройки за мостки графики только в стиле!Сайт автора при копирование материала обязателен: http://ucozon.ru
Автор: mdbnaer