Jak dodać galerię zdjęć w Microsoft Expression Web

Tworząc stronę internetową – biznesową lub osobistą – często chcemy pokazać zdjęcia. Galeria może prezentować realizacje, produkty lub prywatne wspomnienia. Poniżej opisujemy, jak w Microsoft Expression Web dodać prostą galerię zdjęć.

Krok 1 – Przygotowanie zdjęć

Skopiuj wszystkie obrazy, które mają się znaleźć w galerii, do jednego folderu na komputerze. Możesz to zrobić, podłączając aparat cyfrowy, kopiując z płyty CD, pendrive’a lub skanując wydruki.

Krok 2 – Otwórz projekt

Uruchom Expression Web, wybierz Plik → Ostatnie witryny i otwórz stronę, do której chcesz dodać galerię. W lewym panelu przejdź do odpowiedniego pliku HTML i go otwórz.

Krok 3 – Importuj folder ze zdjęciami

W menu wybierz Plik → Importuj → Plik. W oknie dialogowym zaznacz opcję Folder, wskaż wcześniej utworzony katalog ze zdjęciami i zatwierdź OK. Folder zostanie dodany jako podkatalog witryny.

Krok 4 – Utwórz warstwę kontenera

W panelu Layers (warstwy) kliknij Wstaw warstwę. Właściwości warstwy ustaw na Center, określ żądaną szerokość i wysokość galerii oraz zmień identyfikator na container.

Krok 5 – Dodaj pierwsze zdjęcie

Wewnątrz warstwy container wstaw nową warstwę i nazwij ją Photo 1. Kliknij ikonę Wstaw obraz z pliku i wybierz pierwszy obraz.

Krok 6 – Pozycjonowanie

Użyj Absolute Positioning, aby umieścić warstwę Photo 1 w wybranym miejscu galerii. Powtórz kroki 5 i 6 dla kolejnych zdjęć, aż wszystkie znajdą się w galerii.

Gotowe! Galerię możesz dalej stylizować przy pomocy CSS lub efektów dostępnych w Expression Web.