Вид новостей для кино сайтов на uCoz


Вид новостей для кино сайтов на uCoz

4671
10 из 10
Проголосовало: 4






Шаг 1 - Установим HTML:
Для начала как и полагается установим html каркас, для этого заходим в Админ панель => Дизайн => Управление дизайном => Новости сайта =>Вид материалов, удаляем старый код и устанавливаем новый:

HTML
Код

<div class="cell-news">  
  <div class="cell-news-l">  
  <?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 class="cell-news-rating left">  
  <div class="left"><?if($RATING$)?><?$RSTARS$('16','http://webo4ka.ru/Ucoz7/rating_star_01.png','1','float')?><?endif?></div>  
  <div class="cell-news-rating-os right">$RATING$</div>  
  </div>  
  </div>  
  <div class="cell-news-r">  
  <h2><a href="$ENTRY_URL$">$TITLE$</a></h2>  
  <div class="cell-news-top">  
  <span title="Вторник в $TIME$" class="west left">$DATE$</span>  
  <span class="right">  
  <img src="http://webo4ka.ru/Ucoz7/fon_img_glaz.png" alt="просмотров" /> $READS$ |  
  <img src="http://webo4ka.ru/Ucoz7/fon_img_coment.png" alt="комментарии" /> $COMMENTS_NUM$  
  <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="right" href="$ENTRY_URL$" >Читать дальше</a>  
  </div>  
   
  </div>  
  </div>


Обратите внимание, что в данном html коде я прописал системную переменную uCoz, отвечающею за отображение картинки в новостях, которую вы заливаете через форму Изображения, на странице добавление и редактирование контента.

HTML
Код

<?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?>

Из-за чего в кратком описание должна отсутствовать ссылка на картинку или системная переменная uCoz, отвечающая за вывод изображение (IMAGE1)

Шаг 2 - Установим CSS:

Теперь давайте пропишем основные css стили:

CSS-Code
Код

/* Вид новостей для кино сайтов на uCoz  
  ------------------------------------------*/  
.cell-news {  
  float:left;  
  width:570px;  
  margin-bottom: 15px;  
  background: #fff;  
  border-radius:3px;  
  padding: 15px 15px 15px 15px;  
  border: 1px solid #D6D6D6  
}  

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

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

.cell-news-l-img {  
  width:180px;  
  height:240px;  
  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:100%;  
  padding-bottom: 10px;  
  border-bottom: 1px solid #D6D6D6;  
  font: 125% Verdana,Arial,Helvetica, sans-serif;  
  font-weight: 700;  
}  

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

.cell-news-center{  
  float:left;  
  width:100%;  
  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:100%;  
  font-weight: bold;  
  padding: 10px 0px 0px 0px;  
}  

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


А что делать, если вам понравился данный вид новостей для uCoz, но в кратком описании материала у вас прописана или установлена системная переменная на отображение картинки, всё просто, мы запретим в данной ячейки с текстом контента её отображать, благодаря css свойству htmlbook.ru/css/display
Автор публикации: Загрузка
Загрузка
KZ, это его n материал
Источник: http://www.center-dm.ru/
  • Всего комментариев: 16

Сотник
0
Сотник написал: Написано 07 Декабря 2014 в 12:29
Комментарий №16
Вовчик Спасибо! Вот теперь всё работает! biggrin

Сотник
0
Сотник написал: Написано 06 Декабря 2014 в 16:02
Комментарий №9
И снова не то!


Вовчик
0
Вовчик написал: Написано 06 Декабря 2014 в 17:57
Комментарий №10
Все то

Сотник
0
Сотник написал: Написано 06 Декабря 2014 в 19:20
Комментарий №11
Так,а почему у меня тогда,так выходит?

Вовчик
0
Вовчик написал: Написано 06 Декабря 2014 в 19:30
Комментарий №12
не знаю, я не экстрасенс, но по скрину видно, что css у тебя не подключен...

Сотник
0
Сотник написал: Написано 06 Декабря 2014 в 19:50
Комментарий №13
Вовчик,есть описание как подключить?

Вовчик
0
Вовчик написал: Написано 06 Декабря 2014 в 23:41
Комментарий №14
Шаг 2 - Установим CSS:

Теперь давайте пропишем основные css стили:

CSS-Code

У тебя этот пункт не выполнен, вставь css

Сотник
0
Сотник написал: Написано 07 Декабря 2014 в 01:17
Комментарий №15
Я брал этот код с пункта 2, свой там старый удалял весь и вставлял этот в CSS: Или не правильно?

Сотник
0
Сотник написал: Написано 05 Декабря 2014 в 12:42
Комментарий №5
Попробывал коды поставил и вот что из этого получилось!


Вовчик
0
Вовчик написал: Написано 06 Декабря 2014 в 09:01
Комментарий №6
пере установи, css код вставлял?

Сотник
0
Сотник написал: Написано 06 Декабря 2014 в 15:47
Комментарий №7
Я уже не помню! Сегодня ещё попробую!

Сотник
-1
Сотник написал: Написано 06 Декабря 2014 в 15:48
Комментарий №8
Я всё делел,как написано!

CEPbI
0
CEPbI написал: Написано 02 Января 2014 в 04:55
Комментарий №4
чет я не могу картинку вставить чтоб она была в нужном поле... помогите

steamen
0
steamen написал: Написано 27 Декабря 2013 в 21:35
Комментарий №3
А что делать если я изображение вставлял через визуальный редактор?

V@dim
0
V@dim написал: Написано 29 Июня 2013 в 14:16
Комментарий №1
Не совсем так как на картинки конечно но сойдет тоже

Handyman
0
Handyman написал: Написано 29 Июня 2013 в 16:00
Комментарий №2
Все там правильно...

  • Оставить комментарий:
Добавлять комментарии могут только зарегистрированные пользователи.
Регистрация | Вход
Меню сайта
Категории
Для помощи создания сайта uCoz 25
Скрипты и модификации для Ucoz 2113
Шаблоны форумов Ucoz 28
Шаблоны сайтов Ucoz 431
Авторство Webo4ki 309
php скрипты для ucoz 57
Графика для uCoz 40
Мини-чат
Последние комментарии
Ох. Вижу, что обсуждение очень старое. Но!
На других CMS так же будет все это реализовано. На нормальных CMS.
Такое решение может подойти лишь для landing сайтов. Но и то, не думаю, что там кто то заморачивается в написании какого либо контроллера генерирования шаблона и используют прямо в лоб чистый HTML, поэтому и будут для каждой страницы свои блоки делать.

Поэтому лучше тут все же дописать решение именно для ucoz без загрузки этих лишних блоков на странице. Ведь используя условные операторы этот код даже не будет прогружаться на странице. (Лол. Это ж доли секунд загрузки...) И что? Но давайте делать оптимальнее
Моё авторство:)
  • 1488 написал:
  • 1488 написал:
  • Смысл исходный код? он возвращает после обновление страницы на то положение которое было... или как?
  • 1488 написал:
  • как поставить галки как скрине?
    а то невозможно поставить...
  • Handyman написал:
  • Не появляется код безопасности для обычных пользователей
    Последние темы
    Опрос
    432
    А
    Р
    Оцените новый дизай:)
    Статистика
    Анализ интернет сайта
    0
    онлайн
    0
    наших
    0
    чужих
    Онлайн всего: 1
    Гостей: 1
    Пользователей: 0
    0
    Сегодня были
    Топ пользователей: