Drupal Media Gallery Colorbox kép linkjének megváltoztatása

A Colorbox talán a legsokoldalúbb lightbox modul Drupal alá, de vita nélkül a kedvencem. Egyszerűségében rejlik ereje, és nem próbál több lenni mint amire hivatott. Az olyan album megoldásokkal pedig mint például a Media Gallery, akár nagyon komplex de könnyen kezelhető kép és videó gyűjteményeket hozhatunk létre.

A lightbox egy olyan tartalommegjelenítési módszer aminek megtekintésekor nem hagyjuk el az adott oldalt, hanem egy overlay (egy új felső megjelenítési réteg) segítségével nézzük meg azt. Ilyennel találkozhatunk például közösségi oldalakon képek böngészése közben. Hasonlót érhetünk el a mi Media Gallery-nkben is

Drupalban számos modult találhatunk ennek a megvalósítására, tehát nyugodtan böngésszünk, hogy megtaláljuk a számunkra legmegfelelőbbet.

A probléma

Alapértelmezetten a Colorbox miután megjeleníti a képet egy hivatkozás készül el, így a felhasználók a képre való kattintáskor a kép feltöltésének egyéni oldalára jutnak. Gyakran előfordul azaz eset, hogy mi ezt nem szeretnénk. Például albumba/slideshowba vannak összekapcsolva a képeink és a cél inkább az lenne, hogy a következő képre jussanak, vagy egyáltalán ne is legyen hivatkozás.

A hivatkozás megszüntetése

A következő megoldás elég csúnya, tehát nem javaslom senkinek, mert ugyebár nem szabad a modulok kódjában nyúlkálni. De azért megosztom hátha valakinek pont erre van szüksége.

Keressük meg a modulkönyvtárban a media_gallery.theme.inc fájlt.

Cseréljük le a következő sort

$link_vars['no_link'] = $element['#bundle'] == 'video' ? TRUE : FALSE;

erre

$link_vars['no_link'] = $element['#bundle'] == 'video' ? TRUE : FALSE;
$link_vars['no_link'] = TRUE;

Tehát nem töröltünk ki semmit, csak az utóbbi sorral felülbíráltuk az előző kifejezést. A sor kitörlése problémákat szülne, tehát ne tegyük. Ez az opció a videókhoz készült eredetileg, de így működik képekre is.

Következő képre ugrás

Ebben az esetben a lightboxban megjelenő képre kattintva a célunk az, hogy a következő képet töltse be a Colorbox. Ezt egy kis Javascript-el fogjuk elérni.

Első lépésként hozzuk létre a JS fájlt az aktuális témánk “js” könyvtárában media_gallery_ link.js néven.

Másoljuk bele az alábbi kódot és mentsük el a fájlt.

(function ($) {

Drupal.behaviors.initColorboxDefaultStyle = {
  attach: function (context, settings) {
    $(document).bind('cbox_complete', function () {
  	  $('.lightbox-stack .gallery-thumb-inner a').click(function(e) {
        e.preventDefault();
        $.colorbox.next();
      });
    });
  }
};

})(jQuery);

Miután elmentettük nyissuk meg a témánk .info fájlját és adjuk hozzá a scriptünket.

scripts[] = js/media_gallery_link.js

Ezek után már tesztelhetjük is, hogy mindent jól csináltunk-e. Ha nem működik azonnal, akkor frissítsd az oldalad és töröld a gyorsítótárak tartalmát.