Extra Block Types (EBT) - New Layout Builder experience❗

Extra Block Types (EBT) - styled, customizable block types: Slideshows, Tabs, Cards, Accordions and many others. Built-in settings for background, DOM Box, javascript plugins. Experience the future of layout building today.

Demo EBT modules Download EBT modules

❗Extra Paragraph Types (EPT) - New Paragraphs experience

Extra Paragraph Types (EPT) - analogical paragraph based set of modules.

Demo EPT modules Download EPT modules

Scroll

Фото галерея и вывод изображения в ноде.

Фото галерея и вывод изображения в ноде.
, by

Возникло два вопроса:

 1- подскажите какую лучше галерею поставить чтоб можно было просматривать в одной ноде множество галерей но при этом нажав на одну из них вы переходили в ноду галереи, по типу как создаётся товар в уберкарте.?

 2- при создании типа материала нового, нужно вывести несколько изображений, как сделать так как в уберкарте что есть одна средняя картинка и под ней маленький ??????? (поставил бы модуль уберкарта но он тут не уместен)

1 answer
votes: 597
Answer

1) Можно использовать модуль references, добавить одно relation-поле и добавлять изображения к главной ноде. Можно также использовать модуль:

http://drupal.org/project/bulk_media_upload (не забудьте включить прежде модуль media)

 

2) Это нужно делать вручную, можно в шаблоне поля, можно в шаблоне ноды. Сначала выводите большую картинку, потом маленькую. Можно сделать два views'а и вывести с помощью module_invoke() в шаблоне ноды.

Вставка блока в любой шаблон (drupal insert block into template)


спасибо за подсказку! если вам не тяжело, подробнее о первом варианте описать решение можно?


Нужно создать два типа метериала, в одном из них создать поле Изображение. Это изображение в настройках модуля bulk upload можно выбрать как поле через которое ноды создавать. Там в принципе все довольно просто, примерно также настраивается как fields collection.


добрый день!

ещё один вопросик возник, решил реализовать галерею Views Galleriffic. реализация вывода отдельно галереи вышла http://lgisf.com/content/libraries-and-dens в аналог всё вышло, очень пронравилось, но увидел на сайте вот такую реализацию http://lgisf.com/gallery как он вывел через view так? ломаю голову не выходит , я так понял он вывел общий список галереи тоже через модуль Galleriffic, но не выходит так как у него, может Вы смодете помочь?


такую галерею можно вывести через views slideshow, здесь можно почитать подробно:

http://habrahabr.ru/post/136377/


этот вариант более годится для баннерной рекламы, хотя можно применять где угодно. я думал об этом варианте но мне именно нужно так как тут http://lgisf.com/gallery реализовано представление общей галереи,  views slideshow не подходит.

тот пример что я показал человек реализовал как раз через Views Galleriffic при этом использовал сетку в настройках, вот бы дальше увидеть какие настройки он выставлял


Общую галерею можно вывести на странице таксономии.

 


да именно, так и сделал, просто не вьеду как он смог сделать это через модуль Views Galleriffic,  так оно всё выходи, но вот так как у него не выходит чтоб так же красиво с полупрозрачностью


Полупрозрачность по наведению делается через  jquery:

$('#block-id img').mouseenter(function(){
  $(this).stop();
  $(this).animate({opacity: 0.5}, 1000);
});

$('#block-id img').mouseleave(function(){
  $(this).stop();
  $(this).animate({opacity: 1}, 1000);
});

Если не работает, то можно попробовать убрать строки с $(this).stop();


тут нужно вывести как общий список галереи по одной фотке в формате сетки 3х3х3, вывожу через вьювс (Стиль: Сетка, Стиль строки: Поля, тип: страница) обычным способом, как присобачить к данной странице данный код который ты описал?


если можно более подробно расписать как это дело подключить, очень прошу. если что можно в скайпе или icq списаться!!!!!


https://www.google.ru/#hl=ru&newwindow=1&output=search&sclient=psy-ab&q=change+opacity+in+jquery+on+hover&oq=change+opacity+in+jquery+on+hover

Вот по такому запросу можете больше информации подчерпнуть.

 

http://stackoverflow.com/questions/2127458/animate-opacity-on-hover-jquery

http://www.dotnetcurry.com/ShowArticle.aspx?ID=438

http://www.devcurry.com/2009/06/changing-image-opacity-on-mouseover.html

 

Там все очень просто, по наведению используем animate(), чтобы сделать прозрачность, по снятию наведения mouseleave() убераем прозрачность.

 


спасибо за помощь, ссылки помогли, ща сижу экспериментирую с изображениями . :) пример кода с которым вышло реализовать затухание img при наведении курсора.

<script type="text/javascript">
    $(document).ready(function() {
        $('#block id img').each(function() {
            $(this).hover(function() {
                $(this).stop().animate({ opacity: 0.5 }, 300);
            },
           function() {
               $(this).stop().animate({ opacity: 1 }, 300);
           });
        });
    });
 
</script>