Sidan 1 av 2 12 SistaSista
Resultat 1 till 30 av 45

Optimera Wordpress

  1. #1
    Tobias Nyholms avatar
    Tobias Nyholm Tobias Nyholm är inte uppkopplad Moderator
    Reg.datum
    maj 2009
    Ort
    Stockholm
    Inlägg
    881
    Denna guide börjar med att ta grundläggande utveckling av wordpress-teman. Sedan berättas det hur man enkelt redigerar sitt tema så det blir mer sökmotorvänligt. I slutet av guiden tar jag upp tre tips för den som är van att redigera wordpress-teman.

    Guiden tar inte upp något om plugin eller funktionalitet som ej omfattas av teman. I guiden utgår jag från hur de flesta teman ser ut. Jag utgår också från att läsaren inte har någon erfarenhet i att redigera wordpress-teman eller CSS.

    Wordpress
    Standarder
    Wordpress har ett antal filnamn som är "speciella". De vanligaste är:

    • index.php
    • header.php
    • footer.php
    • sidebar.php
    • page.php
    • single.php
    • comments.php
    • style.css

    header.php innehåller det som är övers på sidan. Exempelvis menyn och allt inom <head> (typ meta-taggar). footer.php är det som är längst ned på sidan. Här kan det finnas länkar till tema-författaren och wordpress. header.php och footer.php laddas på alla sidor.

    page.php laddas endast då en sida (page) visas. Jämför med single.php som landdas endast då ett inlägg (post) visas. page.php och sinlge.php är valfria filer. Alla teman har inte dessa. Om ditt tema saknar någon av dessa filer så laddas index.php.

    index.php är den sida som laddas om inte en "specialsida" finns. Det är också här man ser de senaste inläggen (posts).

    comments.php laddas när man är på ett enskilt inlägg eller sida. Man laddar comments.php med funktionen comments_template().

    style.css innehåller all CSS för temat.

    Referens:
    För en komplett lista av speciella filnamn se wordpress codex: http://codex.wordpress.org/Theme_Dev...ate_Files_List

    Wordpress-loopen
    Man kan inte beskriva Wordpress-teman utan att nämna "loopen". Loopen körs för att visa varje inlägg/sida som besökaren har frågat efter. Loopen börjar så här:
    PHP-kod:
    <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
    Den säger: "Om det finns några poster, kör så länge det finns poster: Hämta data om posten."
    I loopen kan man an
    vända många funktioner och dessa är rätt självbeskrivande. Exempel på funktioner man kan använda i loopen:

    • the_permalink()
    • the_title()
    • the_author()
    • the_time()
    • the_category()
    • the_content()
    • comments_popup_link("Ingen kommentar", "En kommentar", "% kommentarer")

    Loopen avslutas med:
    PHP-kod:
    <?php endwhile; else: ?>
    <p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
    <?php endif; ?>
    Referenser:
    http://codex.wordpress.org/The_Loop
    http://codex.wordpress.org/Function_...nts_popup_link

    Fuktioner
    Innan jag börjar prata om SEO måste jag nämna ett par viktiga wordpess-funktioner som kan användas utanför och inne i loopen. Dessa funktioner returnerar bara sant eller falskt, så de passar bra i en if-sats. Lista på funktioner:

    • is_single()
    • is_page()
    • is_home()
    • is_front_page()
    • is_category()

    Alla dessa funktioner är ganska självförklarande. is_category() svarar sant om du visar en kategorisida. Det enda som är förvirrande är att is_home() svarar sant när du visar inläggssidan. DVS om du har en statisk sida som förstasida så blir är is_home()=false men is_front_page()=true.

    Med dessa funktioner kan man (men man borde inte) bädda in alla specialsidor i index.php.

    Referens:
    Det finns en hel del "Conditional"-funktioner inbyggda i Wordpress. Se en komplett lista här: http://codex.wordpress.org/Conditional_Tags

    SEO
    Rubriker
    Det är så att de flesta Wordpress-teman är skrivna på ett dåligt sätt gällande SEO. Framför allt så slarvas det med rubriktaggar. Ett vanligt senario är att bloggens titel är en h1-tagg och alla andra sidor har en h2-tagg. Detta är fel.

    Det ska vara så att alla dina sidor och inlägg (page.php och single.php) ska ha en h1-tagg runt sin titel. Exempel hur den raden kan se ut:
    PHP-kod:
    <h1 class="entry-title"><?php the_title(); ?></h1>
    När man visar de senaste inläggen (index.php) så kan man inte ha flera h1-taggar. Man gör de då till h2. Man sätter gärna in en länk till den inlägget i rubriken också.
    Exempel hur den raden kan se ut:
    PHP-kod:
    <h2 class="entry-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
    Bloggens titel ska inte vara en h1-tagg. Där kan man sätta en vanlig div-tagg med ett id. Däremot, eftersom inläggssidan inte har någon lämplig h1-tagg, så sätter man bloggens titel som h1 bara på inläggssidan.

    Det här är fel, men är vanligt att det ser ut så här i header.php:
    PHP-kod:
    <h1><a href="<?php echo home_url'/' ); ?>"><?php bloginfo('name'); ?></a></h1>
    Man ska istället skriva så här för att visa bloggens titel korrekt:
    PHP-kod:
    <?php  //om det är inläggssidan, sätt $heading_tag="h1" annars "div"
    $heading_tag = ( is_home()) ? 'h1' 'div';?>
      <<?php echo $heading_tag?> id="site-title">
          <a href="<?php echo home_url'/' ); ?>" rel="home">
             <?php bloginfo'name' ); ?>
          </a>
      </<?php echo $heading_tag?>>
    Övriga rubriker på sidan anges i adminsystemet och är därför utanför tema-utvecklarens kontroll.

    Sidebar
    Man brukar ha en eller flera sidebars så sidan. Man måste registrera en sidebar för att kunna använda den. Det gör man med funktionen register_sidebar(). Ett korrekt anrop ser ut så här:
    PHP-kod:
    if ( function_exists('register_sidebar') ) {
     
    register_sidebar(array(
       
    'before_widget' => '<li id="%1$s" class="widget %2$s">',
       
    'after_widget' => '</li>',
       
    'before_title' => '<h5 class="widgettitle">',
       
    'after_title' => '</h5>',
       
    'name' =>"sidebar",
       
    'id' => "sidebar",
       
    'description' => "Detta är sidofältet"   
     
    ));

    Observera att titel-taggen är en h5 och har klassen "widgettitle". Det finns teman som sätter h2 eller h3 här vilket jag tycker är fel. Jag brukar använda h5.

    CSS
    Nu ser källkoden bra ut och är optimerad. Men sidan kan ha fått sitt utseende förändrat. För att återgå till det tidigare utseendet måste vi ändra lite i temats css. Det är då filen style.css som gäller.

    Grunder
    Grunderna i CSS är lätta. Det går ut på att man först identifierar ett element (HTML-tagg) sen sätter stilen. En punkt (.) identifierar en klass. En fyrkant (#) identifierar ett id. Annars identifieras html-taggar med deras namn.

    Ändra i CSSen
    För att ändra tillbaka bloggens titel till dess ursprungliga utseende måste vi hitta vart i CSSen som utseendet var skrivet. Hittar man inte så är det enkelt att skriva om.
    HTML-kod:
    //identifera site-title med id oavsett om det är h1 eller div. 
    #site-title{
      font-size: 16px;
      color: red;
    }
    Eftersom alla dina rubriker var h2 innan så finns det troligtvis en rad i CSSen som säger:
    HTML-kod:
    h2{
      font-size: 14px;
      color: green;
    }
    Ändra den till
    HTML-kod:
    //för alla rubriker på inlägg och sidor (single.php och page.php)
     h1.entry-title{
       font-size: 14px;
       color: green;
     }
    Man kan också lägga till detta för att få inläggsidan snygg:
    HTML-kod:
    //för rubrikerna på inläggssidan. Observera att det är för besökta som obesökta inlägg. 
    h2.entry-title a, 
    h2.entry-title a:visited{
        font-size: 13px;
        color: green;
    }
    //när man håller musen över länken så blir den svart.
    h2.entry-title a:hover, 
    h2.entry-title a:active{
         font-size: 13px;
         color: black;
    }
    Rubrikerna i sidebaren identifieras ofta med klassen .widgettitle. Eftersom vi inte ändrade klassen så behöver vi inte bry oss om att ändra något för den i CSSen.

    Överkurs
    För den som är van att redigera teman så kan jag tipsa lite om ytterligare optimeringar.

    1) Importera menyn och alla sidebars i footern. Sen skriver man om det med CSS så det ser bra ut. På så sätt får vi det viktiga innehållet högt upp i källkoden och länklistor (menyer) och annat oviktigt kommer längre ned.

    2) Lägg alla javascript i footern. De flesta javascript används inte förän sidan är laddad, prioritera då att innehållet kommer till besökarens webbläsare först. Stilmallarna där emot ska vara i headern. Både javascripten och stilmallarna ska vara i egna filer. Inget ska blandas med HTMLen.

    3) Om du vill att två sidor ska se olika ut, använd templates. Börja med att skapa en ny fil, överst i filen skriver man:
    PHP-kod:
    <?php
    /**
     * Template Name: Min nya stilmall
     */
    I adminsystemet när man redigerar sidor kan man nu välja "Stilmallar"/"Templates". Om man då väljar "Min nya stilmall" så kommer den nyss skapade filen att laddas istället för page.php.

    Sammanfattning
    Många wordpress-teman är dåligt optimerade men med lite ändringar av rubriker och runtflyttande av kod så blir det bättre. Om man är van att redigera teman så tar det inte mer än 20 minuter att ändra rubrikerna. Ändringen kommer ge positiva resultat och är en bra investering.

    Om du vill lära dig utveckla wordpress teman så rekommenderar jag dig att läsa koden och se vad andra har gjort. Standardtemana till wordpress 2.8 heter "Default" och "Classic" och dessa är bra teman att börja kika på.
    CTO på Happyr.com. Vi gör rekrytering effektivt

  2. #2
    Legendarisks avatar
    Legendarisk Legendarisk är inte uppkopplad Kan SEO rätt bra
    Reg.datum
    nov 2010
    Ort
    Uppsala
    Inlägg
    225
    Tack för en grym guide! Helt otroligt va folk är hjälpsamma och duktiga på det här forumet
    Ni följer mig via min Blogg: www.legendarisk.nu

  3. #3
    Urban Gs avatar
    Urban G Urban G är inte uppkopplad SEO-proffs: utökad profil
    Administratör
    Reg.datum
    mar 2006
    Ort
    Skåne, Vollsjö
    Inlägg
    2 586
    Instämmer +rykte för Tobias och tråden klistrad.

  4. #4
    hakans avatar
    hakan hakan är inte uppkopplad Lär mig SEO
    Reg.datum
    sep 2009
    Ort
    Göteborg
    Inlägg
    78
    Riktigt bra guide, hade jag kunnat ge rykte hade jag gjort det.

    Uppdaterat: Det kunde jag visst..
    Senast redigerat av hakan den 2010-11-27 klockan 14:38.

  5. #5
    Urban Gs avatar
    Urban G Urban G är inte uppkopplad SEO-proffs: utökad profil
    Administratör
    Reg.datum
    mar 2006
    Ort
    Skåne, Vollsjö
    Inlägg
    2 586
    Citat Ursprungligen postat av hakan Visa inlägg
    Riktigt bra guide, hade jag kunnat ge rykte hade jag gjort det.
    Om du klickar på den lilla stjärnan direkt i slutet av Tobias inlägg så skall du kunna ge det. Om du nu inte gjort det tidigare till samma person i närtid.

  6. #6
    Anders Tibblings avatar
    Anders Tibbling Anders Tibbling är inte uppkopplad SEO-proffs
    Reg.datum
    jul 2007
    Ort
    Stockholm
    Inlägg
    329
    Grymt Tobias! + på rykte!

    mvh Anders

  7. #7
    Hercules Rockefellers avatar
    Hercules Rockefeller Hercules Rockefeller är inte uppkopplad Kan SEO rätt bra
    Reg.datum
    aug 2009
    Ort
    UK
    Inlägg
    38
    5 Stars Tobias! Mycket tacksam.

  8. #8
    Sweelys avatar
    Sweely Sweely är inte uppkopplad Lär mig SEO
    Reg.datum
    jun 2009
    Ort
    Göteborg
    Inlägg
    269
    Soft guide! Läst mycket liknande, fast på engelska. Skönt att det nu finns på svenska. Bokmärker denna tråd

  9. #9
    Tobias Nyholms avatar
    Tobias Nyholm Tobias Nyholm är inte uppkopplad Moderator
    Reg.datum
    maj 2009
    Ort
    Stockholm
    Inlägg
    881
    Tack för all positiv kritik.
    CTO på Happyr.com. Vi gör rekrytering effektivt

  10. #10
    ostlunds avatar
    ostlund ostlund är inte uppkopplad Lär mig SEO
    Reg.datum
    okt 2010
    Ort
    Göteborg
    Inlägg
    80
    + rykte. Man kan ju även variera titeln lite beroende på om det är arkiv/tagg sidor.
    Henrik webbutvecklare i Göteborg

  11. #11
    Niklas Aronssons avatar
    Niklas Aronsson Niklas Aronsson är inte uppkopplad SEO-proffs
    Moderator för alla forumsektioner
    Reg.datum
    nov 2009
    Ort
    Malmö
    Inlägg
    753
    Har inte hunnit läsa den än, men du kan räkna med ytterligare ett + härifrån. Sånt här uppskattas verkligen, det sparar mycket tid för väldigt många!

  12. #12
    StefanBergfeldts avatar
    StefanBergfeldt StefanBergfeldt är inte uppkopplad Kan SEO rätt bra
    Reg.datum
    okt 2007
    Ort
    Hedemora
    Inlägg
    1 012
    Var kan jag ladda ner det färdiga temat?
    Mycket bra guide, +rykte på den

  13. #13
    Tobias Nyholms avatar
    Tobias Nyholm Tobias Nyholm är inte uppkopplad Moderator
    Reg.datum
    maj 2009
    Ort
    Stockholm
    Inlägg
    881
    Mina teman kommer du kunna ladda ner på webfish.se efter nyår.
    CTO på Happyr.com. Vi gör rekrytering effektivt

  14. #14
    Petter Hedmans avatar
    Petter Hedman Petter Hedman är inte uppkopplad SEO-proffs
    Reg.datum
    okt 2010
    Ort
    Falun
    Inlägg
    955
    Plussat på ryktet Tobias!

    Tack Mannen!

    Petter
    ChatGPT: ChatGPT
    Dalarna: Dalarna

  15. #15
    Stefan_Js avatar
    Stefan_J Stefan_J är inte uppkopplad Lär mig SEO
    Reg.datum
    feb 2010
    Ort
    Hällingsjö
    Inlägg
    23
    Mycket bra guide!

    Ett + på rykte även från mig.

  16. #16
    Tians avatar
    Tian Tian är inte uppkopplad Lär mig SEO
    Reg.datum
    nov 2010
    Inlägg
    19
    Man utför en djuuup bugning / nigning och säger ett ödmjukt "Tack" för ovärdeliga tips!
    Ryktespluss och en varm önskan om en fin helg!

  17. #17
    Axels avatar
    Axel Axel är inte uppkopplad Lär mig SEO
    Reg.datum
    apr 2011
    Ort
    Göteborg
    Inlägg
    18
    Att skapa och redigera egna teman är ett mål som man hoppas att man når upp till inom en rimlig framtid, detta var helt klart ett steg på vägen!

  18. #18
    pralbins avatar
    pralbin pralbin är inte uppkopplad Kan SEO rätt bra
    Reg.datum
    jan 2011
    Ort
    Göteborg
    Inlägg
    26
    Riktigt fin sammanfattning, stort credd!
    Albin Stööp. Erbjuder professionell SEO.

  19. #19
    takemetothetops avatar
    takemetothetop takemetothetop är inte uppkopplad Lär mig SEO
    Reg.datum
    sep 2010
    Inlägg
    49
    Har lite problem att få till H1 rätt i mitt nya tema. Edit: Nu är det fixat. Får dock inte till storleken på rubrikerna i inläggen.
    Senast redigerat av takemetothetop den 2011-08-17 klockan 09:40.

  20. #20
    Tobias Nyholms avatar
    Tobias Nyholm Tobias Nyholm är inte uppkopplad Moderator
    Reg.datum
    maj 2009
    Ort
    Stockholm
    Inlägg
    881
    Citat Ursprungligen postat av takemetothetop Visa inlägg
    Har lite problem att få till H1 rätt i mitt nya tema. Edit: Nu är det fixat. Får dock inte till storleken på rubrikerna i inläggen.
    Storleken på rubriken styr du med CSS. När man debuggar CSS och HTML är Firebug ett bra plugin att använda. Chrome har också något liknande som heter Chrome Inspector.

    I din CSS-fil ska du skriva något i stil med:
    HTML-kod:
    #site-title{
    font-size:16px;
    }
    CTO på Happyr.com. Vi gör rekrytering effektivt

  21. #21
    Petter Hedmans avatar
    Petter Hedman Petter Hedman är inte uppkopplad SEO-proffs
    Reg.datum
    okt 2010
    Ort
    Falun
    Inlägg
    955
    Jag tycker att detta fortfarande är ett av de allra bästa inläggen här på forumet!
    Gav plus till dig tidigare. Du förtjänar det verkligen!
    ChatGPT: ChatGPT
    Dalarna: Dalarna

  22. #22
    Tobias Nyholms avatar
    Tobias Nyholm Tobias Nyholm är inte uppkopplad Moderator
    Reg.datum
    maj 2009
    Ort
    Stockholm
    Inlägg
    881
    Citat Ursprungligen postat av Petter Hedman Visa inlägg
    Jag tycker att detta fortfarande är ett av de allra bästa inläggen här på forumet!
    Gav plus till dig tidigare. Du förtjänar det verkligen!
    Tack Petter
    CTO på Happyr.com. Vi gör rekrytering effektivt

  23. #23
    aleands avatar
    aleand aleand är inte uppkopplad SEO-proffs
    Reg.datum
    jan 2011
    Ort
    Stockholm
    Inlägg
    30
    Superbra guide Tobias, du får +

  24. #24
    Matssons avatar
    Matsson Matsson är inte uppkopplad Lär mig SEO
    Reg.datum
    nov 2011
    Ort
    Lund
    Inlägg
    16
    Jag har lite problem med att få till H1 på min blogg. Om jag går in på ett av mina inlägg så står inläggets titel som H2:a, och jag har överhuvudtaget ingen H1. Jag har constructor-theme, och jag begriper inte hur jag ska applicera det som står i den här guiden på mitt tema.

    Någon som har erfarenhet av constructor theme och hur man fixar till sin H1?

    EDIT: Fick hjälp av Fredrik från Legendarisk.se.
    Senast redigerat av Matsson den 2011-12-18 klockan 23:17.

  25. #25
    mediabloggen.nus avatar
    mediabloggen.nu mediabloggen.nu är inte uppkopplad Lär mig SEO
    Reg.datum
    dec 2011
    Ort
    Borås
    Inlägg
    3
    Tack för en bra guide! Vill bara säga hej till alla i forumet och börjar min resa inom SEO nu. Är en nybörjare på alla sätt, men riktigt kul att se att det finns så otroligt mycket kunskap!

  26. #26
    Musclemans avatar
    Muscleman Muscleman är inte uppkopplad Kan SEO rätt bra
    Reg.datum
    feb 2012
    Inlägg
    11
    Bra guide. Det går dock att problematisera litegrann kring detta.

    Ponera att man bygger en webbplats kring en specifik produkt. Man vill helst att produktens namn skall finnas med i rubriken på relevanta undersidor. Nu är det emellertid så att om temat man använder inte stöder wordpress inbyggda anpassningsbara meny - samt ej har en egen anpassningsbar meny - så kommer alla menylänkar till undersidorna automatiskt att ha hela undersidans rubrik utskriven. För en sida om potatis så skulle länkarna bli: Näringsvärde i potatis, potatis giftighet, recept med potatis etc. Sidornas rubriker listas även i page title och så ock gör webbplatsens grundläggande namn (om man inte modifierar page title för enskilda sidor med en vettig seo-plugin). Det blir med andra ord väldigt lätt spammigt och klumpigt att använda kompletta rubriker/namn på sina undersidor. Och i så måtto är det smidigt med en global h1 och bara köra h2 för undersidornas rubriker.

    Men orkar man söka rätt på ett tema som möter alla kraven samt fippla manuellt med menyer och page titles över hela wordpress-installationen så har det ju sina fördelar att inte använda en global rubrik.

  27. #27
    Daniel Johannissons avatar
    Daniel Johannisson Daniel Johannisson är inte uppkopplad Lär mig SEO
    Reg.datum
    feb 2012
    Inlägg
    15
    Tack, riktigt bra guide.

  28. #28
    takemetothetops avatar
    takemetothetop takemetothetop är inte uppkopplad Lär mig SEO
    Reg.datum
    sep 2010
    Inlägg
    49
    Använder numera ett tema som heter Graphene som jag gillar, tycker dock allt är annorlunda där. till exempel ser det ut såhär i single post:
    PHP-kod:
    <?php
    /**
     * The Template for displaying all single posts.
     *
     * @package Graphene
     * @since Graphene 1.0
     */

    get_header(); ?>

        <?php
        
    /* Run the loop to output the posts.
         * If you want to overload this in a child theme then include a file
         * called loop-single.php and that will be used instead.
         */
        
    the_post();
        
    get_template_part('loop''single');
        
    ?>
                
    <?php get_footer(); ?>
    Vad/hur ändrar man då och varför ser det ut så istället? Tror dock att temat är någorlunda "SEO-optimerat" från början.

  29. #29
    Fredrik Johanssons avatar
    Fredrik Johansson Fredrik Johansson är inte uppkopplad SEO-proffs
    Reg.datum
    maj 2009
    Ort
    Malmö
    Inlägg
    375
    Citat Ursprungligen postat av takemetothetop Visa inlägg
    Använder numera ett tema som heter Graphene som jag gillar, tycker dock allt är annorlunda där. till exempel ser det ut såhär i single post:
    PHP-kod:
    <?php
    /**
     * The Template for displaying all single posts.
     *
     * @package Graphene
     * @since Graphene 1.0
     */

    get_header(); ?>

        <?php
        
    /* Run the loop to output the posts.
         * If you want to overload this in a child theme then include a file
         * called loop-single.php and that will be used instead.
         */
        
    the_post();
        
    get_template_part('loop''single');
        
    ?>
                
    <?php get_footer(); ?>
    Vad/hur ändrar man då och varför ser det ut så istället? Tror dock att temat är någorlunda "SEO-optimerat" från början.
    Hej, det beror på vad du ska ändra. Header saker finns i header.php ex. :-) Säg vad du vill ändra så är det lättare att skriva vart du ska gå och göra.

  30. #30
    sandra100s avatar
    sandra100 sandra100 är inte uppkopplad Lär mig SEO
    Reg.datum
    mar 2012
    Ort
    Färlöv
    Inlägg
    3
    Hej!
    har följt denna tråden för att försöka ge mig på att ändra i blogger, men den html mallen ser inte ut så som dessa texter så jag kan inte ändra i den.

    Jag skulle vilja ändra så att mina rubriker i inläggen blir h1. Alltså sökbara om jag har förstått det hela rätt.

    Är det någon som vet hur man gör i just den mallen? Väldigt tacksam för svar då jag inte är någon expert på html

Sidan 1 av 2 12 SistaSista

Ämnesinformation

Användare som tittar på det här ämnet

Det är för närvarande 1 användare som tittar på det här ämnet. (0 medlemmar och 1 gäster)

Liknande ämnen

  1. optimera webshopp.
    Av lenny46 i forum Sökordsanalys
    Svar: 6
    Senaste inlägg: 2008-11-26, 17:49
  2. Svar: 0
    Senaste inlägg: 2008-03-24, 23:53
  3. Optimera Fort???
    Av Solutions i forum PageRank
    Svar: 10
    Senaste inlägg: 2007-08-12, 22:55
  4. Optimera via subdomän
    Av DD Webb i forum Förtroende "trust" och straff "penalty"
    Svar: 9
    Senaste inlägg: 2007-04-20, 16:31
  5. Optimera CSS
    Av Marcin i forum Optimering
    Svar: 10
    Senaste inlägg: 2007-02-10, 12:24