21 odpowiedzi w tym temacie

[tomekkula]

Witam,
W jaki sposób dołączyć lightbox'a lub coś podobnego do typolight?
Chciałbym żeby w artykułach miniatury fotek powiększały się w stylu lightboxa oraz żaby miniatury w galerii powiększały się w ten sam sposób i żeby "losowe zdjęcie" było miniaturą która się powiększy w ten sam sposób.
Czy jest na to jakiś sposób?
Dziękuje z góry.

[Kamil]

Tak na szybko proponuję Szablony stron > [edytuj] > sekcja Ustawienia zaawansowane > Mootools JavaScript > moo_default, a w edycji artykułu obrazki wstawiasz tak (edycja pola width/height pozwoli ci uzyskać miniaturkę):



W galerii obrazków zaznacz opcję Powiększenie obrazka (nie zadziała jeśli nie wykonasz tego co napisałem wyżej).

Co do miniaturek to wydaje mi się, że będziesz musiał nieco edytować plik szablonu (wejdź w Szablony > Nowy szablon > mod_random_image.tpl > Utwórz szablon), tak żeby tag posiadał atrybut rel="lightbox".

[tomekkula]

Kamil dzięki wielkie, niespodziewałem sie że dodanie lightboxa będzie tak łatwe.
Jeżeli chodzi o losowe zdjęcie to w ogóle niemam linku do dużego zdjęcia. Po prostu wyświetla mi zdjęcie o rozmiarach jakie podałem i nie wiem jak to zrobić żeby wyświetlało mi po kliknięcu duże foto.

Pozdrawiam

[Kamil]

Hmm, linię 10 w pliku mod_random_image.tpl, która odpowiada za wyświetlenia obrazka możesz zastąpić tym kodem:

<a href="<?php echo $this->src; ?>" rel="lightbox"><img src="<?php echo $this->src; ?>"<?php echo $this->imgSize; ?> alt="<?php echo $this->alt; ?>" /></a>

Czyli cały plik wygląda mniej więcej tak:

<!-- indexer::stop -->
<div class="<?php echo $this->class; ?> block"<?php echo $this->cssID; ?><?php if ($this->style): ?> style="<?php echo $this->style; ?>"<?php endif; ?>>
<?php if ($this->headline): ?>

<<?php echo $this->hl; ?>><?php echo $this->headline; ?></<?php echo $this->hl; ?>>
<?php endif; ?>

<div class="image_container"<?php if ($this->margin): ?> style="<?php echo $this->margin; ?>"<?php endif; ?>>
<a href="<?php echo $this->src; ?>" rel="lightbox"><img src="<?php echo $this->src; ?>"<?php echo $this->imgSize; ?> alt="<?php echo $this->alt; ?>" /></a>
<?php if ($this->caption): ?>
<div class="caption"><?php echo $this->caption; ?></div>
<?php endif; ?>
</div>

</div>
<!-- indexer::continue -->

Problem w tym, że jeśli w panelu administratora określisz, że ten moduł ma przekierowywać na stronę, to po kliknięciu w ten obrazek nie zostaniesz przeniesony, a jedynie obrazek się powiększy.
Zagmatwałem trochę, ale mam nadzieję, że wiesz o co mi chodzi

[tomekkula]

Oki dzięki
Tylko po kliknięciu nie powiększa mi fotki, tylko w lightboxie wyświetla miniaturę.
Próbowałem usunąć imgSize; ?> ale nie pomogło.

Sorry za może głupie pytania, ale po prostu nie znam jeszcze php.

[Kamil]

Nie ma głupich pytań, są tylko głupie odpowiedzi!

Faktycznie, podałem zły kod. Zaraz coś spróbuję wykombinować i dam ci znać.

[Kamil]

Okej, tu masz poprawiony kod:

<!-- indexer::stop -->
<div class="<?php echo $this->class; ?> block"<?php echo $this->cssID; ?><?php if ($this->style): ?> style="<?php echo $this->style; ?>"<?php endif; ?>>
<?php if ($this->headline): ?>

<<?php echo $this->hl; ?>><?php echo $this->headline; ?></<?php echo $this->hl; ?>>
<?php endif; ?>

<div class="image_container"<?php if ($this->margin): ?> style="<?php echo $this->margin; ?>"<?php endif; ?>>
<a href="<?php echo $this->href; ?>" rel="lightbox"><img src="<?php echo $this->src; ?>"<?php echo $this->imgSize; ?> alt="<?php echo $this->alt; ?>" /></a>
<?php if ($this->caption): ?>
<div class="caption"><?php echo $this->caption; ?></div>
<?php endif; ?>
</div>

</div>
<!-- indexer::continue -->

[tomekkula]

Nadal jest to samo.
Wkleiłeś chyba jeszcze raz ten sam kod?

[Kamil]

Masz rację, ale ze mnie gapa Już poprawiłem.

[tomekkula]

Super, dzięki Kamil!
Chyba muszę się nauczyć php...

[motorola]

zrobilem dokładnie tak jak napisaliście powyżej.
niestety po kliknięciu na zdjęcie, otwiera sie w zwykłym oknie - nie w lightboxie.

w headerze, mootools jest ładowany:

<script type="text/javascript" src="plugins/mootools/mootools.js"></script>

znacznik posiada atrybut rel="lightbox", wiec nie wiem co moze byc tego przyczyna.
url do strony: http://www.ajf.edu.p...anna_Lizis.html

co moze byc przyczyna?

[Kamil]

Spróbuj na końcu (przed ) swojego szablonu fe_ dodać linijkę

<?php echo $this->mootools; ?>

[motorola]

dodalem, ale nic nie wrzuca w kod strony

tego mootools'a mam na stale wpisanego w templatce:



a czy TL nie powinien jakos go tam sam wrzucac?

- chyba juz wiem o co chodzi.
Nic nie jest doskonale. Np. zeby zaladowac Google Analytics Id, musialem dodac wpis w Additional tags, bo po dodaniu tego id do pola "Here you can enter a Google Analytics Id." po prostu nie dodawal do zrodla strony. Podejrzewam ze i z tym mootoolsem jest podobnie.

Ale kiedy dodalem sciezke do mootoolsa na sztywno, powinien zadzialac, nieprawdaz?

[Kamil]

Nie ma prawa działać, bo nie masz w źródle strony kodu, który inicjuje mediabox:

<script type="text/javascript">
<!--//--><![CDATA[//><!--
Mediabox.scanPage = function() {
  var links = $$("a").filter(function(el) {
    return el.rel && el.rel.test(/^lightbox/i);
  });
  $$(links).mediabox({/* Put custom options here */}, null, function(el) {
    var rel0 = this.rel.replace(/[[]|]/gi," ");
    var relsize = rel0.split(" ");
    return (this == el) || ((this.rel.length > 8) && el.rel.match(relsize[1]));
  });
};
window.addEvent("domready", Mediabox.scanPage);
//--><!]]>
</script>

[motorola]

okay, wrzucilem w additional tags.
jest w zrodle strony ten skrypt, ale nadal dostaje w konsoli bledow:

Błąd: Mediabox is not defined
Plik źródłowy: http://www.ajf.edu.p...Szablewska.html
Wiersz: 45

[Kamil]

Zaznacz w szablonie strony

i powinno być git.

[motorola]

ajajaj,

Paaanie, u mnie to troszke inaczej wyglada:



mam wersje 2.7.2 ;/

kurde, chyba bede musial zrobic upgrade wkoncu. Jak uwazasz? - kolizyjny moze byc ten upgrade? w sensie, jak mam juz prawe cala strone zrobiona...

[Kamil]

Zrób sobie backup i jak coś nie pójdzie to zawsze możesz go odtworzyć. A nowsza wersja jest zdecydowanie lepsza od poprzednich

[Grzesiu]

Myślę, że twój problem tkwi i złym umieszczeniu linijki wywołującą MooTools w Twoim szablonie strony fe_

<?php echo $this->mootools; ?>

umieść tę linijkę tuż przez DIV'em zamykającym cały content strony (ostatni DIV przed BODY)
czyli:

<?php echo $this->mootools; ?>
</div>
</body>

Pzdr. 8)

[motorola]

<script type="text/javascript" src="plugins/mediabox/js/mediabox.js"></script>

<script type="text/javascript">
<!--//--><![CDATA[//><!--
Mediabox.scanPage = function() {
  var links = $$("a").filter(function(el) {
    return el.rel && el.rel.test(/^lightbox/i);
  });
  $$(links).mediabox({/* Put custom options here */}, null, function(el) {
    var rel0 = this.rel.replace(/[[]|]/gi," ");
    var relsize = rel0.split(" ");
    return (this == el) || ((this.rel.length > 8) && el.rel.match(relsize[1]));
  });
};
window.addEvent("domready", Mediabox.scanPage);
//--><!]]>
</script>

<script type="text/javascript">
<!--//--><![CDATA[//><!--
window.addEvent('domready', function() {
  new Accordion($$('div.toggler'), $$('div.accordion'), {
    alwaysHide]]>
</script>

<script type="text/javascript" src="plugins/slimbox/js/slimbox.js"></script>
<script type="text/javascript">
<!--//--><![CDATA[//><!--
Slimbox.scanPage = function() {
  $$(document.links).filter(function(el) {
    return el.rel && el.rel.test(/^lightbox/i);
  }).slimbox({}, null, function(el) {
    return (this == el) || ((this.rel.length > 8) && (this.rel == el.rel));
  });
};
window.addEvent("domready", Slimbox.scanPage);
//--><!]]>
</script>
</body>

nie no, to juz jest w kodzie strony. zmodyfikowalem szablon dawno. Zreszta to widac...

konsola bledo pluje bledami:
Błąd: window.addEvent is not a function
Plik źródłowy: http://www.ajf.edu.p.../js/mediabox.js
Wiersz: 2
Błąd: Mediabox is undefined
Plik źródłowy: http://www.ajf.edu.p...Szablewska.html
Wiersz: 153

itd, wiec cos jest nie tak jeszcze