Galeria slimbox

Wydanie slimbox 1.2 PL

Ocena użytkowników:  / 0
SłabyŚwietny 
{slimbox off}

{slimbox_1_2 off}

Na wstępie zachęcam do lektury artykułu opisującego funkcje galerii slimbox.

 

Wersja 1.2 PL przyniosła kilka istotnych zmian:
  1. Zmiana skladni wywołania.
  2. Na potrzeby dodatku powsłało logo.

 

Poprzednia 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;

}

 


Nowa składnia wywołania (wer. 1.2 PL):

 

{slimbox_1_2

images/ścieżka/do/obrazka/w/pełnym/rozmiarze/obrazek1|

images/ścieżka/do/miniatury/miniatura1|

opcjonalny komentarz 1, który już może zawierać znaki znaki ; oraz ,||

 

images/ścieżka/do/obrazka/w/pełnym/rozmiarze/obrazek2|

images/ścieżka/do/miniatury/miniatura2| opcjonalny komentarz 2||

 

images/ścieżka/do/obrazka/w/pełnym/rozmiarze/obrazek3|

images/ścieżka/do/miniatury/miniatura3| opcjonalny komentarz

}

 

W wersji 1.1 nie było możliwe wpisywanie w treści komentarza znaków przecinka (,) lub średnika (;), ponieważ były to 'znaki specjalne', czyli znaki o specjalnym znaczeniu, wykorzystywane do interpretowania argumentów dodatku. Pierwszy z nich (,) służył do oddzielania kolejnych elementów sekcji, czyli dużego obrazka, miniatury obrazka oraz opcjonalnego komentarza. Drugi z nich (;) służył do oddzielania całych sekcji. Jeżeli ktoś użył tych znaków w tekście komentarza, to kod interpretujący wywołanie dodatku się gubił i najczęściej nie wyświetlał kolejnych sekcji. By uniknąć tego typu zdarzeń w wersji 1.2 zastąpiono znak , znakiem |, natomiast znak ; znakiem ||.

 

W wywołaniu słowo 'slimbox' zostało dla odróżnienia zastąpione słowem 'slimbox_1_2'.

 

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 znakiem |, a sekcje znakami ||; jedynym wyjątkiem jest ostatnia sekcja, która nie może kończyć się znakiem ||.
  • Łańcuchy znaków: | oraz || będę nazywał 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ć łańcuchó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 '/'.

Logo dodatku:

slimbox_logo_zm

 

Reszta pozostała bez zmian:

 

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.

slimbox_1_1_miniatury

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.

 

slimbox_1_1_napis

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.

 

Spolszczona instrukcja:

Slimbox jest klonem Lightboxa JS v2.0 napisanego przez Lokesh Dhakar, stworzego z zastosowaniem oprogramowania mootools. Jest mały, wydajny, wygodny i w 100% zgodny z oryginalnym Lightboxem v2. Więcej informacji znajdziesz tutaj: http://www.digitalia.be/software/slimbox. Wersja 1.0 slimboxa została napisana przez Amy'ego Stephena i to jemu należą się podziękowania za wymyślenie tego dodatku. Obecna wersja została zmodyfikowana przez zespół witryny http://mslonik.pl, a większość pracy wykonał Damian Damaszke.

Sposób użycia:

{slimbox_1_2
images/duzy_obrazek_1.jpg|
images/miniatura_obrazek_1.jpg|
Rzeczy, które lubię||

images/duzy_obrazek_2.jpg|
images/miniatura_obrazek_2.jpg|
Czemu mi się to przytrafia?||

images/duzy_obrazek_3.jpg|
images/miniatura_obrazek_3.jpg|
Kiedy to się skończy?||

images/duzy_obrazek_4.jpg|
images/miniatura_obrazek_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_1_2.

- Możesz też wykorzystać slimbox do wyświetlenia tylko jednego obrazka.

- Do wyświetlenia jednego obrazka potrzebne jest podanie do trzech argumentów oddzielonych od siebie znakiem pionowej kreski: "|". Są to: {slimbox_1_2
x1|
x2|
x3||
}
Obrazek w pełnym rozmiarze - x1, miniaturka obrazka - x2 oraz opis / komentarz -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 do pliku 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 / komentarzem do obrazka - x3 może zawierać dowolny znak oprócz znaku specjalnego |.

- Jeżeli nie chcesz jakiemuś obrazkowi nadawać opisu, lub jeżeli nie chcesz nadawać opisu wszystkim obrazkom, po prostu pomiń trzeci argument - x3, ale pamiętaj, że wtedy zamiast znaku | kończącego sekcję, musisz umieścić dwa znaki: || - ciągi opisujące kolejne obrazki galerii muszą być od siebie oddzielone sekwencją znaków "||"

- 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_1_2".

Baw się dobrze z Joomla!

 

Spolszczone obrazki nakładane przez dodatek na aktualnie wyświetlane zdjęcia:

prevlabel

nextlabel

closelabel

 

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.

 

slimbox_1_0_powiekszony_nast_popr

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.

 

slimbox_1_0_powiekszony_poprz_popr

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.2 PL

 

Sposób aktualizacji:

Pewnym wyzwaniem było pogodzenie wersji 1.2 ze starszą wersją 1.1 lub 1.0. Jeżeli ktoś, tak jak ja, stworzył już n galerii za pomocą wersji 1.1, a nie chce ich modyfikować, wystarczy że zainstaluje dodatkowo wersję 1.2. W ten sposób obrazki stworzone za pomocą wersji 1.1 nadal będą obsługiwane przez slimbox w wersji 1.1, a nowe obrazki będą obsługiwane za pomocą galerii w wersji 1.2. Czyli nie trzeba odinstalowywać starej wersji, wystarczy zainstalować dodatkowo nową. W przypadku, gdy ktoś dopiero zaczyna przygodę ze slimboxem, sprawa wygląda znacznie prościej. By cieszyć się z wprowadzonych udogodnień wystarczy po prostu zainstalować wersję 1.2.

Add your comment

Your name:
Your email:
Your website:
Subject:
Comment:
 
Ochrona antyspamowa