Как сделать фотогалерею в 3 колонки?

Аватар пользователя LikaZ LikaZ 27 марта в 13:26

Куда нужно вносить правки. В какой документ, по какому пути?
Через ftp документ нашелся, а в какой строке менять нужно , не понятно.
https://olimp-us.ru/fotogalereya

Комментарии

Аватар пользователя LikaZ LikaZ 27 марта в 16:55

Да, но в настройках в админке нету тех самых настроек, остается только через css. Интересует тот самый путь, где можно внести правки.

Аватар пользователя Selpi Selpi 27 марта в 17:05

Судя по структуре вывода, скорее всего создатель сайта не делал подобных настроек (такой функционал не оплачивался). На страницу просто выводится содержимое поля с фоточками. Соответственно сейчас добиться трех или любой другой колоночности можно через правку css: .field-name-field-fotogal-fotos .field-item

Аватар пользователя ivnish ivnish 27 марта в 17:09

Судя по всему фотки выводятся через это поле field-name-field-fotogal-fotos. Смотрите его

Аватар пользователя Selpi Selpi 27 марта в 17:17

Дополню: В админ меню друпала найдите тип материала "Фотогалерея" (fotogal), зайдите в настройки отображения и посмотрите что настроено для поля fotogal-fotos.
Структура-> Типы материала -> Фотогалерея -> Управление отображением.

Аватар пользователя LikaZ LikaZ 27 марта в 17:33

.field-name-field-fotogal-fotos .field-item
а где искать это поле то?

Вот какой хаос у меня выводит через ftp

Аватар пользователя LikaZ LikaZ 27 марта в 17:37

"...колоночности можно через правку css: .field-name-field-fotogal-fotos .field-item" это в управлении отображением в админке нет

Аватар пользователя P.Selfin@drupal.org P.Selfin@drupal.org 27 марта в 17:47

ищите примерно там /sites/all/themes/ваша_тема
Не вздумайте по указанному на картинке урлу менять, сломается
Здесь много https://www.drupal.org/docs/7/theming
Либо ищиту информацию по созданию тем оформления для вашей версии Drupal

Аватар пользователя Selpi Selpi 27 марта в 18:08

.field-item и .field-item img, если поменяете width например на 150px, заметите разницу.

Строчки 436 и 443

Аватар пользователя Selpi Selpi 27 марта в 18:00

Эти стили- их генерит движок из набора оригинальных css-ов темы.
Тема сайта расположена по адресу: /sites/all/themes/olimprk/
Вот в ней найдите css и отредактируйте, потом сбросьте кэш в админке и движок перегенерит стили.

Или второй вариант, если вы работаете напрямую на сайте- можно временно отключить сжатие css стилей в админке в разделе производительность, тогда вы сможете сразу видеть все изменения в стилях и в инспекторе браузера пути к тем файлам, где лежат конкретные стили (только все стили меняйте исключительно внутри файлов темы /sites/all/themes/olimprk/, даже если оригинальный стиль лежит в другом месте (модуле или ядре движка), все-равно меняйте нужное свойство только в рамках своей темы, иначе при обновлении движка/модулей, настройки слетят.).

Аватар пользователя LikaZ LikaZ 27 марта в 18:06

/sites/all/themes/olimprk/ эти 4 строчки в этом файле нашел он мне.
Какую из них строчку отредактировать надо я не понимаю.

Аватар пользователя LikaZ LikaZ 27 марта в 18:13

то есть если поменяю ширину на 150, то будут не квадратики а прямоугольники. 150x200?
а за что отвечают 430 и 448 строчки?

Аватар пользователя Selpi Selpi 27 марта в 18:14

Первая за обертку вокруг фоточек, вторая за эффект прозрачности при наведении на фотку.

Аватар пользователя Selpi Selpi 27 марта в 18:16

Да, будут прямоугольники. Соответственно нужно решить- или менять формат вывода картинки в настройках движка, или менять пропорции css стилями, например, заменив height для img на auto.

Аватар пользователя LikaZ LikaZ 27 марта в 18:24

а разве нельзя просто на пару пикселей увеличить контейнер в котором находятся столбики с фотками? (при этом не трогать сами форматы картинок) node node-fotogal contextual-links-region odd full-node clearfix
Это вы подразумеваете менять пропорции css стилями?

Потому что, как менять формат вывода картинки в настройках движка я подавно не знаю.

Аватар пользователя Selpi Selpi 27 марта в 18:28

Можно конечно. Пример был приведен просто чтобы появилось понимание как оно работает. А как вам лучше решить задачу уже решайте сами Smile

Аватар пользователя LikaZ LikaZ 27 марта в 18:40

LikaZ wrote: а разве нельзя просто на пару пикселей увеличить контейнер в котором находятся столбики с фотками?

Как вообще его увеличить? (этих контейнера 2)
Какой код вписывать туда? Scratch one-s head

Аватар пользователя Selpi Selpi 27 марта в 18:49

Фотки ни в каких столбиках не находятся. Фотки у вас завернуты в ссылки a и контейнер div .field-item
И вот эти field-item просто флоатом выравнены влево при ширине 200рх. Так как при такой ширине контейнера + марджинах влезает только 2 в ширину контейнера страницы, то и получается по 2 в ряд.

Если же нужен готовый рецепт: то я бы посоветовал стилю img сделать width: 100% и height: auto.
А контейнеру .field-item: width: 197px и такой-же height (или совсем его убрать). При ваших стандартных марджинах должно получиться 3 столбика.

Аватар пользователя Selpi Selpi 27 марта в 18:53

А если внимательнее посмотреть, то есть вариант еще проще: изменить марджин у .field-item на
margin: 0 0 23px 20px; и три фотки влезут в ряд.