• Страница 1 из 1
  • 1
Форум Kentos311 » uCoz » Скрипты для сайта » СВЕТЛЫЙ И ПРИЯТНЫЙ ВИД МАТЕРИАЛОВ ДЛЯ UCOZ (Приятный и светлый вид материалов)
СВЕТЛЫЙ И ПРИЯТНЫЙ ВИД МАТЕРИАЛОВ ДЛЯ UCOZ
Kentos311Дата: Вторник, 09.01.2018, 13:27 | Сообщение # 1
Сообщений: 470
Статус:

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

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

Для установки вам нужно, скопировать ниже приведённый код и вставить в вид материалов нужного вам модуля.
Код
<div class="eBlock-vid">  
<h2 class="eTitle" style="text-align:left;"><a href="$ENTRY_URL$">$TITLE$</a></h2>  
<span class="post-details">Автор: <a href="$PROFILE_URL$">$USERNAME$</a> | Раздел: <a href="$CATEGORY_URL$">$CATEGORY_NAME$</a></span>  
<span class="post-dt"><i class="fa fa-clock-o" aria-hidden="true"></i> <span class="post-date">$DATE$</span>, $TIME$ </span>  
<div class="img-poster"><img src="$IMG_URL1$" alt="$TITLE$"></div>  
<?if($MESSAGE$)?><div class="eMessage" style="text-align: justify; max-height: 70px; overflow: hidden;">$MESSAGE$</div><?endif?>  
<div class="eDetails" style="clear:both;">  
<?if($COMMENTS_URL$)?><div class="com-vid"><a href="$COMMENTS_URL$"><i class="fa fa-comments-o" aria-hidden="true"></i> Комментарии ($COMMENTS_NUM$)</a></div><?endif?>  
</div></div>  
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">


Далее дополните свои стили сайта ниже приведёнными, добавьте их в самый низ стилей и сохраните.
Код
.eTitle {font-size: 19px; font-family: 'PT Sans'; margin-bottom: 15px; color: #FFFFFF; font-weight: 600; padding: 5px 5px 5px 10px; -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.30); box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.30); border-bottom: solid #ccc; background-color: #3F3F3F;}  
.eTitle a {text-decoration: none; color: #fff; font-weight: 600;}  
.eTitle a:hover {color:#E7E7E7;}  
.post-details, .post-dt {color: #94999e; font-size: 11px;padding-right: 25px; font-family: 'PT Sans';}  
.post-details a { color: #383e47; font-weight: 600; font-family: 'PT Sans';font-size: 12px;}  
.post-details a:hover { color: #1abc9c;}  
.eBlock-vid {font-family: 'PT Sans'; margin: 0 0 20px; padding: 10px; -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.30); box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.30); border-bottom: solid #ccc;}  
.com-vid {float:right; margin-top: -30px;}  
.com-vid a {color: #383e47; font-weight: 600;}  
.com-vid a:hover {color: #1abc9c;}  
.com-vid i {font-size: 21px;}  
.img-poster {float: left; margin-right: 10px;}  
.img-poster img {width: 250px; height: 150px;-webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.30); box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.30); border-bottom: solid #ccc;}


Установка завершена, если вы заметили, не чего сложного и невозможного мы с вами не делали.

В материале используются шрифтовые иконки Font Awesome, как их подключить на свой сайт можно узнать в этой статье которое находится на форуме!
Прикрепления: 5048312.png(130.0 Kb)
 
Форум Kentos311 » uCoz » Скрипты для сайта » СВЕТЛЫЙ И ПРИЯТНЫЙ ВИД МАТЕРИАЛОВ ДЛЯ UCOZ (Приятный и светлый вид материалов)
  • Страница 1 из 1
  • 1
Поиск: