- преглашай друзей

Вот наткнулся на один скрипт, который смотрится очень просто и пришлось скрипту Вид материала для сайта кино онлайн системы uCoz, немного нарастить мускул, а точнее добавить дизайна. Что первое встретил, его нужно самому подгонять по размеру под ваш ресурс, он автоматически не стает. Но это всего лишь сделать или сменить 3 размера в стилях, что потом ниже укажу. Сделал ему кнопку, чтоб переходить на основной плеер а также рамку красивую вокруг самой картинки и уже вид совершенно другой.

Была добавлена информация и переместил с другого места, чтоб как то смотрелось лучше. Рейтинг оставлен, который шел по умолчанию, только вот сам каркас немного стал ярче по своему оттенку. Там есть рубрика, которую хотел убрать, но это вам решать нужна она будет или нет. Также хочется добавить, что под игры отличное решение будет и безусловно можно и на эту тему поставить.

Что касается подгонки по размеру, то в начале стилей стоит width:768px - это вы делаете шире основу. Дальше вам останется сделать правей или левей кнопку и функций, все это делается в CSS ниже.

Ставим там где хотите видеть и на каком модуле вид материала:

Код

<div class="cell-news">
<div class="cell-news-l">
<div id="ugolkrug"><?if($IMG_SMALL_URL1$)?><img src="$IMG_SMALL_URL1$" class="cell-news-l-img" alt="$TITLE$"><?else><?if($IMG_URL1$)?><img src="$IMG_URL1$" class="cell-news-l-img" alt="$TITLE$"><?endif?><?endif?></div>
<p> <div class="cell-news-rating left">
<div class="left"><?if($RATING$)?><?$RSTARS$('16','http://zornet.ru/SKRIPT/dsar/trend/rating_star_01.png','1','float')?><?endif?></div>
<div class="cell-news-rating-os right">$RATING$</div>
</div></p>
</div>
<div class="cell-news-r">
<h2><a href="$ENTRY_URL$">$TITLE$</a></h2>
<div class="cell-news-top">
<span class="right">
<b>Дата</b> <img src="http://zornet.ru/SKRIPT/dsar/trend/YeHP9TI.png" alt="дата" /> <b>$DATE$</b> |
<b>Просмотров</b> <img src="http://zornet.ru/SKRIPT/dsar/trend/fon_img_glaz.png" alt="просмотров" /> <b>$READS$</b> |
<b>Комментарии</b> <img src="http://zornet.ru/SKRIPT/dsar/trend/fon_img_coment.png" alt="комментарии" /> <b>$COMMENTS_NUM$</b>
<span><?if($MODER_PANEL$)?>$MODER_PANEL$<?endif?></span>
</span>
</div>
<p class="cell-news-center"><?if($MESSAGE$)?>$MESSAGE$<?endif?></p>
<div class="cell-news-bottom">
<span class="left"><?if($CATEGORY_NAME$)?>Рубрика: <a href="$CATEGORY_URL$">$CATEGORY_NAME$</a><?endif?></span>
<a class="button24" title="Подробнее о $TITLE$" href="$ENTRY_URL$" style="float: right;"><span>Подробнее</span></a>
</div>
</div>
</div>

В любое место CSS можно в самый низ, конфликтовать не будет.

Код

/* Вид новостей zornet.ru сайтов на uCoz
------------------------------------------*/
.cell-news {
float:left;
width:768px;
margin-bottom: 15px;
background: #fff;
border-radius:3px;
padding: 15px 15px 15px 15px;
border: 1px solid #34B6DB
}

.cell-news-l {
float:left;
width:180px;
margin-right: 15px;
}

.cell-news-r {
float:left;
width:375px;
}

.cell-news-l-img {
width:180px;
height:230px;
margin-bottom: 5px;
border-radius:3px;
}

.cell-news-rating {
width:100%;
}

.cell-news-rating img{
margin-top: 2px;
}

.cell-news-rating-os{
margin-left: 10px;
background: #8EC98C;
padding: 3px 10px 3px 10px;
text-shadow: 1px 1px 1px #469943;
font-weight: bold;
color:#fff;
border-radius:3px;
}

.cell-news-r h2 {
margin:0;
float:left;
width:153%;
padding-bottom: 10px;
border-bottom: 1px solid #D6D6D6;
font: 125% Verdana,Arial,Helvetica, sans-serif;
font-weight: 700;
}

.cell-news-top{
float:left;
width:153%;
padding: 5px 0px;
border-bottom: 1px solid #D6D6D6;
font:9px Verdana,Arial,Helvetica, sans-serif;
color:#999;
}

.cell-news-center{
float:left;
width:153%;
margin:0;
min-height: 163px;
padding: 10px 0px;
border-bottom: 1px solid #D6D6D6;
font:11px 1.5 Verdana,Arial,Helvetica, sans-serif;
text-align:justify;
}

.cell-news-bottom{
float:left;
width:150%;
font-weight: bold;
padding: 10px 0px 0px 0px;
}

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