+ MENY
2011 Jan 24
4

Rätt H1 på inlägg och sidor i WordPress

Jag fick en fråga av en webbkollega hur man kan modifiera ett befintligt tema så att H1 – strukturen blir rätt inställd ur ett sökmotorperspektiv. Men istället för att försöka förklara via e-post kommer därmed denna Tutorial, kanske kan det vara till värde även för andra.

Men WordPress är väl perfekt för SEO?!

Google älskar wordpress brukar man ju höra. Och det stämmer ju verkligen att grundstrukturen räcker mer än väl för att lyckas med sin sökmotoroptimering och är H1 strukturen mindre gynnsamt inställd för en sajt så är detta inte wordpress fel utan felet ligger i uppbyggnaden av temat. Så vad är det då som ibland blir fel ur sökmotorperspektiv när man bygger ett tema?

Det jag har sett angående detta är att man ofta sätter rubriken eller bloggbeskrivningen på temat som H1:a och det är ju bra så länge det endast är startsidan man vill sökmotoroptimera. När man sedan går in på en sida, inlägg eller kategori så står fortfarande beskrivning eller namnet som h1a och det är ju mindre bra för onpageoptimeringen. Istället vill man ha rubriken på själva inlägget, sidan eller kategorinamnet som h1:a. Det är detta som inte alla teman stödjer och jag kan delvis förstå det. Det krävs nämligen lite mer kunskap om vilka inbyggda funktioner som finns i wordpress och en och annan if sats för att få detta rätt.

Men här kommer jag ändå att förklara en framkomlig väg att ställa in detta utan att behöva byta tema. Vill du slippa grotta kod kan du ju alltid leta upp ett tema som har detta rätt istället eller använda det tema som jag själv byggt som du laddar ner här.

I denna guide visar jag hur man kan bygga om default temat (kubrik) så att detta för en bättre sökmotoroptimering för wordpress. Det bör finnas många likheter med detta tema och många av de teman som finns ute på gratismarknaden.

Steg 1 – Få rätt h1 i Header.php

Detta första vi skall göra är att ställa in filen header.php. Lämpligt är att man alltid gör detta i på sin localhost och testar först, när man får allt att fungera laddar man upp det på servern. Jag skulle aldrig göra detta utan en backup i vilket fall som helst. I header.php brukar det se ut enligt nedanstående bild i koden. I detta fall hämtar koden alltså från temat default.

Rätt H1 till WordPress

Här ser vi att taggen h1 ligger runt bloggnamnet och att bloggbeskrivningen är bara en vanlig textsträng. Vi har inget h attribut runt just beskrivningen. Så här ser det ut i rätt många teman och detta medför att det blir en bra optimering för just startsidan men inte för övriga sidor. Vi vill nu istället ändra detta så att bloggbeskrivningen endast är h1:a på startsidan.

Taktiken är att lägga till två if satser i header.php som känner av vilken sida vi befinner oss på och ställer in h1 utifrån detta:

  • Funktionen is_home() känner av att vi är på startsidan och i denna if sats lägger vi h1:an i bloggbeskrivningen.
  • Funktionerna is_single() || is_page() || is_archive() känner av om vi är på ett inlägg, en sida eller på en kategorisida och i denna if sats lägger vi varken bloggbeskrivning eller bloggnamn som h1:a. I det här fallet lägger vi dem istället bloggnamnet som h5:a men bloggbeskrivningen låter vi vara som den är.

Hela koden med tillhörande If satser blir nu följande:

<div id="headerimg">
 <?php if ( is_home() ) { ?><!--aktiveras på startsidan-->
    <h1><a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a></h1>
    <div><?php bloginfo('description'); ?></div>
 <?php } ?>

 <?php if (is_single() || is_page() || is_archive() ) { ?><!--aktiveras på inlägg,sidor och arkivsidor-->
    <h5><a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a></h5>
    <div><?php bloginfo('description'); ?></div>
 <?php } ?>
 </div>

Några tankar om stilmallen:

  • För att temat skulle se exakt likadant ut var jag också tvungen att styla en h5:a så att denna såg exakt likadan ut som en h1:a.
  • Detta är faktiskt ganska enkelt. Man gör bara så att man kopierar alla div klasser för h1:an och byter namnet till h5.

Steg 2 – Få rätt h1 i Single.php, page.php och archive.php

Nästa steg är nu att ställa in inläggsrubriken rätt i single.php, page.php och archive.php. Eftersom den skall fungera precis på samma sätt i alla dessa tre filer visar jag det här endast för single.php så kan man överföra resonemanget till övriga filer sedan. Grundtanken här är följande:

  • I If ( is_home() ) lägger vi inläggsrubriker som h2, då skall ju istället bloggbeskrivningen vara h1:a
  • I if (is_single() || is_page() || is_archive() ) lägger vi inläggsrubriken som h1:a då det är denna vi vill optimera mot här.

Hela koden här som vi alltså lägger in i inläggsflödet blir följande:

<?php if ( is_home() ) { ?><!--aktiveras på startsidan-->
   <h2><?php the_title(); ?></h2>
<?php } ?>

<?php if (is_single() || is_page() || is_archive() ) { ?><!--aktiveras på inlägg,sidor och arkivsidor-->
   <h1><?php the_title(); ?></h1>
<?php } ?>

Några tankar om css:

  • Här fick man också göra så att man fick göra en ny css klass som vi kallade .post h1 och där lägger man in rätt stilregler så att denna h1:a inte ser ut som den i headern.

Steg 3 – Kontrollera h1 strukturen stämmer

Visserligen är det viktigt att kontrollera att koden fungerar under tiden du jobbar med den men på slutet är det förstås rekommenderat att använda firebug eller något annat bra verktyg för att se till att allt blev rätt.

Om du nu har kommit till slutet av detta kanske alltför kodnördiga inlägg så hoppas jag förstås att det har hjälpt dig att modifiera ett befintligt tema. Det går att ställa frågor i kommentarerna om något är oklart

TJÄNA PENGAR PÅ NÄTET - REKOMMENDERADE AFFILIATENÄTVERK:
Nätverk Beskrivning
Adtraction Har ett stort utbud med stora aktörer och ett mycket enkelt användargränssnitt.
Adrecord Har väldigt många annonsörer i väldigt många olika kategorier, det finns säkert något som passar din blogg eller hemsida.

4 Kommentarer

  1. Nabil skriver:

    Kul att någon mer än jag upptäckt det här! Gör den ändringen på alla mina affiliatesajter. Dock inte på samma sätt med is_home() och dylikt utan på ett mer… idiotsäkert sätt, så att säga. Huvudsaken är ju att det blir rätt i slutändan! :)

    Ett annat liknande tips jag kan ge folk är att inte använda sig av H2 och H3 som typ, rubriker, i ens sidebar. Inte för att denna blogg optimerar mot något speciellt sökord, men i din sidebar ligger ordet twitter i en H3:a.

    Kanske inte gör så mycket. Men om man på en affiliatesajt har ordet ”kategorier” som en H2:a så är mitt råd att byta ut H2 mot H6.

    In på webbhotellet oderlands blogg för en mer utförlig guide av vad jag menar. Går inte att förklara allt i en kommentar :)

  2. websimon skriver:

    Hej Nabil! Tack för dessa tips, nä på denna blogg bryr jag mig inte så mycket om vilka rubriker hit och dit det är i sidebaren men på mina affesajter brukar jag faktiskt alltid försöka fundera ut det bästa sättet att placera innehåll och taggar i sidebars!

    Ha det gött!

    P.S din kommentar fastnade i akismet och jag hittade den ganska sent för godkännande om du undrar varför den inte dök upp.. D.S

  3. Johannes skriver:

    Bra att nån tar upp det här. Har själv lackat ur flera gånger när den omtalade sökmotoroptimeringen för WordPress inte ens har H1an optimerad.

    Det man också kan göra är att gå in på archives.php/categories.php och ändra där men det visste du nog.

    Det Nabil säger är visserligen sant men i alla fall jag brukar byta ut widget-titles mot något relevant sökord. Tex ”Allt om djur” som kategorititle.

  4. websimon skriver:

    Johannes: jo brukar särskilt fixa archive.php då det väl är denna fil som vanligtvis anropas vid kategorisidor. Tycker mig se en stor skillnad på en korrekt optimerad kategorisida mot ingen alls. Mycket lättare för sökmotorer att förstå strukturen då.

Comment