Dawno już nie chwaliłem się jaką to nową stronę wykonałem, część z Was pewnie już zapomniała, że to właśnie robieniem wordpressowych stron zarabiam na życie. Jako, że jedno z moich ostatnich dzieł zapiera dech w piersiach, to jest chyba dobra okazja by Wam o mojej działalności przypomnieć ;)

Uwaga (vel reklama): jeśli ktoś też chce mieć taką stronę, a może nawet jeszcze lepszą, zapraszam do kontaktu!

Rozsiądźcie się wygodnie i podziwiajcie widoki, zarówno te programistyczne, te CSS-owe jak i te jak najbardziej naturalne, przyrodnicze. Bowiem zapraszam Was na stronę internetową o Biebrzy i Biebrzańskim Parku Narodowym.

Biebrzański Park Narodowy - wygląd strony głównej

Powyżej widzicie fragment strony głównej new.biebrza.com, ale do podziwiania jest tam o wiele więcej.

Strona pełni funkcję biznesową: ma sprzedawać wycieczki po Biebrzy i jej okolicach, oferować noclegi i reklamować wiele innych rzeczy, ludzi i instytucji, które z Biebrzą mają coś wspólnego. Jeśli ktoś szuka na przykład gdzie można nad Biebrzą dobrze zjeść, gdzie wypożyczyć kajak, samochód lub nawet przelecieć się balonem – wszystko to na pewno tam znajdzie. Jest nawet sklep internetowy z pamiątkami z nad Biebrzy (oparty na mojej wtyczce TradeMatik).

Pieniądze to oczywiście nie wszystko. Strona na pewno przyda się także innym, którzy Biebrzę wolą zwiedzać sprzed ekranów komputerowych. W szczególności polecam podstronę z informacjami o tej rzece i naprawdę imponującą galerię fotografii (poważnie, zajrzyjcie, bo niektóre zdjęcia zapierają dech w piersiach, aż się nie chce wierzyć, że to nasza rodzima rzeka, a nie Amazonka).

OK, dość marketingu, przejdźmy do tego, co najczęściej opisuję w takich przypadkach, czyli jak przebiegało tworzenie strony i co strona ma w bebechach :) A mam się czym chwalić bo chyba nigdy dotąd nie wyciskałem aż tyle z WordPressa. Ba, nie zdziwię się, jeśli ktoś z Was nie będzie mógł uwierzyć, że to jest nadal WordPress i że nie musiałem tutaj w ogóle modyfikować jego źródeł (dzięki czemu klient może śmiało korzystać z nowszych wydań WordPressa nie bojąc się, że coś się przy aktualizacji popsuje).

Strona nie była tworzona z niczego. Firma Biebrza Eco-Travel posiadała witrynę od dawna (uchowała się jej stara wersja angielska więc każdy może porównać stan przed i po) i patrząc na ów stary design, zakładam, że był projektowany z 13 lat temu. Przynajmniej tak wtedy wyglądały moje strony internetowe ;) Strona zarabiała na siebie. Właściwie to mało powiedziane: była chyba głównym źródłem dochodów, bo to w internecie klienci znajdowali ofertę firmy i przez formularz na stronie składali zamówienia na wycieczki.

Dlaczego więc zmieniono silnik strony na WordPressa? Z dwóch powodów: stara strona trąciła już myszką, a co ważniejsze: nie  było tam żadnego silnika strony. Gdy w ofercie firmy pojawiała się nowa wycieczka, informatyk (w ostatnim okresie działania starej strony to byłem ja) otrzymywał na maila plik Worda z opisem imprezy, zdjęcia z aparatu ( w rozdzielczości 2500×1200 pikseli i wadze po 3 MB) z prośbą o umieszczenie wycieczki na stronie. Wtedy łączyłem się przez FTP ze stroną, tworzyłem nowy dokument html, przekopiowywałem treść, przeskalowywałem w Gimpie zdjęcia, dodawałem „znak wodny”, dodawałem do opisu, otwierałem kilkadziesiąt już istniejących podstron zbiorczych (także w notatniku) i edytując ich kod html dodawałem odnośnik do nowej imprezy.To samo z wszelkimi innymi typami treści.

Całość zajmowała godziny, była żmudna i kosztowała firmę sporo pieniędzy. Analizując kod strony widać było wyraźnie, że przede mną było wielu innych informatyków, którzy nie wytrzymywali takiego trybu pracy (moje wprawne oko wyłapało tam naleciałości z różnych programów od windowsowego notatnika przez DreamWeaver po Front Page i mnóstwo kodu wskazującego na wybieranie w MS Word opcji „zapisz jako stronę web”).  To była tragedia do rozczytania, a żeby choćby poprawić jakąś literówkę musiałem spędzić sporo czasu na rozgrzebywaniu tych html-owych śmieci. To zniechęca do pracy, a co ważniejsze dla klienta: kosztuje dużo ze względu na czas potrzebny na to. Nie mówiąc już o zapewne kolejnych problemach z kolejnymi informatykami, którzy rezygnowali z tej żmudnej pracy i konieczności szukania następnego.

Po przejściu na WordPressa założenie było takie, że strona dostanie nowy wygląd (nawiązujący jednak do starego), nowe możliwości i typy treści, a co najważniejsze to już sam właściciel strony bez wymogu znajomości HTML sam będzie te treści dodawał, aktualizował i układał w sposób jaki będzie tego chciał. To niewątpliwe zalety, ale pojawiła się spora obawa:

Stara strona była bardzo dobrze zaindeksowana w wyszukiwarkach, a to z Google przychodziła większość klientów. Czy kompletna przebudowa strony, zmiana treści i zmiana odnośników do poszczególnych podstron nie sprawi, że nagle w jeden dzień firma przestanie zarabiać? Nie będę Was trzymał w niepewności: dzięki sztuczkom z .htaccess i naturalnej miłości pomiędzy WordPressem a zagadnieniami SEO (na stronie nie ma nawet zainstalowanej żadnej wtyczki do pozycjonowania witryny!) wszystko poszło wyśmienicie. Sprawdźcie sami wpisując w google słowo „biebrza”. Stara wersja strony znajdowała się na 3. pozycji w wynikach wyszukiwania (po oficjalnej stronie parku i artykule w wikipedii). Nowa znajduje się na tej samej. Podobnie jest z innymi frazami związanymi z tą branżą i okolicą.

Przy budowie strony silnie wykorzystałem rewelacyjną nowość wordpressa jaką są własne typy treści. Jeszcze dwa lata temu wszystko publikowane na stronie musiało by być zapewne albo „stroną” albo „wpisem blogowym” przyporządkowanymi do kategorii „wycieczki”, „noclegi”, „baza żywieniowa”… Biorąc pod uwagę, że każdy z tych typów danych powinien mieć różne pola je opisujące (na przykład wycieczki mają określony termin startu i zakończenia, czego na przykład nie ma restauracja, która z kolei może zostać przyporządkowana do kategorii „restauracje”, „bary” lub kolejnej, która ni jak nie odnosi się do wycieczek czy noclegów), byłby to koszmar.

Dzięki wykorzystaniu własnych typów treści, każda opcja na stronie ma swój własny formularz dodawania. Przy imprezie (wycieczce) można określić tak podstawowe rzeczy jak „termin”, „program”, „miejsce startu” czy „przewodnik”, po te bardziej wyszukane jak na przykład „noclegi w okolicy” (i tu klient może od razu metodą przeciągnij i upuść stworzyć dowiązania do elementów o typie treści „baza noclegowa”), „współrzędne geograficzne” (jak zapewne zobaczycie każda wycieczka ukazana jest też na automatycznie generowanej mapie). Podobnie przy „bazie noclegowej” można określić cenę za noc, ilość miejsc noclegowych, wybrać do jakiej kategorii należy dany obiekt lub na przykład ile metrów/kilometrów jest do plaży.

Możliwości jest tak wiele (sama strona to obecnie aż 18 custom post types i każdy ma od kilkunastu do nawet kilkudziesięciu różnych pól formularza do uzupełnienia podczas edycji), że czasami ich edycja staje się szczerze mówiąc  trudna. Z tego powodu wiele edycji wizualnych przenieśliśmy do front-endu – zalogowany właściciel strony może sam układać sobie pewne elementy na stronie od razu widząc jak to będzie wyglądało po edycji (nie musi nawet klikać przycisku zapisz).

Oto przykład jak układane są zdjęcia w galerii:

Wystarczy złapać myszką za zdjęcie i przemieścić je w nową pozycję. Po opuszczeniu zmiana zostanie zapamiętana.

Nie tylko zdjęcia można w ten sposób nosić. Przykładowo, pod każdą stroną jest sekcja „Sprawdź także”. Ją też można porządkować metodą przeciągnij i upuść i co najważniejsze – każda podstrona może mieć tu różne elementy i w różnej kolejności!

Taka wizualna wersja znanego zapewne części z Was pluginu widget logic :) Tyle, że całość napisałem sam zgodnie z wytycznymi klienta.

Inne ciekawe rozwiązanie to wspomniane już wyżej terminy imprez. Każda wycieczka może być zorganizowana wiele razy w roku w różnych datach. Pierwotnie chciałem by klient musiał dla każdego terminu dodać kolejną wycieczkę, którą od poprzedniej różniła by się tylko datą, ale okazało się, że w takim wypadku pracy byłoby więcej niż przy starej wersji strony. Przykładowo „Fotosafari” organizowane jest kilkadziesiąt razy w roku. Dodanie kilkudziesięciu wpisów różniących się jednym polem nie wygląda zbyt wydajnie. Kolejnym utrudnieniem tutaj był fakt, że firma chciała móc przy każdym terminie danej imprezy zaznaczyć, że wszystkie miejsca już zostały wykupione, a nawet nie określać terminu w ogóle – w takim wypadku przy zamawianiu klient sam określał kiedy chce przyjechać na wycieczkę. Cały ten miks miał być trzymany w jakiś sposób w WordPressie i dawać się łatwo zarządzać i porządkować. Udało się, co na przykład możecie zobaczyć na stronie wszystkich wycieczek – imprezy uporządkowane są datami (a gdyby ktoś chciał zmienić sposób porządkowania po długości trwania, nie ma problemu). Jeśli jakiś termin jest już niedostępny informuje o tym odpowiednia ikona. Tabela uwzględnia też imprezy bez określonego terminu i właściciel strony sam decyduje w której części tabeli umieścić taką wycieczkę. Sortować można także po grupie docelowej wycieczki i sposobie jej organizacji. Wypas ;) (btw. po części jak to zrobiłem opisałem w artykule na dev.wpzlecenia).

Powyższy opis jest długi, ale uwierzcie mi, że tylko poruszył malutki skrawek zadań programistycznych jakie przede mną stały. Dość powiedzieć, że całość prac trwała niemal 12 miesięcy! Przeniesienie 1800 subskrybentów newslettera do nowego – a jakże napisanego od podstaw przeze mnie  – systemu opartego na wordpressie, sposoby wybierania elementów do zamieszczenia na stronie głównej, sposoby do wybierania i układania elementów na każdej podstronie (w tym i podstronach generowanych automatycznie jak na przykład na stronach kategorii), umieszczanie elementów na mapach google z podziałem na kategorie tych elementów i możliwością wyświetlania na mapie tylko części z nich, możliwość wyskalowania zdjęć do 12 predefiniowanych kadrów, różnych dla różnych fotografii, także różne atrybuty title dla każdego zdjęcia w zależności gdzie ono jest wyświetlane (inny podpis pojawia się na zdjęciu w galerii i jeszcze inny na tym samym zdjęciu ale przy wycieczce), ukłądanie zdjęć w różnej kolejności, automatyczne menu zakładkowe na górze strony generowane na podstawie kategorii do jakich mogą być przypisane wycieczki… uff. Nadal nie wymieniłem nawet połowy rzeczy :)

Ale chyba się udało, prawda? :)

 

Komentarzy: 11
screenshot2

Od jakiegoś czasu zachwycam się jednokolumnowymi, prostymi w wyglądzie blogami. Przez cały czas w wolnych chwilach rysuję sobie w Gimpie kolejne pomysły na design. Zawsze mi to wychodziło fatalnie, więc nigdy nie wyszło poza konceptualny plik graficzny.

Tym razem jednak pomyślałem, że to może się udać. W sobotę rano zacząłem rysować, dokończyłem już w HTMLu i CSS. W sobotę wieczór zmieniłem w wordpressowy szablon, dziś trochę go jeszcze dopieściłem i oto jest. Jak Wam się podoba?

Miało być skromnie i jest skromnie. Wiem jednak, że wielu rzeczy jeszcze brakuje. Na głównej stronie z listą wpisów przydałby się na końcu treści link do skomentowania. Coś jeszcze, biorąc pod uwagę, że ma być niezbyt kolorowo i pstrokato?

Sama skórka ma zdefiniowanych aż 7 obszarów do wyświetlania widgetów – na wszelki wypadek. Teraz wykorzystuję dwa, jeden widzicie, czy ktoś z Was zgadnie, gdzie jest drugi? ;)

Komentarzy: 18

Microsoft się chwali, że już 14 marca zostanie wydana najnowsza wersja przeglądarki Internet Explorer czyli IE9. A ja się jakoś z tego nie cieszę.

Dziewiątka od dawna była zapowiadana jako ta wersja, która w końcu dogoni konkurencję. Która w końcu nie tylko w pełni obsłuży CSS2 (standard tworzenia stron internetowych stworzony 13 lat temu!) ale także zacznie prawidłowo podchodzić do przynajmniej podstawowych rzeczy z trzeciej wersji tego języka. Tak, obiecano nam – webmasterom koniec z wyrywaniem sobie włosów podczas tworzenia stron. Bo do tej pory jest tak, że gdy tworzysz stronę piszesz jeden kod pod Google Chrome, Mozilla Firefox, Opera, Safari i wszystko inne co wyświetla stronę, a potem piszesz drugi kod dla Internet Explorera. Wraz z IE9 miało się to skończyć.

Czy się skończy? Spójrzcie na tę stronę. Wersja beta dziewiątki obsługuje jak na dzień dzisiejszy 59% standardów.

Czy ktoś wierzy, że w te 4 dni wszystko to, czego nie potrafili poprawić przez kilkanaście lat rozwoju IE poprawią? Skończy się jak zwykle to się kończy w Microsofcie: wielkie obietnice, a na koniec byle co.

Na koniec nie  śmieszny obrazek

Na koniec nie śmieszny obrazek

 

Komentarzy: 3

Sposobów na znalezienie frajera do wykonania  portalu internetowego jest wiele. Dziś jednak ktoś osiągnął w tym mistrzostwo.

Jeśli chcesz aby zbudowano ci (zapewne) złożoną stronę internetową za przysłowiową miskę ryżu, zorganizuj zawody. Kilkadziesiąt osób będzie w prawdziwym wyścigu programować ci serwis, a na koniec zwycięzcy wręczysz statuetkę :)

Nie wierzycie, że ktoś może być tak głupi by spróbować tej metody? No to zobaczcie to ogłoszenie.

Komentarzy: 2

Tym razem jednak może się to skończyć dla nas dobrze, bo atak odbywa się po prostu na polski rynek hostingowy.

Pojawiła się właśnie w Polsce ponoć (ponoć, bo dowiedziałem się o tym dopiero jak się pojawiła) największa firma hostingowa – 1and1.pl. I żeby było o niej głośno przygotowała nie byle jaką promocję. Każdy kto założy konto hostingowe otrzyma 10GB miejsca na pliki, 3000 GB transferu miesięcznego i jedną domenę z końcówką .pl. I co najważniejsze: wszystko to dostajemy za darmo na dwa lata.

Wszystkim od razu pojawiło się w głowie pytanie: gdzie jest haczyk. Wygląda jednak na to, że haczyka nie ma. Rozdawanie za darmo tak szczodrych kont to po prostu forma reklamy, tak aby o firmie było głośno. Jak widać reklama działa, bo od wczoraj czytałem o tej promocji już w kilku miejscach, sam wysłałem info mailem do kilku osób i teraz – a jakże – piszę o tym na blogu, a Wy to czytacie (skorzystacie, powiecie dalej…).

Z promocji oczywiście skorzystałem. Najwyżej za dwa lata z firmą się pożegnam. „Wykupiony” hosting od wczoraj intensywnie testuje i już widzę, że idealny on nie jest (co wcale nie znaczy od razu, że jest zły).

  1. Podczas rejestracji trzeba podać swój numer telefonu, a pole na to wymaga podania numeru kierunkowego. Podanie telefonu jest konieczne i trzeba podać numer prawdziwy, bo w przeciągu godziny dzwoni do nas automat w celu sprawdzenia czy my to my. Jeśli ktoś jednak nie ma telefonu stacjonarnego, nic nie jest jeszcze stracone: w pole numeru kierunkowego trzeba podać trzy pierwsze cyfry naszej komórki, a w dalsze pole pozostałe cyfry.
  2. Serwer nie będzie automatycznie robił kopii zapasowej naszej strony. Musimy dbać o to sami.
  3. Firma kiepsko nas informuje o naszej usłudze. Kompletnie nigdzie – ani w mailu otrzymanym po rejestracji ani w panelu – nie ma informacji o tym, jaki jest adres ftp do naszego serwera. Na  szczęście intuicyjne zgadywanie działa (adres jest taki sam, jak adres www, bez żadnych prefiksów).
  4. Dla firmy jesteśmy numerkiem, a właściwie numerkami. O ile we wszystkich chyba innych firmach wszędzie (do panelu, do ftp, do bazy) loguje się wybranym przez siebie loginem, to w 1and1.pl loginem jest z góry przydzielony numer. Bardzo długi i co najgorsze numer jest inny do panelu, inny do ftp inny do mysql. Fatalne rozwiązanie. Nazwa bazy danych też jest jakimś dziwnym długim zbitkiem znaków.
  5. O ile hosting daje nam 10GB miejsca, to na bazę danych przeznaczone jest tylko 100MB. Malusieńko i czuje, że za dwa lata będzie to już mocno przeszkadzało.
  6. Obejrzałem jak wygląda 1&1 w innych krajach: ceny nie powalają, więc można się spodziewać, że za dwa lata za przedłużenie będziemy sporo płacić. Mam jednak nadzieję, że to tylko zmobilizuje mnie do rozwinięcia w dwa lata postawionego tam serwisu tak, że opłata za  hosting i tak będzie dla mnie niezauważalna ;)
  7. Strona 1and1.pl działa kiepsko. Jeszcze wczoraj nie działała w ogóle, jeśli przed adresem nie dałem prefiksu ‘www.’. Po zalogowaniu do panelu administracyjnego za każdym razem dostaję informację, że wspierają jedynie przeglądarkę Firefox. Tymczasem już od ponad roku używam Google Chrome (i mimo informacji jaką serwuje mi strona, Chrome bardzo dobrze sobie z panelem chyba radzi).
  8. I co najważniejsze! Na mapie siedzib firmy 1and1 Warszawa zaznaczona jest jako Warschau! ;) Niemcy znów atakują Polskę ;)
Komentarzy: 18

Ale mnie trzepło :)

W poniedziałek z wielką ulgą wysłałem maila, że skończyłem stronę nad którą głowiłem się przez ostatnie ponad dwa miesiące i – choć wcześniej nic a nic na to nie wskazywało – w zaledwie trzy godziny wylądowałem w łóżku trzęsąc się i oblewając potem. Zdecydowanie choroba była odpychana koniecznością skończenia zadania, a gdy te zostało już skończone, zupełnie jakby ktoś przekłuł balon. Bum i leżę.

We wtorek jedyne co mi się udało to dodreptać (wciąż trzęsąc się) do sklepu spożywczego i apteki i wrócić do łóżka. Musiałem dziwnie wyglądać, bo w sklepie ekspedientki równie dziwnie na mnie patrzyły.

Dopiero w środę dreszcze i poty w miarę ustąpiły i zacząłem widzieć na oczy. Do teraz została mi lekka gorączka i kaszel i już będzie ok :)

* * *

Wam też, jak czytacie o tych moich dreszczach przyszła na myśl, że to może być malaria? ;) Przyznam się, że we wtorek w nocy zacząłem sobie liczyć ile to czasu minęło od mojego ostatniego dnia w Afryce. Wyszło mi coś koło półtorej roku. Granicą ryzyka jest rok. Ale dlaczego nie miałbym być wyjątkiem? Objawy wypisz wymaluj jakby pasują. W łazience nawet sam sobie zajrzałem za powieki. Niestety lub stety nic nie zauważyłem. Nawet nie wiem czego miałemm szukać :)

A nawet jak nie malaria z Afryki to – nie wiem czy wspominałem – na malarię można zachorować także w Polsce. Ryzyko jest mikroskopijne ale jest. Lekarze uznają, że obszary zagrożone to te w promieniu 100km od lotnisk międzynarodowych. Do Warszawy mam 200km, ale dlaczego znowu nie miałbym być wyjątkiem? Gdzie ja trzymam te ciągle nie „zjedzone” malarone? Jak to było? Profilaktycznie jedna tabletka, a gdy jesteś chory – dwie?

* * *

Oczywiście pomimo tych wszystkich podejrzeń dobrze wiedziałem, że się sam wkręcam. Dopadło mnie jakieś zwykłe przeziębienie, ponoć jakiś wirus szaleje. To jak z totolotkiem: wiesz, że na wygraną masz mikroskopijne szanse, ale im dłużej o tym myślisz, tym bardziej wierzysz, że to możesz być właśnie ty. Ja piszę co chwila o malarii i polecam strony o malarii, im dłużej o tym myślę, zaczynam się rozglądać czy w Polsce na pewno jestem bezpieczny :) Jestem, ale… ;)

* * *

Dobra, wracam do siebie, oczywiście kilkudniowe leżenie zaowocowało zapchaną skrzynką mailową i nagromadzeniem roboty, więc trzeba będzie to jakoś rozładować. W międzyczasie jednak jak obiecałem wyrzuce ten design i zainstaluje thematica.

p.s. stroną zrobioną się jeszcze nie chwalę, ale przyjdzie na to czas :)

Dodaj komentarz

W sieci zapanowała szarość. Jeśli jesteś webmasterem i też chcesz okazać szacunek wobec zmarłych na swojej stronie, jednak nie chcesz na stałe zmieniać wszystkich obrazków na stronie na odcienie szarości, znalazłem dwulinijkowy sposób w javascript pozwalający na żywo zamienić wszystkie obrazki ze znacznika <img> tak aby były pozbawione kolorów.

Po kolei.

Wchodzimy na stronę pixastic i pobieramy skrypt. Na stronie jest fajny konfigurator, który pozwala pobrać tylko co nam potrzebne. Jako, że niemal każdy chyba na wordpressie ma aukatywnione jQuery, polecam zaznaczyć opcje ‘Pixastic Core’, ‘jQuery plugin’ i ‘Desaturate’.

Pobrany plik umieść na serwerze i w nagłówku strony podlinkuj go (zakładam, że masz podłączone także jQuery).

W stopce strony dodaj skrypt js:

$d = jQuery.noConflict;
$d("img").pixastic("desaturate");

I to wszystko.

Oczywiście skrypt nie załatwia wszystkiego. Nadal pozostaną kolory czcionek czy tła zdefiniowane w CSS, także obrazki tła nie zostaną podmienione.

Jak działa skrypt możecie zobaczyć na stronie HR Standard

Komentarzy: 2

Ten wpis jest kolejnym moim chwaleniem się jaką stronę wykonałem na bazie WordPressa, a zarazem chcę tutaj pokazać jak bardzo można zmodyfikować WordPressa (na pierwszy rzut oka nie widać, że to właśnie WordPress) i pokazać praktyczne zastosowanie dziedziczenia szablonów. Powiem szczerze, że jestem dumny z tego, co mi tutaj wyszło :)

Tutaj czyli na stronie Młodzi Twórcy wykonanej dla Urzędu Miejskiego w Białymstoku. Białystok ma program stypendialny dla ludzi uzdolnionych w różnych dziedzinach (ma zapewne jak i inne miasta, ale tylko Białystok jak widać chce się tym chwalić). Program działa już od jakiegoś czasu, ale teraz przyszła pora na stworzenie dla niego strony internetowej. I tutaj pojawiam się ja (jako podwykonawca dla  Man With The Plan).

Powyżej obrazek przedstawiający stronę główną. Wszystkie zrzuty ekranu w tym wpisie są klikalne więc jeśli chcecie, śmiało przechodźcie aby zobaczyć jak to wygląda u Was :)

Jak widać nie ma tutaj typowo blogowego układu. Mnie to nie dziwi, bo WordPress coraz bardziej staje się zwykłym CMSem zdolnym do tworzenia każdego rodzaju stron (choć blogi się w nim robi najłatwiej). Mechanizm bloga wykorzystałem tutaj w dziale Aktualności. Reszta to coś, co w panelu administracyjnym WordPressa nazywa się po prostu Strony.

Ale jakie strony! Poklikajcie na odnośniki w górnym panelu, a przekonacie się, że praktycznie każda z nich wygląda inaczej. Było to nie lada wyzwaniem ale się udało. Inny układ  kolumn na poszczególnych podstronach, co innego w sidebarach w zależności  od tego na jakiej stronie się właśnie znajdujemy, „podświetlenie” dla pozycji w górnym menu nie tylko gdy jesteśmy na tej właśnie stronie, ale także na stronie potomnej danej podstrony.

Nie było to łatwe, bo musiałem zrobić to jak najbardziej user friendly. Założyliśmy, że osoby w urzędzie nie znają WordPressa, więc sztuczki z Custom Fields, zastosowanie widget logic, custom themes trzeba unikać jak najbardziej. Osoba dodająca treści ma po prostu dodać kolejną stronę, określić, że jest ona „dzieckiem” takiej czy innej strony, a WordPress i jego funkcje same mają rozpoznać jaką właśnie stronę internauta chce wyświetlić i pokazać ją jak na obrazku powyżej (tak, to jest zwykła strona w WordPressie, stworzona we wbudwanym w nim edytorze stron; to ja, a nie osoba wprowadzająca tekst zadbałem by nagłówki miały inny wygląd, by każdy akapit był właściwie oddzielnym divem, a zawarty w nim odnośnik do pliku stał się przyciskiem wyrównanym do prawej) lub na przykład jak ta strona:

Jak widać wyżej mamy trzy sekcje: opis stypendysty, jego (czy w tym wypadku – jej) program stypendium i jego/jej zdjęcia. Tu także całość została zrobiona tak, aby pracownik urzędu nie musiał niczym się martwić: musi jedynie dodać treść, dodać zdjęcia (działa także dodawanie filmów), a to ja musiałem rozpoznać gdzie zaczyna się program stypendium czy właśnie zdjęcia lub filmy (i sprawić by miały inne tło). Co więcej powstały strony grupujące: gdy pracownik urzędu doda stronę konkretnego stypendysty, automatycznie pojawi się ona na stronie ich grupującej rocznikami:

Udało się? Przy „odrobinie” znajomości WordPressa i  umiejętności pisania dla niego funkcji, zabawy w dziedziczenie tematów graficznych, efekt jest chyba całkiem niezły, nie prawda? ;)

* * *

A może Ty też chcesz mieć taką stronę, szukasz kogoś kto zajmie się Twoim blogiem, albo znasz kogoś z takimi potrzebami? Zajrzyj na stronę O mnie i odezwij się do mnie w jeden z podanych tam sposobów, a na pewno uda nam sie razem wyczarować coś fajnego :)

Komentarzy: 5

Dziś rano w telewizorni widziałem reklamę społecznej akcji ratowania fok szarych organizowaną przez WWF Polska. Może więc się kolejny raz pochwalę zrobioną już jakiś czas temu stroną. Choć „pochwalę” to za duże słowo, bo nic Wam raczej pokazać nie mogę :) Musicie mi wierzyć na słowo, że to co tu piszę, to prawda.

Blog wolontariuszy WWF, tak wyglądał projekt graficzny

Blog wolontariuszy WWF, tak wyglądał projekt graficzny

Jakoś we wrześniu ktoś szukał kogoś, kto by znał się co nieco na WordPressie, więc się zgłosiłem. Okazało się, że trzeba uruchomić blog towarzyszący społecznej akcji ratowania fok w Polsce. Coś w rodzaju małego serwisu społecznościowego, w której osoby biorące udział w ratowaniu fok będą mogli się zarejestrować, blogować (stąd więc od razu przyszedł pomysł WordPressa), dodać swoje zdjęcia z pracy i wrzucić filmy. Napisać kilka słów o sobie, zaznaczyć swoją pozycję na mapie Google Maps tak aby, gdy ktoś szuka pomocy przy fokach w okolicy Helu mógł szybko odnaleźć patrolowiczów w pobliżu.

Strona jest już wykonana, działa od dawna (i z tego co widzę działa bez zarzutu, bo nikt nie zgłasza mi żadnych problemów). Niestety linka do strony podawać nie będę, bo tylko zalogowani ludzie w WWF mogą ją zobaczyć. Ale i tak się chwalę ;)

Powyżej znajduje się design na bazie jakiego miałem wykonać stronę. Praca na początku była prosta: pociąć wszystko do HTML zgodnego z jak największą ilością przeglądarek, zrobić z tego szablon do WordPressa. Potem zaczęły się schody.

Zleceniodawca wymagał bardzo precyzyjnego dopasowania się do zaleceń. Wskutek tego najpierw sporo czasu spędziłem na poszukiwaniu odpowiednich pluginów, by ostatecznie przegonać się, że każdemu coś brakuje lub robi to w nie taki sposób, jak było to opisane w zleceniu. I wtedy rozpisałem się podczas pisania kodu nowych pluginów, ściśle dopasowanych do wymagań. (Pamiętacie moje wpisy dotyczące publikacji nowych wtyczek i tutoriale jak wtyczki się pisze? To wtedy mniej więcej robiłem tą stronę).

Pluginów napisanych było kilka. Wspomnę o dwóch.

Jeden z nich to Youtube Add Video, który zamieściłem publicznie w internecie, tak by i inni mogli z niego skorzystać i przy okazji opisałem jak powstawał. W dostępnych pluginach brakowało możliwości określenia kto dodał film (nic dziwnego, przeważnie blog prowadzi jedna osoba, a tutaj WordPress działał niemal jako platforma blogowa) i możliwości wyciągnięcia informacji o ostatnio dodanym filmie i umieszczenia jej w sidebarze. Napisanie takiego pluginu okazało się wykonalne :)

Drugi plugin aż szkoda, że nie udostępniłem go nigdzie bo jestem z niego dumny (teraz nie mam już niestety dostępu do jego kodu). Plugin bazował na Google Maps API  i pozwałał:

  • wyświetlić mapę w sidebarze
  • pokazać zaznaczonych na niej wszystkich wolontariuszy lub konkretnego (jeśli akurat przeglądaliśmy stronę użytkownika)
  • w panelu administracyjnym pozwalał użytkownikowi dodać swoją pozycję na mapie.

Plugin działa wyśmienicie, a przynajmniej działał w momencie oddawania strony zleceniodawcy ;) Ale jak wspomniałem, żadnych reklamacji nie dostałem.

* * *

Było jeszcze kilka innych wtyczek, ale zdecydowanie mniejszych i mniej ciekawych. Z projektu jestem dość zadowolony bo rozruszał mnie po długien przerwie, od czasu gdy wykonałem stronę WildPoland. Obecnie  zleceń mam całkiem sporo, w poprzednim tygodniu kilku osobom musiałem odmówić podjęcia się zadania, bo zwyczajnie nie wyrabiałem się w 24 godzinach na dobę :) I teraz gdy to piszę, jestem właśnie w czasie krótkiej przerwy w programowaniu kolejnego wordpressowego wdrożenia.

Nie zmienia to faktu, że jeśli ktoś z Was właśnie potrzebuje uruchomić jakąś stronę i wierzy, że WordPress jako CMS sprawdzi się tutaj bardzo dobrze (w tym tygodniu to właśnie WordPress zwyciężył w konkursie na najlepszy system CMS open source), może śmiało do mnie pisać. Obecnie wykonywane przeze mnie zadania prędzej czy później będą musiały się skończyć i chętnie podejmę się kolejnych wyzwań. :)

Dodaj komentarz

Takim czymś to aż grzech się nie pochwalić :) Co prawda osobiście, własnym ciałem w Afryce się (jeszcze) nie znalazłem ale z dumą mogę powiedzieć, że stworzyłem świetną (świetną, bo moją) stronę (ba! portal) dla okołoafrykańskiej organizacji.

afrix

Jakoś pod koniec września zapytano mnie, czy podjąłbym się karkołomnego wyzwania stworzenia strony integrującej mniejszości narodowe (głównie Afrykańczyków) zamieszkujące Europę z Europejczykami. Nic wielkiego: strona w kilku wersjach językowych, z opcją logowania, każdy może sobie założyć konto, każdy może na stronie prowadzić swojego bloga, opisać siebie w swoim profilu, może dodać zdjęcia, dodać filmy, ogłoszenia, pisać na forum, ustawić jakby status (gdy byłem o to poproszony śledzik jeszcze nie istniał więc tak tego nie nazwano)… Do tego mechanizm wysyłania wewnętrznych wiadomości, komunikator między użytkownikami (tym bardziej nikt nie słyszał jeszcze o NKtalk, więc i tego tak nie nazwano), możliwość ustawiania poziomu dostępu do danych w profilu (na poziomie całego profilu, jak i na poziomie poszczególnych danych). Możliwość pokazania się na mapie, możliwość dodawania się do znajomych, możliwość wyszukiwania się po kraju zamieszkania, pochodzenia, płci… Możliwość, możliwość, …

Zapytałem: „Czyli chcecie abym zrobił taką jakby kolejną Naszą Klasę, tylko że dla Afrykańczyków i to zrobił to w pojedynke?”

Dostałem odpowiedź: „Tak. I masz na to 30 dni czasu”

Już miałem odmówić, ale pomyślałem o racie za samochód, racie za pralkę i kredycie hipotecznym. Jako, że nie spłacam żadnych rat i tym bardziej hipoteki nie mam, argumenty te do mnie trafiły i nadl nie byłem zdecydowany. Tak naprawdę nie wiem o czym bardziej pomyślałem: o możliwości aby kolejny raz zrobić coś dla Afryki, o niemożliwym wyzwaniu stojącym przede mną (prawdę mówiąc im zadanie które staje przede mną brzmi bardziej niewykonalnie, tym większa jest szansa, że za nie się wezmę), czy o tej kupie szmalu jaką mi za to obiecano ;)

W każdym bądź razie, Proszę Państwa – oto Afrix!

Nie wszystko tam jeszcze działa z rzeczy założonych (ale zdecydowana większość już tak), serwis ma błędy (jeśli ktoś zauważy jakieś niedziałające linki czy inne bugi, napiszcie o tym do mnie w prywatnej wiadomości na Afriksie) ale jeśli uznać przyklejony do logo serwisu napis „beta” stwierdzam, że dzieło jest już zdatne do użytku. Zapraszam do oglądania, testowania i przede wszystkim zakładania tam sobie kont. Celem jest integracja nas – Europejczyków – z Afrykańczykami. Już niedługo serwis będzie poszukiwał wolontariuszy do pracy przy tematach integracyjnych, mam nadzieję, że pozwoli także nawiązać mnóstwo znajomości międzynarodowych :)

* * *

A jak się tworzy taki serwis w tak krótkim czasie? Co prawda termin został przekroczony, bo całość miało ruszyć 4 października, a ruszyło w ostatni czwartek, ale udało się dzięki wykorzystaniu już dostepnego oprogramowania.  Pierwsze założenie było, że wszystko ruszy na BuddyPressie czyli społecznościowej wersji WordPressa, jednak niestety ta ma zbyt mało funkcji i po przeczytaniu dziesiątków listów na tamtejszym forum, niektóre rzeczy jak na razie są nie do ruszenia. Zdecydowaliśmy się na płatny SocialEngine. Mateusz Kasprzak zajął się projektowaniem designu, ja natomiast w między czasie wnikał w zawiłości nowego dla mnie silnika i sposobu działania szablonów smarty (które do tej pory znałem tylko w teorii). Czasu tego miałem całkiem sporo, bo projektowanie zeszło do 20. któregoś października :) Po zaprojektowaniu całość przerobiłem na szablon smarty i… przerobiłem jeszcze raz. Pierwszy design nie spodobał się konsultowanym Afrykańczykom. Podobno był „za mało w stylu nigeryjskiego reggae” (jeśli ktoś nie wie co to jest – my też wtedy nie wiedzieliśmy – to niech zajrzy na stronę: to jest podobno nigeryjskie raggae :) ).

Potem była chwila luzu, gdy wydawało mi się, że wszystko jest już dopięte na ostatni guzik, a przynajmniej nikt nie ma żadnych większych zastrzeżeń. Okazało się jednak, że ciężkie testy serwis zaczął przechodzić w przeddzień oficjalnego otwarcia (oficjalnego, bo brali w nim udział ważne osobistości media) i wtedy zostałem zasypany toną listów na skrzynkę :) W ostatnią środę i czwartek pracowałem od 8 rano do północy. Ale udało się.

Teraz pozostało dodać kilka rzeczy których jeszcze nie ma, a fajnie by były i naprawiać na bieżąco wykrywane błędy. Ostatecznie po całej przeprawie z SocialEngine mogę stwierdzić, że fakt iż obecna jego wersja to 3.x jest jedynie zabiegiem marketingowym. :( Mnóstwo błędów, braku konsekwencji w tworzeniu i kompletny brak dokumentacji (społeczność programistów wokoło SE jest nastawiona na pomoc, ale jedynie za opłatą, zatem próżno szukać rozwiązań problemów czy porad po internecie; można je kupić jedynie w postaci pluginów czy usług) . Mimo wszystko, a może właśnie dlatego, jestem dumny, że to ma jakieś ręce i nogi :)

Komentarzy: 2