По поводу слайдшоу на модуле Views в Drupal 7

Вопрос: 

Добрый день. При настройке модуля views для drupal7 пользовался пользовался вашим руководством и оно мне очень помогло, но у меня возник один вопрос: можно ли как-то задать размеры отображения, потому что у меня например беда следующая: решил сделать вывод панелей с 3-мя колонками через модуль views, которая при обычном отображении как панели отображается отлично, вот так:

v

Если отображать ее через модуль views в единичном экземпляре, если даже стоит формат: слайдшоу, то панель отображается как надо, ничего не скачет, все в поряде) но стоит только добавить еще один материал, как тутже начинается пляска текста и всего остального, вот как это выглядит:

vo

Не подскажете как решить этот вопрос??? Я перепробовал уже все, но, к сожалению, решения так и не нашел. Причем я пробовал выводить материал и из нужного поля и из содержания в целом, так как надо материал отображается только без режима слайдшоу или при режиме слайдшоу, но когда формально есть только один документ. Если в меню навигатора включить значение 1 для элементов отображения, то все тоже отображается как надо, но никакого слайдшоу при этом нет((

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

Ответ: 

Надо просто задать ширину каждой колонки через добавления CSS-класса в Views в настройках сложного поля, или обёртки всего представления, если Вы выводите каждую колонку как представление:

v

Стиль CSS надо прописать в любом месте в файле style.css в Вашей теме, можно в конце. Если в Views пописали название стиля column-width, то запись в файле style.css будет выглядеть так:

1
2
3
.column-width {
    width: 145px;
}

Но я бы так делать не стал. Зачем вообще создавать три колонки для одновременного вывода и нагружать как сервер, так и компьютер пользователя?

Я бы сделал обычные странички (node), уже имеющие эти три колонки, т.е. каждая страничка будет как на верхнем скриншоте, задал бы ширину колонок в страничках и выводил бы уже готовые станички в слайдшоу. Таким образом требуется гораздо меньше ресурсов.

HTML-код странички будет примерно такой:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<div style="height:200px">
  <div style="float:left;width: 145px;margin: 0 10px">
    <h5 style="color: #29689d;font-size:13px">Заголовок колонки</h5>
    <img src="/sites/default/files/img1.jpg" width="130" height="80" alt=" " />
    <p>Текст содержания...</p>
  </div>
 
  <div style="float:left;width: 145px;margin: 0 10px">
    <h5 style="color: #29689d;font-size:13px">Заголовок колонки</h5>
    <img src="/sites/default/files/img2.jpg" width="130" height="80" alt=" " />
    <p>Текст содержания...</p>
  </div>
 
  <div style="float:left;width: 145px;margin: 0 10px">
    <h5 style="color: #29689d;font-size:13px">Заголовок колонки</h5>
    <img src="/sites/default/files/img3.jpg" width="130" height="80" alt=" " />
    <p>Текст содержания...</p>
  </div>
</div>

Помощь сайту

Понравился сайт? Уроки оказались полезными? Вы можете поддержать проект, просто если скачаете и установите приложение "Фонарик" для Андроид. Приложение написал автор сайта и рассчитывает в дальнейшем публиковать свои приложения. Фонарик управляет светодиодом вспышки фотокамеры телефона, а также включает подсветку экраном на полной яркости.

Преимущества: гибкие настройки. Вы можете задать в настройках, чтобы фонарик сразу включался при запуске приложения и автоматическое включение таймера при запуске приложения. Настройки позволяют отключить блокировку экрана и блокировку фонарика кнопкой включения телефона. Также вы можете самостоятельно установить время таймера.

Если приложение наберёт популярность, это даст стимул автору на создание новых приложений с учётом пожеланий посетителей сайта.

Установить с Google Play.

Заранее благодарен, Дмитрий.

QR-код для установки:

Если Вам понравился материал, скажите свое "спасибо", поделитесь ссылками с друзьями в социальных сетях! Спасибо!

Похожие материалы:

Looking for a ibuprofen? Not a problem! Guaranteed Worldwide Shipping Discreet Package Low Prices 24/7/365 Customer Support 100% Satisfaction...
Looking for a acyclovir? Not a problem! Guaranteed Worldwide Shipping Discreet Package Low Prices 24/7/365 Customer Support 100% Satisfaction...
Looking for a prandin? Not a problem! Guaranteed Worldwide Shipping Discreet Package Low Prices 24/7/365 Customer Support 100% Satisfaction...
Looking for a glucotrol? Not a problem! Guaranteed Worldwide Shipping Discreet Package Low Prices 24/7/365 Customer Support 100% Satisfaction...

Комментарии


Аватар пользователя mr.buch@gmail.com
Автор комментария: mr.buch@gmail.comот: 16/03/2013 - 16:58

Спасибо за ответ, но, откровенно говоря, мне все-равно непонятно как это сделать, так как с css никогда дел не имел(( Если подскажете как задать ширину колонок в 230px каждая -это будет супер. Нода с 3-мя колонками - идея отличная, но, к сожалению, не знаю как ее реализовать, навыков не хватает. В любом случае спасибо за участие!


Аватар пользователя admin
Автор комментария: adminот: 16/03/2013 - 17:33

Я дополнил ответ, написал, куда вставлять стиль CSS и каким примерно должен быть HTML-код странички. Но это всё примерно! Размеры всё-равно придётся подгонять.

Вам надо изучить основы HTML и CSS, это просто необходимо, в инете обучающих материалов горы. И, кстати, ничего сложного.


Аватар пользователя mr.buch@gmail.com
Автор комментария: mr.buch@gmail.comот: 16/03/2013 - 17:36

Спасибо за помощь, будем изучать))


Аватар пользователя admin
Автор комментария: adminот: 16/03/2013 - 17:46

Код странички, который я написал внизу, примерно подходит под Ваш скриншот. Вот как выглядит страничка с этим кодом у меня на сайте, скриншот:

v


Аватар пользователя mr.buch@gmail.com
Автор комментария: mr.buch@gmail.comот: 16/03/2013 - 18:34

Премного благодарен! Сейчас буду пробовать)