» » >

Создаём информер цитат на uCoz v1
·
28.09.2013, 21:49

Всем привет, так уж сложилось, что многие читатели и обычные гости моего блога, часто задают мне вопрос, касающийся ячейки цитат, которая была установлена в прошлой версии дизайна блога.

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

Шаг 1 - Создадим txt файл:

Для отображения цитат для uCoz, нам потребуется создать у себя на компьютере, к примеру в папке Мои документы, обычный текстовый файл, в который следует скопировать следующий html код:

HTML

<img alt="Джастин Менкес" title="Автор цитаты Джастин Менкес" src="img/Justin_Menkes.jpg"></a> Разгадывая секрет успеха управленцев, стоит смотреть не на решение, а на способ, который позволил к нему прийти. <span>Джастин Менкес</span> <br>
  <img alt="Даг Девос" title="Автор цитаты Даг Девос" src="img/Doug_DeVos.jpg"></a> Интернет не меняет бизнес-модели, он способен лишь дать новые мощные инструменты уже существующим. <span>Даг Девос</span> <br>
  <img alt="Алан Лафли" title="Автор цитаты Алан Лафли" src="img/Alan_George_Lafley.jpg"></a>Пишите простейшие инструкции, как для трехлетних детей. <span>Алан Лафли</span> <br>

Обратите внимание, для того чтобы при каждом обновлении страницы сайта, в вашем браузере отображалась новая цитата из данного текстового документа, в конце каждой строки, следует прописать тег <br>

Шаг 2 - Создаём информер

Для создание информера цитата заходим в Админ панель => Инструменты => Информеры => Создать информер => Случайные данные

С параметрами:
Количество материалов: 1
Количество колонок равны: 1

И с кодировкой текста Unicode (UTF-8)

Там же вы можете увидеть [ Помощь по работе данной функции ], где расписан пример работы данного информера, в основном вам следует знать три правила:

- Все переводы на новую строку заменяйте тегом "<br>".
- Размер файла не должен превышать 2мб.
- В файле не должно быть пустых строк!

Шаг 3 - Установим HTML:

Теперь когда информер цитат готов, его следует установить на страницу сайта в нужное место:

HTML

<div class="cell_quote">$MYINF_1$ </div>
Шаг 4 - Установим CSS:

И в завершении работы с информером цитат, пропишем следующие css стили:

CSS-Code

/* Информер цитат
------------------------------------------*/
.cell_quote {
  float:left;  
  width:220px;
  position:relative;
  background:#fff;
  margin: 15px 0px;  
  padding: 10px 15px 20px 15px;  
  border: 1px solid #CAD3DA;  
  font: 115%/1.5 Verdana,Arial,Helvetica, sans-serif; color:#555;  
}

.cell_quote img {
  float:right;  
  width:60px;
  height: 60px;
  margin: 0px 0px 0px 15px;  
}

.cell_quote span{
  position:absolute;
  bottom: 5px;
  right: 15px;  
  margin: 0px 0px 0px 0px;  
  font: 10px Verdana,Arial,Helvetica, sans-serif; color:#999;
}

Обратите внимание, что в данном примере css стилях, я использовал абсолютное позиционирование, для ячейки с именем автора цитаты, вы можете изменить положение данной ячейки, изменив параметры bottom: 5px; и right: 15px; для тега span.

На этом всё, спасибо за внимание!

Категория: Вид информеров | Добавил: tashkent97
Просмотров: 915 | Загрузок: 287 | Источник: center-dm.ru | Рейтинг: 5.0/1
Всего комментариев: 0
dth="100%" cellspacing="1" cellpadding="2" class="commTable">
Имя *: Email:
Яндекс.Метрика Яндекс цитирования<