Posiadasz wiele fotografii które chciałbyś zaprezentować, lecz nie masz czasu na wykonanie skryptu, który by to wszystko obsługiwał? Poniżej zobaczysz, jak stworzyć prosty silnik galerii zdjęć przy wykorzystaniu technologii Ajax do ich efektywnej prezentacji. Przedstawiam drugą wersję skryptu. Uwzględnia ona Wasze propozycje, które dodawaliście w komentarzach do poprzedniej wersji.

Skrypt Highslide którego użyjemy do stworzenia galerii, to podobnie jak Lightbox, Litebox, Thickbox, GreyBox etc. - ostatnio popularny efekt prezentacji zdjęć. Polega na przyciemnieniu ekranu oraz płynnym rozwinięciu ramki ze zdjęciem podczas powiększenia.

1. Struktura plików i katalogów

W tym punkcie nie ma zmian, wszystko zostaje jak w poprzedniej wersji. Galeria składać się będzie z następujących folderów i dokumentów.

2. Silnik galerii w PHP

W tym punkcie nastąpiła ewolucja, i to dosłownie. Dodałem zaproponowane przez Was rzeczy, które wydały mi się najbardziej istotne.

2a. Sortowanie
Druga wersja galerii zdjęć domyślnie zawiera sortowanie obrazków po nazwie pliku. Wiele osób pytało o tą funkcjonalność.

2b. Opis zdjęcia
Pod każdym zdjęciem pojawia się kolejny numer obrazka, od 0 do np. 30. To jest opcjonalne, w opcjach dodałem możliwość wyłączenia opisu.

2c. Paginacja
W tej wersji można ustalić, ile obrazków ma się znajdować na 1 stronie. Pojawia się nawigacja pod galerią, dzięki której możemy przejść do poprzedniej/kolejnej strony z określoną ilością.

Pierwszy etap to stworzenie pliku głównego index.php, który będzie napędzać naszą galerię zdjęć. Poniżej jego zawartość.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl">
<head>
  <title>Prosty skrypt galerii zdjęć z efektem Highslide - wersja 2</title>
  <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" />
  <script type="text/javascript" src="javascript/highslide-with-gallery.js"></script>
  <link rel="stylesheet" href="css/style.css" type="text/css" media="screen" />

  <script type="text/javascript">
    hs.graphicsDir = 'javascript/images/';
    hs.align = 'center';
    hs.transitions = ['expand', 'crossfade'];
    hs.outlineType = 'rounded-white';
    hs.fadeInOut = true;
    //hs.dimmingOpacity = 0.75;

    // Add the controlbar
    if (hs.addSlideshow) hs.addSlideshow({
    //slideshowGroup: 'group1',
      interval: 5000,
      repeat: false,
      useControls: true,
      fixedControls: 'fit',
      overlayOptions: {
        opacity: .75,
        position: 'bottom center',
        hideOnMouseOut: true
      }
    });
</script>
</head>
<body>
<div id="galeria">
<ul>
<?php
$katalog = "obrazki";
$katalogMiniaturki = "miniaturki";
$naStronie = 6;
$opisZdjecia = true;

Rozpoczynamy tworzenie silnika galerii, którą obejmujemy znacznikiem DIV "galeria". Zmiennna $katalog zawiera nic innego, jak nazwę katalogu z obrazkami, $katalogMiniaturki analogicznie zawiera nazwę katalogu z miniaturkami.

W zmiennej $naStronie określimy, ile obrazków ma się znajdować na jednej stronie. Natomiast linijkę niżej możemy włączyć lub wyłączyć opis zdjęcia - kolejny numer zaczynając od 0 - analogicznie true lub false.

$ilosc = count(glob("./$katalog/*"));
$iloscStron = ceil($ilosc/$naStronie);

Pierwsza linijka kodu ustala, ile obrazków zostało umieszczonych w katalogu. Druga linijka kodu oblicza - wg tego ile obrazków może być na jednej stronie - ile stron wygenerować dla galerii.

$pliki = glob($katalog.'/*.jpg');
$i = 0;
foreach($pliki as $key => $value){
  $tab[$i] = $value;
  $i++;
}
sort($tab);

for($i = 0; $i < $ilosc; $i++){
    if($opisZdjecia) $opisZdjecia = '<span>Obrazek nr '.$i.'</span>';
    $tablica[$i] = '<li><a href="'.$tab[$i].'" class="highslide" onclick="return hs.expand(this)" title="Obrazek nr '.$i.'"><img width="200" height="133" src="'.str_replace($katalog, $katalogMiniaturki, $tab[$i]).'" alt="Obrazek nr '.$i.'" />'.$opisZdjecia.'</a></li>';
   
}

Odczyt listy katalogów i plików ze wskazanej lokalizacji umożliwia nam funkcja glob() - tę wartość przypisujemy zmiennej $galeria. Tworzymy tablicę, w której umieszczamy kolejne obrazki z katalogu i przy okazji liczymy ile ich jest.

Dzięki funkcji sort() obrazki są posortowane wg nazwy od najmniejszej liczby do największej. Funkcja rsort() malejąco. Pętla for() generuje nam wykaz z kolejnymi obrazkami. Lista ta odnosi się nie tylko do lokalizacji dużego obrazka, miniaturki obrazka, ale również efektu Highslide.

if($_GET['strona'] && $_GET['strona'] > 0 && $_GET['strona'] <= $iloscStron) $strona = $_GET['strona']-1;
else $strona = 0;

$poczatek = $strona * $naStronie;
if($poczatek >= $ilosc) $poczatek = 0;

$koniec = $poczatek + $naStronie;
if($koniec >= $ilosc) $koniec = $ilosc;

for($i = $poczatek; $i < $koniec; ++$i){
  echo $tablica[$i]."n";
}
?>
</ul>

Stawiamy warunek, który sprawdza wybrany przez Użytkownika aktualny numer strony. Kolejne zmienne regulują ilość obrazków na danych podstronach, a pod koniec wyświetlają pełną galerię.

<ul id="nawigacja">
<?php
if($strona > 0) echo '<li><a href="index.php?strona='.($strona).'" >[<]</a></li>';
for($i = 1; $i <= $iloscStron; ++$i){
  echo '<li><a href="index.php?strona='.$i.'" >['.$i.']</a></li>';
}
echo $linki;
if($strona < $iloscStron-1) echo '<li><a href="index.php?strona='.($strona+2).'" >[>]</a></li>';
?>
</ul>
</div>

</body>
</html>

Umieszczamy nawigację w naszej galerii, która zawiera link do poprzedniej/następnej strony oraz odnośniki do kolejnych stron.

3. JavaScript

Archiwum ze skryptem Highslide dostępne jest na stronie autorów, highslide.com/download.php. Nas interesuje plik highslide-with-gallery.js wraz z katalogiem /images/.

4. Arkusz stylów CSS

Drugi etap to stworzenie pliku style.css, który będzie zawierać style dla naszej galerii zdjęć - umieszczamy go w katalogu /css/. Poniżej jego zawartość.

#galeria{
	width: 700px;
	margin: 50px auto 0 auto;
	color: #555;
	font: 12px Arial, Verdana;
}

#galeria ul li{
	float:left;
	margin:0 15px 15px 0;
	list-style-type:none;
	text-decoration:none;
	
}

#galeria img{
	border: 1px solid #bbb;
	padding: 1px;
}

#galeria ul span{
  display:block;
  color:#555;
  text-align:center;
}

#galeria ul#nawigacja li{
  margin-top:15px;
}

#galeria ul#nawigacja li a{
   text-decoration:none;
   color:#555;
}


/* Ajax */
.highslide-container div {
	font-family: Verdana, Helvetica;
	font-size: 10pt;
}
.highslide {
	outline: none;
	text-decoration: none;
}
.highslide img {
	border: 2px solid silver;
}
.highslide:hover img {
	border-color: gray;
}

.highslide-active-anchor img, .highslide-active-anchor:hover img {
	border-color: black;
}
.highslide-image {
	border-width: 2px;
	border-style: solid;
	border-color: white;
	background: gray;
}
.highslide-wrapper, .rounded-white {
	background: white;
}
.highslide-image-blur {
}
.highslide-caption {
	display: none;
	border-top: none;
	font-size: 1em;
	padding: 5px;
	background: white;
}
.highslide-heading {
	display: none;
	font-weight: bold;
	margin-bottom: 0.4em;
}
.highslide-dimming {
	position: absolute;
	background: black;
}
.highslide-loading {
	display: block;
	color: black;
	font-size: 9px;
	font-weight: bold;
	text-transform: uppercase;
	text-decoration: none;
	padding: 3px;
	border: 1px solid white;
	background-color: white;
	padding-left: 22px;
	background-image: url(../javascript/images/loader.white.gif);
	background-repeat: no-repeat;
	background-position: 3px 1px;
}
a.highslide-credits,
a.highslide-credits i {
	padding: 2px;
	color: silver;
	text-decoration: none;
	font-size: 10px;
}
a.highslide-credits:hover,
a.highslide-credits:hover i {
	color: white;
	background-color: gray;
}


/* Controls. See http://www.google.com/search?q=css+sprites */
.highslide-controls {
	width: 195px;
	height: 40px;
	background: url(../javascript/images/controlbar-white.gif) 0 -90px no-repeat;
	margin-right: 15px;
	margin-bottom: 10px;
	margin-top: 20px;
}
.highslide-controls ul {
	position: relative;
	left: 15px;
	height: 40px;
	list-style: none;
	margin: 0;
	padding: 0;
	background: url(../javascript/images/controlbar-white.gif) right -90px no-repeat;
}
.highslide-controls li {
	float: left;
	padding: 5px 0;
}
.highslide-controls a {
	background-image: url(../javascript/images/controlbar-white.gif);
	display: block;
	float: left;
	height: 30px;
	width: 30px;
	outline: none;
}
.highslide-controls a.disabled {
	cursor: default;
}
.highslide-controls a span {
	/* hide the text for these graphic buttons */
	display: none;
}
.highslide-move a {
	cursor: move;
}

/* The CSS sprites for the controlbar */
.highslide-controls .highslide-previous a {
	background-position: 0 0;
}
.highslide-controls .highslide-previous a:hover {
	background-position: 0 -30px;
}
.highslide-controls .highslide-previous a.disabled {
	background-position: 0 -60px !important;
}
.highslide-controls .highslide-play a {
	background-position: -30px 0;
}
.highslide-controls .highslide-play a:hover {
	background-position: -30px -30px;
}
.highslide-controls .highslide-play a.disabled {
	background-position: -30px -60px !important;
}
.highslide-controls .highslide-pause a {
	background-position: -60px 0;
}
.highslide-controls .highslide-pause a:hover {
	background-position: -60px -30px;
}
.highslide-controls .highslide-next a {
	background-position: -90px 0;
}
.highslide-controls .highslide-next a:hover {
	background-position: -90px -30px;
}
.highslide-controls .highslide-next a.disabled {
	background-position: -90px -60px !important;
}
.highslide-controls .highslide-move a {
	background-position: -120px 0;
}
.highslide-controls .highslide-move a:hover {
	background-position: -120px -30px;
}
.highslide-controls .highslide-full-expand a {
	background-position: -150px 0;
}
.highslide-controls .highslide-full-expand a:hover {
	background-position: -150px -30px;
}
.highslide-controls .highslide-full-expand a.disabled {
	background-position: -150px -60px !important;
}
.highslide-controls .highslide-close a {
	background-position: -180px 0;
}
.highslide-controls .highslide-close a:hover {
	background-position: -180px -30px;
}

Style umieszczone po komentarzu "AJAX" należą do skryptu Highslide, przed nim znajdziemy opcjonalne style galerii tj. obramowanie zdjęć, marginesy i szerokość strony. Wszelkie propozycje i uwagi umieszczajcie w komentarzach pod spodem, chętnie na nie odpowiem.

Podgląd Pobierz
↑ Skocz do góry

Autor: Bartosz Stefanicki.
Tagi: , , , , , .

Dodaj komentarz

87 komentarzy do "Prosty skrypt galerii zdjęć z efektem Highslide – wersja 2"

avatar
Sortuj wg:   najnowszy | najstarszy | oceniany
Piotr
Gość
WItam, Bardzo fajna galeria :) mam tylko parę problemów ( pewnie jak każdy początkujący ) Po pobraniu i zaimplementowaniu kodu galeria wyświetla mi się ale wywala błędy tj. Notice: Undefined index: strona in C:\xampp\htdocs\index.php on line 255 Notice: Undefined variable: linki in C:\xampp\htdocs\index.php on line 280 Linie te odpowiadają kodowi: dla 255: if($_GET['strona'] && $_GET['strona'] > 0 && $_GET['strona'] <= $iloscStron) $strona = $_GET['strona']-1; else $strona = 0; dla 280: echo $linki; Drugim problemem który za bardzo nie wiem jak rozwiązać jest to, że galerię mam nie na początku strony tylko trochę dalej i jak przełączam się pomiędzy stronami w… Czytaj więcej »
krzsysiek
Gość

Witam,
Potrzebuje uzyskać taki efekt ale po najechaniu na tekst żeby w małym dodatkowym oknie tak jak w tym przypadku wyświetlało się zdjęcie. Czy jest szansa coś takiego uzyskać czy trzeba szukać czegoś innego. Szukam takiej formy lecz nic nie mogę znaleźć czy ktoś może pomóc ?

Karol
Gość

Witam,
mam stronę w html i chciałem zapytać jak wstawić galerię na stronę w html

Mateusz
Gość

Witam,
Mam problem z następującym komunikatem
Notice: Undefined variable: linki in C:\xampp\htdocs\index.php on line 103
czyli: [code]echo $linki;[/echo]
po usunięciu tej linijki wszystko śmiga normalnie. Więc pytanie po co to i czy to jest potrzebne?
Nie zmieniałem oryginalnego kodu, poza nazwą pliku css (oczywiscie nazwe samego pliku również zmieniłem). Nie dodałem żadnych obrazków ani nic. Surowy plik wrzuciłem do localhosta, który obsługuje serwer XAMPP (wersja 1.8.2)

Andrzej
Gość

Witam,
Galeria bardzo fajna, kawał dobrej roboty.. mam tylko jedno pytanie czemu podczas wyświetlania zdjęć można przewijać tylko zdjęcia znajdujące sie na stronie a nie całą galerie. Chodzi o to że jeśli na stronie prezentowane jest 8 zdjęć to po przełączeniu się na podgląd dużego zdjęcia przewija do ostatniego zdjęcia na stronie (8) i koniec mimo iż w galerii znajduje sie 50 zdjęć ?

Paweł
Gość

Dobra, to już ogarnąłem. A czy mógłbyś opisać jak zrobić ten podział na albumy? Chociaż zarys bo samo "Stwórz osobne katalogi, następnie osobne pliki z galerią do poszczególnych katalogów i po sprawie." nic mi nie mówi niestety. Jeśli chcesz możesz odezwać się na e-maila. :)

Paweł
Gość

Witajcie Kochanie. Mam pytanie dosyć banalne. Jak tu dodawać zdjęcia bo wszystko działa ze standardowymi zdjęciami a już z moimi nie działa. Wszystkie zdjęcia są w identycznych wymiarach jak te standardowe w RAR. Kombinowałem na wiele sposobów, usuwałem jedno zdjecie, nadawalem nazwe poprzedniego zdjecia a mimo to wciaz pokazywalo np. tylko 5 zdjec bez tego mojego szóstego. Proszę o pomoc.

Robert
Gość

Witam, czy można by dodać przycisk "pobierz" ?

Mateusz
Gość

Witam,
Jak zmienic podpis kazdego zdjęcia w galerii na indywidualny, zamiast Obrazek nr X aby wyświetlała się nazwa opisująca zdjęcie np ,,Zdjęcie samolotu" kolejne ,,Zdjęcie jeziora" itd aby każde zdjęcie miało inny opis. Dzięki za odpowiedź.

Paweł
Gość

Już działa, dałem plik galerii w tym samy katalogu co index, zmieniając tylko scieżki do javy i obrazkow

Paweł
Gość

mam katalog głowny, a w nim Index.php, oraz folder gal, w ktorym są pliki galeria. Includuje w Indexie poprzez include("gal/galeria.php"); i nic

Paweł
Gość

Witam, wrzucilem galerie na serwer, wszystko działa jak sie wchodz w nią bezposrednio, lecz jak chce ją wrzucic poprzez funkcje include na stronę, wyrzuca mi bład :
Warning: sort() expects parameter 1 to be array, null given in /home/baddy/www/fotosbudka/gal/index.php on line 69

Marcin
Gość
Wita po pobraniu w przeglądarce wywala mi coś takiego $value){ $tab[$i] = $value; $i++; } //sortowanie tablicy sort($tab); for($i = 0; $i 0 && $_GET['strona'] = $ilosc) $poczatek = 0; $koniec = $poczatek + $naStronie; if($koniec >= $ilosc) $koniec = $ilosc; //generowanie wykazu for($i = $poczatek; $i 0) echo ' [<] '; for($i = 1; $i <= $iloscStron; ++$i){ //linki do poszczególnych stron echo ' ['.$i.'] '; } echo $linki; //link do następnej strony if($strona ] '; ?>
Rafał
Gość

Witam.
Wprowadziłem troszkę poprawek odnośnie nawigacji. Chciałem, aby aktualna strona nie była aktywnym linkiem oraz z pierwszej strony zniknął odnośnik "poprzednia" a z ostatniej - "następna". W zasadzie działa, jednak po uruchomieniu galerii nie rozpoznaje, że jest na 1 stronie (odnośnik "1" jest dalej aktywny). Po przejściu do kolejnej/którejkolwiek strony już jest ok. Jak temu zaradzić?
Poniżej kod:
[code]<php
0) echo ' < ';
for($i = 1; $i <= $iloscStron; ++$i){

//linki do poszczególnych stron
if($i == $_GET['strona']) {
echo ''.$i.'';
}
else {
echo ''.$i.' ';
}
}
echo $linki;

//link do następnej strony
if($strona < $iloscStron-1) echo ' > ';
?>[/code]

Rafał
Gość

Już wiem.
Trzeba postawić warunek nie na zmienną pobraną z adresu - $_GET['strona'], lecz na zmienną "@strona+1".
ps. w poprzednim poście w kodzie nie ma wielu rzeczy... coś nie tak z [code]

Daniel
Gość
Witam Świetna galeria, bardzo przydała mi się na moją stronę, ale czy mógłby mi Pan, Panie Bartku pomóc z dwoma problemami, jestem totalnym laikiem, początkującym z php i sam nie mogę sobie poradzić, chodzi mi gdzie i jaki kod konkretnie wstawić aby w podpisie zdjęcia wyświetlała się nazwa pliku, sama nazwa, bez rozszerzenia. Druga sprawa dotyczy aktywnego numeru strony, podany kod w komentarzach nie działa, po wprowadzeniu zmian w kodzie wyświetla błąd: Notice: Undefined index: strona in F:\xampp\htdocs\g3\len.php on line 143 Linia 143 odnosi się do drugiej linii poniższego kodu: [code]echo '['.$i.']';[/code] Proszę Pana o pomoc lub osobę posiadającą odpowiednią… Czytaj więcej »
Daniel
Gość

Coś mi kod nie wyszedł:

echo '['.$i.']';

Mirek
Gość

Dlaczego powyższy odsyłacz "Pobierz" nie działa?

Marcin
Gość

Znalazłem problem, należy wrzucić wszystkie pliki w komputerze. Następnie całość wyeksportować na serwer, jedynie mam kłopot z miniaturkami. Miniaturki o rozdzielczości 200x150 ukazują się na stronie, lecz niestety są rozciągnięte. Gdy zmienię rozdzielczość na inną zwraca błąd [code]Undefined offset: 11 in /i-data/6a540b5d/public/www/index.php on line 74[/code]

Bartosz Stefanicki
Gość

Wymiary miniaturek są ustalone w kodzie HTML, możesz to usunąć, lub zmienić:

[code lang="html"].... <img width="200" height="133" ....[/code]

Marcin
Gość

Prawdopodobnie należy w jakiś sposób odblokować serwer aby zobaczyć tą lokalizację. Zauważyłem, że na stronie widnieją miniaturki o jednakowym rozmiarze 200x150 px może w tym jest problem.

Marcin
Gość

lecz nie mam takiej lokalizacji na serwerze

Marcin
Gość

Configuration File (php.ini) Path /usr/local/php

Marcin
Gość

ale gdy test.php wyeksportuje na serwer i wpisze jego adres, to zwraca tabelkę "php Ver. 5.2.8" w polu [code]error_reporting =6143[/code]

Marcin
Gość

Pytam, bo próbowałem już w konsoli wpisywać to polecenie zwraca informacje, że nazwy php nie rozpoznaje jako polecenie, drugą metoda, stworzyłem plik test.ini wkleiłem zawartość, ale w jaki sposób ma zwrócić informację?? plik skojarzyło z przeglądarką, gdy otwieram otwiera się strona bez zawartości,

Marcin
Gość

gdzie wpisać to polecenie [code] php -i | grep php.ini [/code]

Bartosz Stefanicki
Gość

W konsoli, ale możesz też spróbować drugiej metody :)

Marcin
Gość

nie odnalazłem pliku php.ini , gdzie on powinien się znajdować, mogę utworzyć taki. Z błędami mogę sobie poradzić podmieniając linijką 78 i zakasowując linijkę 103. Problem jest, że po podmianie Pana plików graficznych na moje nic się nie wyświetla, oprócz pustych ramek i błędów.

Marcin
Gość

jestem początkujący jeżeli chodzi o html, php. Czy może Pan podać swój mail, podam login i hasło do wydzielonej części mojego dysku na którym są pliki pobrane z tego forum

Bartosz Stefanicki
Gość

Marcin, mogę postarać się pomóc, ale tylko tutaj. Znajdź ten plik i spróbuj wstawić powyższy kod, on wykluczy te błędy.

Marcin
Gość

pliki usuwam i kopiuje używając programu Totalcomander

Bartosz Stefanicki
Gość

Spróbuj w php.ini wyłączyć raportowanie błędów typu notice, napisz jaki efekt:

[code]error_reporting = E_ALL & ~E_NOTICE[/code]

Bartosz Stefanicki
Gość

Używaj znacznika [code][/code] , będzie to wszystko czytelniejsze. Marcin, jeśli wklejasz kod prosto stąd, bez modyfikowania, to wyświetla się Tobie taki błąd?

Marcin
Gość
pobrane pliki umieszczam na własnym serwerze NSA310, w folderze o nazwie "www". Kiedy wpisuję adres zewnętrzny serwera wyświetla się Notice: Undefined index: strona in /i-data/6a540b5d/public/www/index.php on line 78, poniżej obrazki miniaturki, poniżej Notice: Undefined variable: linki in /i-data/6a540b5d/public/www/index.php on line 103, Zgodnie z instrukcjami na forum, linijkę 78 zmień na: if(isset($_GET['strona']) && $_GET['strona'] > 0 && $_GET['strona'] <= $iloscStron) $strona = $_GET['strona']-1; Problem 2 rozwiążesz usuwam linijkę nr 103. Po tej zmianie wyświetlają się miniaturki bez błędów, na pulpicie mam gotowe foldery "obrazki" i "miniaturki" z własnymi zdjęciami, pliki .jpg w obydwu folderach mają takie same nazwy, z tym że… Czytaj więcej »
Marcin
Gość

Po podmianie zdjęć w folderze "obrazki" i "mianiatury" (rodzielczość 200x150 wyswietla błąd

'sort() expects parameter 1 to be array, null given in line 69'
nie wyświetla miniatur jedynie puste małe ramki

Salvation
Gość

Wklej tą 69 linijkę tutaj używając znacznika [code]

Bartosz Stefanicki
Gość

Hmm, ciekawa sytuacja. Czy zmieniałeś coś w kodzie?

Marcin
Gość

Po umieszczeniu plików na serwerze wyświetla obrazki, pod nimi błąd "Notice: Undefined variable: linki in /i-data/6a540b5d/public/www/index.php on line 103"

Marcin
Gość
Witam, mam problem z dodaniem zdjęć do strony. Gdy wklejam zdjęcia do katalogu "obrazki" i o tych samych nazwach do "miniaturki" wyświetla mi się błąd na stronie: Warning: sort() expects parameter 1 to be array, null given in /i-data/6a540b5d/public/www/index.php on line 69 Notice: Undefined index: strona in /i-data/6a540b5d/public/www/index.php on line 78 Obrazek nr 0 Obrazek nr 1 Obrazek nr 2 Obrazek nr 3 Obrazek nr 4 Obrazek nr 5 Obrazek nr 6 Obrazek nr 7 Obrazek nr 8 [1] [2] Notice: Undefined variable: linki in /i-data/6a540b5d/public/www/index.php on line 103 w folderze miniaturki znajdują się pomniejszone obrazki do rozmiaru szer 200… Czytaj więcej »
wpDiscuz