Вид новостей или материалов, а в нашем случае torrent трекера игровой тематики с полным описанием материала в информационности о статусе и популярности его.Вид Торрент материала для игровой тематики на Ucoz.
Заметил на нашем форуме http://ucozon.ru/forum запрос на подобный вид новостей, с указанием на популярный трекер игр, я решил сделать небольшой рип чисто для сайтов Ucoz.
Вид материал располагается по умолчанию в несколько колонок в зависимости от ширины вашего сайта, и то сколько таких видов в эту ширину вместиться , но будет лучше если у вас сайт не резиновый и тогда вы сможете под ширину отрегулировать сам вид представления горизонтального столбика с скриншотом материала.
Установка:
Залезаем в панели управление в редактирование шаблона каталога файлов так как он у нас используется для торрент файлов, удаляем там старый код и заменяем его на ниже приведенный:
Code
<div class="thumb_el">
<font color="#000000" face="Arial"><b><span class="tooltiper"><div class="thumb_title">
<div class="child"> <div class="title_vid"><a href="$ENTRY_URL$" style="color: white;"><b>Тест вида материалов для ucozon</b></a></div>
</div></div>
<a style="border: 0px none ! important;" href="$ENTRY_URL$"></a>
<a href="$ENTRY_URL$" title="$TITLE$- UCOZON.RU"><img src="$SCREEN_URL$" style="border: medium none;" border="0" height="222" width="180"></a>
<br><ul class="game_info">
<li class="first-child"><span class="tooltiper"></span>Категория: <a title="Перейти к этой категории $CATEGORY_NAME$" href="$CATEGORY_URL$">$CATEGORY_NAME$</a></li>
<li><span class="tooltiper"><span class="tooltiper">Размер торрента : $FILE_SIZE$ $CATEGORY_NAME$</span></span></li><li> залил торрент $CATEGORY_NAME$: <br> <center><font color="red">$AUTHOR_NAME$</font></center><br></li>
<center><li><br><ul class="game_stats">
<li><div title="торрент Раздачу просмотрели $READS$ человек(а)" class="second">$READS$</div></li>
<li class="third"><a title="Перейти к торрент комментариям" class="third" href="$COMMENTS_URL$">$COMMENTS_NUM$</a></li>
</ul> </li> </center></ul></span></b></font></div>
В таблицу стилей вставляем сам стиль:
Code
.thumb_el{
width:180px;
margin:10px 10px 0px 10px;
float:left;
text-align:center;
margin-bottom:10px;
background: #FFF;
border: solid 1px #000;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}
.thumb_el a {
border-bottom: dotted 1px!important;
text-decoration:none!important;
}
.thumb_el a:hover{
border-bottom: dotted 1px!important;
text-decoration:none!important;
}
.thumb_title{
background-image:url('http://ucozon.ru/_dr/55/43008796.png');
padding:1px;
height:105px;
font-weight:bold;
-moz-border-radius: 4px 4px 0 0;
-webkit-border-radius: 4px 4px 0 0;
border-radius: 4px 4px 0 0;
}
.thumb_title a{
border: 0px!important;
}
.child {
display:-moz-inline-box;
display:inline-block;
vertical-align:middle;
zoom:1;
//display:inline;
width: 152px;
margin:0 auto;
}
ol, ul {
list-style: none;
}
ol li {
margin: 10px 0px 5px 5px;
list-style: decimal inside;
}
.title_vid {
font: 11px Tahoma, Arial, Verdana;
line-height: 16px;
color: #000000;
margin: 0 auto 0;
background-attachment: fixed;
color:white;
}
.game_info{
padding:3px 3px 3px 3px;
line-height: 130%;
text-align:left;
background-image:url('http://ucozon.ru/_dr/55/98900608.gif');
font-size: 11px;
-moz-border-radius: 0 0 4px 4px;
-webkit-border-radius: 0 0 4px 4px;
border-radius: 0 0 4px 4px;
}
.game_info li.first-child{
min-height:40px;
padding: 4px 4px 2px 2px;
background-image:url('http://ucozon.ru/_dr/55/43008796.png');
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
color: #fff;
}
.game_info li.first-child a{
border-bottom-color: #fff;
color: #fff;
}
.game_info li.first-child a:hover{
border-bottom-color: #CC0000;
color: #CC0000;
}
.game_stats li{
display: inline-block;
padding:0;
margin:0;
background:none;
vertical-align:middle;
}
.game_stats a.first{
color:#fff!important;
border: 0px!important;
text-align:center;
display: block;
width: 40px;
background: url(http://ucozon.ru/_dr/55/46663094.png) no-repeat 2px 5px;
margin: 0;
padding: 5px 0 5px 14px;
color: #000;
text-decoration: none;
}
.game_stats div.second{
text-align:center;
display: block;
width: 26px;
background: url(http://ucozon.ru/_dr/55/80559833.png) no-repeat 0 5px;
margin: 0;
padding: 5px 0 5px 17px;
color: #000;
text-decoration: none;
}
.game_stats a.third{
color:#fff!important;
border: 0px!important;
text-align:center;
display: block;
width: 40px;
background: url(http://ucozon.ru/_dr/55/34929388.png) no-repeat 2px 5px;
margin: 0;
padding: 5px 0 5px 15px;
color: #000;
text-decoration: none;
}
.game_stats li.first{
background: url(http://ucozon.ru/_dr/55/43008796.png);
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}
.game_stats li.third{
background: url(http://ucozon.ru/_dr/55/43008796.png);
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}
.game_stats a.first:hover{
text-decoration:underline!important;
border: 1px!important;
}
.game_stats a.third:hover{
text-decoration:underline!important;
border: 1px!important;
}
.thumb_el{
width:180px;
margin:10px 10px 0px 10px;
float:left;
text-align:center;
margin-bottom:10px;
background: #FFF;
border: solid 1px #000;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}
.thumb_el a {
border-bottom: dotted 1px!important;
text-decoration:none!important;
}
.thumb_el a:hover{
border-bottom: dotted 1px!important;
text-decoration:none!important;
}
.game_info li.first-child{
min-height:40px;
padding: 4px 4px 2px 2px;
background-image:url('http://ucozon.ru/_dr/55/43008796.png');
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
color: #fff;
}
.game_info li.first-child a{
border-bottom-color: #fff;
color: #fff;
}
.game_info li.first-child a:hover{
border-bottom-color: #CC0000;
color: #CC0000;
}