Publikowanie strony

Do dyspozycji masz dwa mechanizmy: galerię we flashu lub w JavaScript.

W programie WebPlus Starter Edition z zakładki QuickBuilder Bar przeciągnij na obszar roboczy ikonę Photo Gallery. Otworzy się okno Photo Gallery. Wybierz jeden z mechanizmów dostępnych w sekcji Gallery Type. W naszym przykładzie wybraliśmy ikonę Flash i pokażemy, jak założyć galerię Flash Photo Gallery. Proces dodawania zdjęć do galerii jest w obu wypadkach taki sam. W tym samym oknie kliknij przycisk Advanced.

W oknie Advanced Settings, w polach Width i Height, możesz zdefiniować maksymalną szerokość i wysokość dla zdjęć. Obrazki, które mają większe wymiary niż te, które ustawisz, zostaną automatycznie przeskalowane do maksymalnego rozmiaru. Dodatkowo w sekcji Image Quality, w polu Quality wpisz 100 proc. Dzięki temu fotki w galerii będą miały najwyższą jakość i nie będą kompresowane przez program. Zatwierdź zmiany przyciskiem OK.

W oknie Photo Gallery kliknij przycisk Add Files, jeżeli chcesz dodawać zdjęcia pojedynczo (w przypadku, gdy masz je rozrzucone po różnych katalogach na dysku). Jeżeli zdjęcia masz zgrupowane w jednym folderze, kliknij przycisk Add Folder. Po wybraniu zdjęć lub dodaniu całego folderu pojawi się w oknie Photo Gallery lista wczytanych zdjęć. Kliknij przycisk Next.

Teraz w sekcji Gallery Style wybierz jeden z dostępnych szablonów graficznych dla twojej galerii. Aktualny podgląd wybranej opcji możesz obserwować w sekcji Preview. W sekcji Settings, klikając przycisk None pod napisem Background Music, możesz ustawić muzykę w tle, po uprzednim wskazaniu na dysku pliku z dźwiękiem. Jeżeli chcesz, aby fotki w galerii automatycznie się zmieniały i pełniły funkcję pokazu slajdów, zaznacz opcję Auto Play, a w polu Duration ustaw czas wyświetlania zdjęcia. Możesz ukryć pasek nawigacyjny, zaznaczając opcję Auto Hide Control Bar. Aby zakończyć edycję, kliknij przycisk Finish.

Powrócisz do głównego okna programu. Ustaw jeszcze dokładnie położenie galerii na stronie. Aby sprawdzić funkcjonowanie galerii w przeglądarce, kliknij strzałkę obok ikony Preview i z listy wybierz przeglądarkę, w której chcesz otworzyć podgląd, np. Preview Page in Mozilla Firefox. Twoja galeria mo że wyglądać tak jak w naszym przykładzie. Możesz ją edytować w dowolnym momencie.

Favicon to ikona, która jest widoczna w oknie przeglądarki internetowej obok adresu URL. Warto ją przygotować, by zwiększyć rozpoznawalność witryny i wprowadzić jej charakterystyczny znak, który wyróżni ją wśród zakładek innych stron WWW.

W dowolnym programie graficznym (np. Gimp lub Photoshop) przygotuj plik o wymiarach 32x32 pikseli i zapisz go na dysku w formacie JPG, GIF lub PNG.

W przeglądarce internetowej otwórz stronę http://pcformat.pl/u/300 i w sekcji Image to create icon from kliknij przycisk Przeglądaj. W otwartym okienku Wysyłanie pliku wskaż na dysku przygotowany plik graficzny, np. pcffavicon.jpg, i kliknij Otwórz, a następnie kliknij przycisk Create icon.

Na stronie w sekcji FavIcon (16x16) zobaczysz podgląd przygotowanej favicony. Aby zapisać ją na dysku, kliknij Download FavIcon i zapisz plik w folderze z wygenerowaną stroną internetową. Jeżeli nie masz plików strony na dysku, przeczytaj warsztat „Zapisywanie gotowej strony na dysku”.

Teraz otwórz folder ze stroną. Kliknij prawym przyciskiem myszy na pliku index.html i z menu kontekstowego wybierz opcję Edit with Notepad++. Jeżeli nie masz na dysku programu Notepad++, możesz otworzyć plik index.html w zwykłym systemowym notatniku.

W kodzie źródłowym witryny, w sekcji head dopisz linijkę:
<link rel=”shortcut icon” type=”image/x-icon” href=”favicon.ico”>
i zapisz plik, korzystając ze skrótu [CTRL]+[S]. Czynność tę powtórz, edytując pozostałe pliki podstron.

Pamiętaj, że w celu wprowadzenia zmian musisz nadpisać pliki na serwerze. Do tego celu możesz wykorzystać dowolnego klienta FTP, np. Total Commandera.

Jeżeli interesują cię statystyki oglądaności oraz to, kto odwiedza twoją stronę i z jakich źródeł do niej trafia, powinieneś zainstalować profesjonalny mechanizm do takich analiz. Jednym z nich jest Google Analytics. Podpowiadamy, jak sprawnie podpiąć ten mechanizm do twojej strony.

W przeglądarce internetowej otwórz adres www.google.com/analytics/ i kliknij przycisk Zaloguj się do Analytics. Jeżeli masz konto na Gmailu, podaj swój login i hasło, w przeciwnym wypadku kliknij Zarejestruj się i postępując zgodnie ze wskazówkami, wypełnij formularz i załóż konto.

Po zalogowaniu się do usługi Analytics kliknij zakładkę Administrator, a następnie w sekcji Konta kliknij przycisk Nowe konto.

Na kolejnej stronie wypełnij formularz. W pole Nazwa konta wpisz nazwę swojej witryny, w polu Adres URL witryny z rozwijanej listy wybierz http:// i w polu tekstowym wpisz adres swojej strony. Teraz ustaw strefę czasową Polska i przewiń stronę do sekcji Umowa użytkownika, w której na rozwijanej liście Kraj lub terytorium wybierz Polska. Na koniec zapoznaj się z umową, po jej akceptacji zaznacz pole Tak, akceptuję powyższe warunki korzystania z usługi i kliknij Utwórz konto.

Po poprawnym wypełnieniu formularza zobaczysz komunikat Powodzenie. Na kolejnej stronie w sekcji: Wklej ten kod w swojej witrynie skopiuj poniższy kod do schowka, posługując się skrótem klawiszowym [CTRL]+[C].

Otwórz folder ze stroną. Kliknij prawym przyciskiem myszy plik index.html i z menu kontekstowego wybierz opcję Edit with NotePad++. Jeżeli nie masz na dysku programu Notepad++, możesz otworzyć plik index.html w zwykłym systemowym notatniku.

W kodzie źródłowym witryny, w sekcji head wklej, posługując się kombinacją klawiszy [CTRL]+[V], wygenerowany przez Google kod statystki. Zapisz plik, korzystając ze skrótu [CTRL]+[S]. Czynność tę powtórz, edytując pozostałe pliki podstron.

W celu wprowadzenia zmian musisz nadpisać pliki na serwerze. Do tego celu możesz wykorzystać dowolnego klienta FTP, np. Total Commandera.

Po zakończeniu prac nad swoją stroną zapisz projekt na dysku, posługując się skrótem klawiszowym [CTRL]+[S]. W ten sposób zapisałeś tylko plik, który otworzysz jedynie w programie Web Plus. Aby zapisać gotową witrynę z kompletem podstron, wykonaj następujące czynności.

Kliknij strzałkę obok ikony Publish Site, po czym z rozwiniętej listy wybierz Publish to Disk Folder.

W oknie Publish to Disk Folder w sekcji Output Folder kliknij przycisk Choose Folder i w oknie Przeglądanie w poszukiwaniu folderu wskaż na dysku docelowe miejsce dla swojej strony.

W sekcji Page Range jest domyślnie zaznaczona opcja Publish All Pages. Oznacza to, że program automatycznie wygeneruje wszystkie utworzone do tej pory podstrony. Kliknij OK, aby uruchomić generator.

Po wygenerowaniu strony zobaczysz okno Web Site Publishing. Aby zobaczyć, jak wygląda twoja strona w przeglądarce internetowej, wybierz z listy Browser jedną z przeglądarek, np. Mozilla Firefox, i kliknij View site in web browser. Po chwili uruchomi się wybrana przeglądarka internetowa z twoją stroną.

Wróć do okna programu WebPlus i w okienku Web Site Publishing kliknij Close.

Jeżeli masz już własny serwer WWW, na którym chcesz opublikować swoją stronę, możesz to zrobić bezpośrednio z programu WebPlus. Darmowe konto WWW możesz założyć w serwisie strefa.pl. Proces rejestracji opisywaliśmy w numerze 11/2011, archiwalny artykuł znajdziesz pod adresem http://pcformat.pl/u/299.

Kliknij strzałkę obok ikony Publish i z rozwiniętej listy wybierz Publish to Web.

Teraz w oknie Publish to Web w sekcji FTP Account kliknij przycisk Accounts i w nowo otwartym oknie Account Details wypełnij formularz, podając parametry swojego serwera. W polu Account name nadaj nazwę dla konta, a w pole FTP address wpisz nazwę serwera ftp, np. ftp.strefa.pl. Następnie w pola Username i Password wpisz odpowiednio nazwę użytkownika i hasło. Kliknij OK.

Zobaczysz okno Upload to server. Kliknij przycisk Test, aby sprawdzić poprawność zdefiniowanego konta. Jeżeli poprawnie podałeś parametry serwera, zobaczysz odpowiedni komunikat. Kliknij OK. Powrócisz do okna Upload to server. Kliknij w nim przycisk Update Account.

W oknie Publish To Web w sekcji Page Range zaznacz opcję Publish All Pages i kliknij przycisk OK.

W oknie Uploading files zobaczysz pasek informujący o postępie przesyłania plików na serwer. Po zakończeniu wysyłania zobaczysz komunikat Finished, kliknij przycisk Close.

Zobaczysz jeszcze okno Web Site Publishing. Wpisz w pole tekstowe docelowy adres twojej strony przypisany dla konta na serwerze, z listy in this browser wybierz przeglądarkę, np. Mozilla Firefox, i kliknij przycisk View this URL. Po uruchomieniu strony w przeglądarce sprawdź, czy wszystko działa poprawnie.