Установка:
в css вставляем вот этот код
Светлый вариант
Code
.mat-table {border: 1px solid #6FF9F6; vertical-align: top; letter-spacing: 0px; word-spacing: 0px;}
.mat-table1 {border: 1px solid #6FF9F6; vertical-align: top;}
#materiali ul{padding:0;}
#Menu-material .navi li{list-style:none;height:19px;width:20px;}
#Menu-material span{position:absolute;overflow:hidden;width:0;left:19px;padding:0;font:12px Verdana,Arial,Helvetica,sans-serif;line-height:19px;white-space:nowrap;-webkit-transition: 0.25s;-moz-transition: 0.25s;transition: 0.25s;}
#Menu-material li{display:block;position:relative;background:url(http://www.nabran.ru/images/white/menu-material.gif) no-repeat;height:19px;width:20px;}
#Menu-material li:hover span{float:left;overflow:hidden;text-align:left;width:300px;padding:0px 0px;}
#Menu-material li:hover{text-decoration:none;}
#Menu-material .ratingg{background-position:0 0px;}
#Menu-material .ratingg:hover {background-position:-19 0px;}
#Menu-material .add-date{background-position:0 -18px;}
#Menu-material .add-date:hover {background-position:-19 -18px;}
#Menu-material .comments{background-position:0 -36px;}
#Menu-material .comments:hover {background-position:-19 -36px;}
#Menu-material .view{background-position:0 -54px;}
#Menu-material .view:hover{ background-position:-19 -54px;}
#Menu-material .add-user{background-position:0 -72px;}
#Menu-material .add-user:hover {background-position:-19 -72px;}
#Menu-material .category {background-position:0 -90px;}
#Menu-material .category:hover {background-position:-19 -90px;}
#Menu-material .add-date span,
#Menu-material .comments span,
#Menu-material .view span,
#Menu-material .add-user span,
#Menu-material .category span,
#Menu-material .ratingg span {background:#6FF9F6;color:#000;}
Темный вариант
Code
.mat-table {border: 1px solid gray; vertical-align: top; letter-spacing: 0px; word-spacing: 0px;}
.mat-table1 {border: 1px solid gray; vertical-align: top;}
#materiali ul{padding:0;}
#Menu-material .navi li{list-style:none;height:19px;width:20px;}
#Menu-material span{position:absolute;overflow:hidden;width:0;left:19px;padding:0;font:12px Verdana,Arial,Helvetica,sans-serif;line-height:19px;white-space:nowrap;-webkit-transition: 0.25s;-moz-transition: 0.25s;transition: 0.25s;}
#Menu-material li{display:block;position:relative;background:url(http://www.nabran.ru/images/black/menu-material.gif) no-repeat;height:19px;width:20px;}
#Menu-material li:hover span{float:left;overflow:hidden;text-align:left;width:300px;padding:0px 0px;}
#Menu-material li:hover{text-decoration:none;}
#Menu-material .ratingg{background-position:0 0px;}
#Menu-material .ratingg:hover {background-position:-19 0px;}
#Menu-material .add-date{background-position:0 -18px;}
#Menu-material .add-date:hover {background-position:-19 -18px;}
#Menu-material .comments{background-position:0 -36px;}
#Menu-material .comments:hover {background-position:-19 -36px;}
#Menu-material .view{background-position:0 -54px;}
#Menu-material .view:hover{ background-position:-19 -54px;}
#Menu-material .add-user{background-position:0 -72px;}
#Menu-material .add-user:hover {background-position:-19 -72px;}
#Menu-material .category {background-position:0 -90px;}
#Menu-material .category:hover {background-position:-19 -90px;}
#Menu-material .add-date span,
#Menu-material .comments span,
#Menu-material .view span,
#Menu-material .add-user span,
#Menu-material .category span,
#Menu-material .ratingg span {background:#9D9D9D;color:#E8B827;}
А это в вид материалов модуля объявления.
Code
<table style="width: 580px; border-collapse: collapse;"><tbody>
<tr>
<td class="mat-table">
<img alt="$CATEGORY_NAME$" src="http://s17.ucoz.net/.s/img/icon/bd.png">
</td>
<td class="mat-table" colspan="2">
<h1><a target="blank" title="$TITLE$" href="$ENTRY_URL$"><?if(len($TITLE$)>59)?><?substr($TITLE$,0,60)?>...<?else?>$TITLE$<?endif?></a><?if($MODER_PANEL$)?><div style="float:right">$MODER_PANEL$</div><?endif?></h1>
</td>
</tr>
<tr>
<td class="mat-table" width="20" rowspan="2">
<ul id="Menu-material">
<li class="ratingg"><span>Статистика: (Голосов $RATED$, Рейтинг $RATING_NUM$) </span></li>
<li class="add-date"><span title="Дата добавления материала $DATE$ $TIME$">Дата добавления:$DATE$ $TIME$</span></li>
<?if($COMMENTS_URL$)?><li class="comments"><span>Комментарии:<a title="Комментарии ($COMMENTS_NUM$)" href="$COMMENTS_URL$">$COMMENTS_NUM$</a></span></li><?endif?>
<li class="view"><span>Просмотров:$READS$</span></li>
<?if($USERNAME$)?><li class="add-user"><span>Добавил:<a title="Автор материала $USERNAME$" href="$PROFILE_URL$">$USERNAME$</a></span></li><?endif?>
<?if($CATEGORY_NAME$)?><li class="category"><span>Категория:<a title="Категория $CATEGORY_NAME$" href="$CATEGORY_URL$">$CATEGORY_NAME$</a></span></li><?endif?>
</ul>
</td>
<td class="mat-table" height="60" width="80" rowspan="2">
<?if($IMG_URL1$)?>
<img title="$TITLE$" alt="$TITLE$" src="$IMG_URL1$" height="60" width="80">
<?else?>
<img title="$TITLE$" alt="$TITLE$" src="/Iconki/not_screen.png" height="60" width="80">
<?endif?><br>
<?if($RATING$)?><div style="float:left"><?$RSTARS$('12','/.s/img/stars/3/12.png','1','float')?></div><?endif?>
</td>
<td class="mat-table1" rowspan="2">
<div title="$TITLE$" class="eMessage"><?if($MESSAGE$)?>
<?substr($MESSAGE$,0,300)?> <a target="blank" title="$TITLE$" href="$ENTRY_URL$">Читать далее...</a>
<?endif?></div>
</td>
</tr>
<tr>
</tr>
</tbody>
</table><br>
А это в вид материалов модуля новости.
Code
<table style="width: 580px; border-collapse: collapse;"><tbody>
<tr>
<td class="mat-table">
<img alt="$CATEGORY_NAME$" src="http://s17.ucoz.net/.s/img/icon/nw.png">
</td>
<td class="mat-table" colspan="2">
<h1><a target="blank" title="$TITLE$" href="$ENTRY_URL$"><?if(len($TITLE$)>59)?><?substr($TITLE$,0,60)?>...<?else?>$TITLE$<?endif?></a><?if($MODER_PANEL$)?><div style="float:right">$MODER_PANEL$</div><?endif?></h1>
</td>
</tr>
<tr>
<td class="mat-table" width="20" rowspan="2">
<ul id="Menu-material">
<li class="ratingg"><span>Статистика: (Голосов $RATED$, Рейтинг $RATING_NUM$) </span></li>
<li class="add-date"><span title="Дата добавления материала $DATE$ $TIME$">Дата добавления:$DATE$ $TIME$</span></li>
<?if($COMMENTS_URL$)?><li class="comments"><span>Комментарии:<a title="Комментарии ($COMMENTS_NUM$)" href="$COMMENTS_URL$">$COMMENTS_NUM$</a></span></li><?endif?>
<li class="view"><span>Просмотров:$READS$</span></li>
<?if($USERNAME$)?><li class="add-user"><span>Добавил:<a title="Автор материала $USERNAME$" href="$PROFILE_URL$">$USERNAME$</a></span></li><?endif?>
<?if($CATEGORY_NAME$)?><li class="category"><span>Категория:<a title="Категория $CATEGORY_NAME$" href="$CATEGORY_URL$">$CATEGORY_NAME$</a></span></li><?endif?>
</ul>
</td>
<td class="mat-table" height="60" width="80" rowspan="2">
<?if($IMG_URL1$)?>
<img title="$TITLE$" alt="$TITLE$" src="$IMG_URL1$" height="60" width="80">
<?else?>
<img title="$TITLE$" alt="$TITLE$" src="/Iconki/not_screen.png" height="60" width="80">
<?endif?><br>
<?if($RATING$)?><div style="float:left"><?$RSTARS$('12','/.s/img/stars/3/12.png','1','float')?></div><?endif?>
</td>
<td class="mat-table1" rowspan="2">
<div title="$TITLE$" class="eMessage"><?if($MESSAGE$)?>
<?substr($MESSAGE$,0,300)?> <a target="blank" title="$TITLE$" href="$ENTRY_URL$">Читать далее...</a>
<?endif?></div>
</td>
</tr>
<tr>
</tr>
</tbody>
</table><br>
Осталось только адаптировать под себя, вот и все.
Думаю Вы сами сможете внедрить подобный вид материалов для остальных модулей.