Galeria slimbox
Wydanie slimbox 1.1 PL
- Szczegóły
- Utworzono: sobota, 03, kwiecień 2010 16:38
- Odsłony: 1509
{slimbox off}
{slimbox_1_2 off}
- Zmiana skladni wywołania.
- Zmiana stylu wyświetlania poszczególnych obrazków galerii.
Poprzednia składnia wywołania (1.0 PL):
{slimbox images/zdjecie1_duze.jpg, images/zdjecie1_male.jpg, opcjonalny komentarz nr 1; images/zdjecie2_duze.jpg, images/zdjecie2_male.jpg, opcjonalny komentarz nr 2; images/zdjecie3_duze.jpg, images/zdjecie3_male.jpg, opcjonalny komentarz nr 3; images/zdjecie4_duze.jpg, images/zdjecie4_male.jpg, opcjonalny komentarz nr 4; images/zdjecie5_duze.jpg, images/zdjecie5_male.jpg, opcjonalny komentarz nr 5}
Jak widać wywołanie kolejnych obrazków to wywołanie sekcji oddzielonych średnikami, z wyjątkiem ostatniej:
sekcja_obrazek1; sekcja_obrazek2; sekcja_obrazek3; sekcja_obrazek4; sekcja_obrazek5
Gdzie każda z sekcji to zbiór do trzech elementów oddzielonych od siebie przecinkami:
sciezka/dostepu/do/zdjecie_duze.jpg, sciezka/dostepu/do/zdjecie_male.jpg, opcjonalny komentarz
Nowa składnia wywołania (1.1 PL):
Od teraz dozwolone jest umieszczanie ścieżek do plików w pełnym rozmiarze jak i plików miniatur w osobnych wierszach. Sekcje obejmujące kolejne obrazki mogą być od siebie oddzielone pustym wierszem.
{slimbox
images/ścieżka/do/obrazka/zdjecie1_duze.jpg,
images/ścieżka/do/obrazka/zdjecie1_male.jpg,
opcjonalny komentarz 1;
images/ścieżka/do/obrazka/zdjecie2_duze.jpg,
images/ścieżka/do/obrazka/zdjecie2_male.jpg,
opcjonalny komentarz 2;
images/ścieżka/do/obrazka/zdjecie3_duze.jpg,
images/ścieżka/do/obrazka/zdjecie3_male.jpg,
opcjonalny komentarz 3;
images/ścieżka/do/obrazka/zdjecie4_duze.jpg,
images/ścieżka/do/obrazka/zdjecie4_male.jpg,
opcjonalny komentarz 4;
images/ścieżka/do/obrazka/zdjecie5_duze.jpg,
images/ścieżka/do/obrazka/zdjecie5_male.jpg,
opcjonalny komentarz 5;
}
Działanie nowej składni zostało sprawdzone z edytorami:
a) JCE (wer. 1.5.1),
b) TinyMCE (wer. 2.0), dla ustawień wstawiajacych w miejscu znaków nowej linii znacznik P jak i BR.
Uwagi:
- Komentarze nie są obowiązkowe, więc w ogólności sekcje mogą składać się tylko z dwóch elementów: dużego obrazka i miniatury.
- Elementy sekcji muszą być oddzielane przecinkami, a sekcje średnikami; jedynym wyjątkiem jest ostatnia sekcja, która nie może kończyć się średnikiem.
- Przecinek (,) oraz średnik (;) będę nazywał znakami specjalnymi ze względu na to, że modyfikują sposób działania dodatku.
- Należy pamiętać, by w tekście komentarza nie użyć znaków specjalnych, ponieważ ich użycie zaburzy działanie dodatku.
- Nic nie stoi na przeszkodzie, by wywołanie składało się tylko z jednej sekcji.
- Ścieżka dostępu do obrazków zaczyna się od słowa 'images' bez poprzedzającego znaku '/'.
Poprzedni styl wyświetlania poszczególnych obrazków galerii:
Kolejne miniatury bezpośrednio ze sobą sąsiadowały wykorzystując od lewej dostępną przestrzeń na stronie (Fot. 01 oraz Fot. 02). Nie ma między nimi żadnej przerwy. Uwaga! Ramki wokół zdjęć to nie jest cecha slimboxa. Dodałem ją samodzielnie na etapie przygotowywania zmniejszonych wersji obrazków.

Fot. 01. Miniatury
Fot. 02. Komentarz widoczny po najechaniu kursorem nad miniaturę
Nowy styl wyświetlania poszczególnych obrazków galerii:
Pomiędzy kolejnymi miniaturami składającymi się na galerię pojawiła się przerwa. Dzięki temu miniatury wyglądają lepiej, szczególnie w przypadku większych galerii.

Fot. 03. Nowy wygląd miniatur
Pomiędzy kolejnymi miniaturami składającymi się na galerię wyświetlana jest wolna przestrzeń o rozmiarze 10 punktów. Uwaga! Ramki wokół zdjęć to nie jest cecha slimboxa. Dodałem ją samodzielnie na etapie przygotowywania zmniejszonych wersji obrazków.

Fot. 04. Komentarz do miniatur
Jeżeli do jakiegoś obrazka został napisany komentarz, to podobnie jak dla wersji 1.0 po najechaniu kursorem na taki obrazek po krótkiej chwili wyświetli się komentarz.
Slimbox nie pozwala na dowolne umieszczenie obrazków miniatur. Po prostu stara się wpasować obrazki w dostępną przestrzeń. Sporo zależy od szablonu (plików CSS), które zarządzają danym fragmentem powierzchni strony. Może się zdarzyć, że w jednym wierszu zmieszczą się koło siebie 3 obrazki, a w kolejnym tylko 2. Warto zadbać o to, by w pojedynczej galerii były wyświetlane obrazki o orientacji poziomej, a w osobnej te o orientacji pionowej.
Nie potrafię programować w PHP czy zmieniać CSS (jeszcze nie!). O pomoc poprosiłem znajomych. Zmian w kodzie 'slimbox.php' dokonał Damian, któremu gorąco dziękuję za anielską cierpliwość i upór. Zmian w szablonie 'slimobx.css' dokonał sam Kali, któremu również gorąco dziękuję za pomoc.
Reszta pozostała w zasadzie bez zmian:
- Spolszczona instrukcja.
- Spolszczone obrazki nakładane przez dodatek na aktualnie wyświetlane zdjęcia.
Spolszczona instrukcja:
Sposób użycia
{slimbox
images/img_1.jpg,
images/timg_1.jpg,
Rzeczy, które lubię;
images/img_2.jpg,
images/timg_2.jpg,
Czemu mi się to przytrafia?;
images/img_e.jpg,images/timg_3.jpg,
Kiedy to się skończy?;
images/img_r.jpg,
images/timg_4.jpg
}
- By skorzystać ze slimbox po prostu skopiuj powyższy przykład do swojego artykułu w Joomla!.
- W jednym artykule możesz mieć kilka galerii {slimbox
x1,
x2,
x3
}.
- Możesz też wykorzystać slimbox do wyświetlenia tylko jednego obrazku.
- Do wyświetlenia jednego obrazka potrzebne jest podanie do trzech argumentów oddzielonych od siebie znakiem przecinka: "," -- są to: obrazek w pełnym rozmiarze - x1, miniaturka obrazka - x2 oraz opis -x3.
- Musisz podać pierwsze dwa argumenty - x1, x2; jeżeli nie masz przygotowanej miniaturki, jako drugi argument po prostu powtórz nazwę obrazka w pełnym rozmiarze.
- Ścieżki dostępu do obrazków domyślnie zawierają ścieżkę dostępu strony z pominięciem początkowego ukośnika ("/") i nie powinny zawierać cudzysłowów (prawidłowo: images/amy.jpg -- nieprawidłowo: "/images/amy.jpg")
- Tekst z opisem - x3 wprowadź po przecinku; nie powinien zawierać cudzysłowów, przecinków i średników.
- Jeżeli nie chcesz jakiemuś obrazkowi nadawać opisu, lub jeżeli nie chcesz nadawać opisu wszystkim obrazkom, po prostu pomiń trzeci argument - x3.
- Ciągi opisujące kolejne obrazki galerii muszą być od siebie oddzielone średnikami: ";"
- Na stronie możesz wyświetlić wszystkie miniaturki, albo tylko pierwszą. Jeżeli chcesz pokazać tylko pierwszą, dodaj słowo "single" pisane małymi literami, bezpośrednio po "{slimbox".
Baw się dobrze z Joomla!
Spolszczone obrazki nakładane przez dodatek na aktualnie wyświetlane zdjęcia:
|
|
|
Podkreślone litery mają dodatkowe funkcje. Po naciśnięciu litery 'P' przejdziemy do następnego zdjęcia w galerii, a po naciśnięciu litery 'N' przejdziemy do poprzedniego zdjęcia w galerii. Dodatkowo do paczki instalacyjnej dodatku dołączyłem powyższe obrazki zapisane w otwartym (!) formacie .xcf (GIMP) z zastosowaniem warstw. Dzięki temu w razie doraźnej potrzeby można samodzielnie wyedytować te pliki i nadać im własny wygląd, np. zmieniając kolorystykę. W razie braku takich pragnień dodatkowe pliki można po prostu skasować.
Niestety pełne spolszczenie wymagało wpisanie niektórych polskich słów bezpośrednio w kodzie.
Jeżeli w wywołaniu slimboxa umieściliśmy jakieś komentarze, to będą one widoczne po najechaniu kursorem nad obrazek miniatury i odczekaniu około jednej sekundy.

Fot. 03. Powiększone zdjęcie
Po kliknięciu na wybraną miniaturę zadziała znany i lubiany efekt Lightbox 2. Strona zostanie przysłonięta szarym półprzezroczystym tłem, a na pierwszym planie zostanie wyświetlony nasz obrazek. na czerwono zaznaczyłem wybrane elementy grafiki. Po najechaniu kursorem na prawą część obrazka wyświetli się napis 'NAST.' sugerujący, że po kliknięciu galeria wyświetli kolejny obrazek. Oznaczyłem też przykładowy komentarz.

Fot. 04. Powiększony obrazek
Na czerwono zaznaczyłem: na dole po lewej napis podający kolejność aktualnie wyświetlanego obrazku w galerii, na dole po prawej przycisk powodujący zamknięcie galerii, u góry po lewej obrazek 'POPRZ.' sugerujący, że po kliknięciu przejdziemy do poprzedniego obrazka w galerii.
Licencja skryptu js: MIT.
Licencja skryptu php: GNU GPL wer. 2.
Do pobrania: Slimbox Image Gallery Plugin for Joomla! v 1.1 PL
Sposób aktualizacji:
Należy odinstalować dodatek slimbox w wersji 1.0 PL, a w jego miejsce zainstalować dodatek w wersji 1.1 PL. Po zainstalowaniu nowego dodatku należy go włączyć. Ponieważ wywołania obu dodatków są ze sobą zgodne (kompatybilne), więc te same galerie, które zostały przygotowa dla dodatku 1.0 PL będą poprawnie działały w wersji 1.1 PL. Widoczna zmiana będzie dotyczyła wyglądu miniatur.




