30
05
09
Poprawiamy szablon do WordPressa
W dzisiejszym artykule przedstawię studium przypadku zmiany szablonu na blogu WordPress. Dobry szablon to ważna rzecz, bo blog powinien być ciekawy, ale i ładnie wyglądać. Szablon powinien być więc atrakcyjny i czytelny. A oprócz tego — musi być zoptymalizowany pod kątem zarabiania. W artykule tym opiszę na przykładzie, jakich zmian w szablonach dokonuję po ich instalacji.
Zanim zaczniesz grzebać w plikach szablonu upewnij się, że masz gdzieś kopię zapasową wszystkich jego plików. Ustaw prawa dostępu do plików szablonu na takie, które pozwolą na ich edycję z poziomu panelu administracyjnego WordPressa — chyba prawa 666 będą odpowiednie. No i upewnij się, że wprowadzanie zmian w szablonie jest dozwolone przez autora.
Na początek zrzut skórki zaraz po zainstalowaniu. 🙂
Jak widać, jest ona przygotowana domyślnie pod reklamy AdSense (dwa boksy w menu) i bannerki 125×125 pikseli. To też trzeba będzie poprawić. Ale zacznijmy od rzeczy najważniejszych.
Tłumaczenie
Najważniejsze z punktu widzenia czytelnika. Skórka musi być przetłumaczona na język polski a często autorzy są na tyle leniwi, że wbijają tam napisy na sztywno, zamiast korzystać z funkcji WordPressa, która tłumaczy je automatycznie. Trzeba więc przejrzeć pliki szablonu (w szczególności index.php i sidebar.php) pod kątem takich śmieci. Zauważone teksty po angielsku poprawić.
Ten punkt oczywiście nie dotyczy blogów, które kierowane są do anglojęzycznego czytelnika. 😉
Optymalizacja linków
Bez względu na to, ile czasu i wysiłku poświęcasz na pozycjonowanie bloga, linki wychodzące trzeba koniecznie zoptymalizować. Mam tu na myśli po pierwsze ograniczenie ich liczby do niezbędnego minimum i dołożenie atrybutu rel=”nofollow” gdzie tylko się da. Takie podejście zapewni nieco lepsze traktowanie Twojego bloga przez wyszukiwarki.
Ja zawsze zaczynam od poprawek sekcji META. Domyślnie wstawiane są tam często zupełnie niepotrzebne linki do stron WordPress.org, sprawdzacza poprawności kodu HTML i CSS. Z punktu widzenia czytelnik są bezużyteczne — zatem są przeznaczone do wycięcia bez zbędnego zastanawiania się nad tym. Ja wywalam też linki do logowania i administracji, bo zawsze wbijam adres z /wp-admin/ na końcu z palca w pasek adresu przeglądarki. Ponieważ na blogach umożliwiam komentowanie osobom niezarejestrowanym, te linki nie są potrzebne też czytelnikom. Ich wywalenie oszczędza kolejne dwa linki wychodzące. W następnej kolejności dodaję atrybut rel=”nofollow” do linków prowadzących do kanałów RSS — one wcale nie muszą być indeksowane przez wyszukiwarki, ale czytelnicy powinni móc z nich skorzystać.
Jeśli w szablonie są jakieś linki do stron autora albo katalogu szablonów, wywalam je lub dodaję do nich rel=”nofollow”. Zależnie od licencji, na jakiej udostępniany jest szablon. Czytelnikowi bloga nie są one potrzebne do szczęścia i służą tylko do pozycjonowania stron autora albo sponsorów (i ew. katalogu szablonów). Tu akurat stopka była zakodowana, więc odpuściłem sobie na razie zmiany w jej obrębie.
Na drugim screenshocie (na końcu wpisu) linki z rel=”nofollow” są widoczne jako przekreślone. 🙂
Przenosiny reklam
W przypadku tego konkretnego bloga nie liczę za bardzo na reklamodawców z bannerami 125×125 px, więc tę funkcję wywaliłem na samym początku. Tak samo zmieniłem ułożenie reklam AdSense — domyślnie dwóch na początku i końcu menu (dolna na screenshocie nie jest widoczna — zamiast niej jest tylko puste pole).
Stosowany przeze mnie najczęściej układ reklam AdSense zakłada wstawienie dużej prostokątnej jednostki na początek wpisu i ewentualnie kolejnych w jego treści. Dlatego na potrzeby tego bloga wygenerowałem dwa kody jednostek — jedną 250×250 do wyświetlania na początku pierwszej zajawki i 336×280 do wyświetlania na początku pojedynczych wpisów. Prosta instrukcja warunkowa z wykorzystaniem licznika w PHP załatwia wyświetlanie boksu tylko w pierwszej zajawce. Zajawki są tu akurat krótkie, więc wybrałem małą jednostkę reklamową.
Reklamy wstawiane do środka wpisów wyświetlane są za pomocą odpowiedniej wtyczki, przy zmianie szablonu trzeba tylko podmienić kod jednostek w przypadku zmiany schematu kolorów.
Dalsza optymalizacja pod kątem AdSense
Jeśli masz kłopoty z dopasowaniem treści reklam, edycja szablonu to dobry moment na zastosowanie section targetingu. Ja sobie to zazwyczaj odpuszczam.
Za to zawsze poprawiam w arkuszu styli sposób wyświetlania linków. Linki w reklamach AdSense są podkreślone i nie zmieniają koloru po najechaniu. Trzeba więc tak samo ustawić zwykłe linki na blogu — zwłaszcza te w pasku bocznym i treści wpisów. Aby dodatkowo podnieść klikalność, ustawiam je w taki sposób:
- linki mają być podkreślone,
- po najechaniu — bez zmian,
- po kliknięciu / odwiedzeniu linkowanej strony — mają mieć inny kolor i wyłączone podkreślenie.
Po kilku chwilach oglądania takich linków czytelnik traktuje wszystkie podkreślone jako zwykłe nieodwiedzone linki. 😉
A oto jak wygląda blog po zakończeniu opisanych powyżej zmian.
Inne zmiany
Jeśli blog jest zgłoszony do narzędzi dla webmasterów i zweryfikowany za pomocą kodu wklejonego do sekcji HEAD, trzeba o ten fragment uzupełnić nowy szablon.
Jeśli dokonałeś (dokonałaś) jakiś głębszych zmian w strukturze szablonu, np. wstawiając różne reklamy zależnie od kategorii wpisu, musisz kod przekleić do nowego szablonu.
A co Ty zmieniasz na swoim blogu po wstawieniu nowego szablonu?
Wpisy powiązane tematycznie:11 komentarzy do artykułu “Poprawiamy szablon do WordPressa”
Pozostaw komentarz
Pamiętaj tylko proszę o polityce komentarzy! Komentarze służą do wyrażania opinii na temat opublikowanego tekstu, albo zadawania pytań jego dotyczących. Nie służą do reklamowania własnych stron ani zadawania pytań nie związanych z tematem wpisu. Jeśli masz pytanie, zadaj je na forum o zarabianiu na blogach albo napisz do mnie e-maila.
To co zawsze robię, to ukrycie linków w stylu „Read more” 🙂
Dalej – zawsze mi coś nie pasuje w sidebarze 🙂 Albo kolejność albo układ…
Często też pole dot. komentarzy i komentowania mnie nie satysfakcjonuje więc muszę je poprzerabiać.
I chyba zawsze usuwam spis miesięcy (archiwum), od tego jest podstrona „Wszystkie wpisy” or sth.
A to „Main Menu” sobie jako rodzynkę zostawiłeś ? 😀
W końcu mnie „zmusiłeś” tym wpisem do wrzucenia AS i dostosowania szablonu 🙂
Oczywiście trzeba było w AS wybrać odpowiednią czcionkę (w moim przypadku Arial).
W szablonie wystarczyło, że zwiększyłem czcionkę z 11px do 12px i dodałem do linków wyboldowanie 🙂
@Jacek: te linki powinny być widoczne chyba tylko wtedy, gdy wyświetlasz na głównej i w archiwach same zajawki, więc po co je usuwać? O sidebarze nie pisałem, bo to moim zdaniem bardziej kwestia upodobań. Ale rzeczywiście czasem trzeba go dostosować do wymagań. A do formularza od komentarzy dodaję linka do polityki komentarzy, żeby potem móc bez obaw kasować stamtąd spam. 🙂
Jeśli chodzi o Twoje reklamy AdSense, proponuję ustawić kolor URLa na kolor tekstu, bo za bardzo się wyróżnia — jeszcze ktoś wpadnie na pomysł, by go wklepać ręcznie do paska adresu przeglądarki. 😉
@Łukasz: przeoczyłem — to zazwyczaj zamieniam na coś w rodzaju „ważne informacje”, bo jako strony statyczne wstawiam najczęściej tylko dane kontaktowe i regulamin korzystania.
@Krzysiek: linki w stylu Read more usuwam albo nadaję im atrybut rel=”nofollow” np. dzięki wtyczce Tweak do WP.
Zapobiega to podawaniu Google innego adresu (linka), do tej samej treści. Tak samo z linkami do komentarzy.
Kurde… ustawiłem urle w kolorze tekstu właśnie i widzę, że skrypt tego nie „złapał” :/
Dobry post! Fajnie, że idziesz w tym kierunku.
Z tego co mi się wydaje to trzeba ustawić dostęp do plików na 777 🙂
@Menedżer: stwierdziłem, że chyba pora zmienić proporcje wpisów autorskich do odpowiedzi na pytania czytelników, które się od dłuższego czasu w zasadzie powtarzają.
@Jakub: o ile dobrze pamiętam, 777 to read/write/execute, tu powinno wystarczyć read/write, czyli 666.
Właśnie sobie uświadomiłem, że trzeba było jeszcze dodać kod Google Analytics do stopki. 😉
[…] Poprawiamy szablon do WordPressa […]