Vad är ett 404 fel?

Ett 404 fel inträffar när användaren surfar in på en adress som inte finns eller har tagits bort. Det webbläsaren gör som standard är att visa en informationsruta om det inträffade felet. Den här sidan ser både fruktansvärt tråkig ut samtidigt som den inte ger någon som helst respons till användaren vilket inte är önskvärt. Titta på bildexemplet nedan så förstår ni vad jag menar.

Lösningen är att skapa en anpassad 404 sida för just din webbsajt.

Behåll din design

Det absolut viktigaste är att din 404 sida bibehåller designen som dina övriga sidor på webbsajten använder så att användaren känner att han kommit in på din sida. Igenkänningsfaktorn är otroligt viktig, ha det i åtanke när du utformar sidan.

Ge användaren alternativ

Om din webbsajt till exempel är en blogg och din användare har skrivit in fel adress till ditt senaste blogginlägg och inte hittar det är det viktigt att du ger honom/henne alternativ. Ge förslag på inlägg och artiklar som kan vara relevanta och intressanta så att användaren klickar sig vidare istället för att lämna din sajt med detsamma.

Så här ser min 404 sida ut

Skapa en 404 sida

Så till det praktiska: hur skapar man en 404 sida? Tänkte gå igenom hur man går tillväga på en vanlig sajt men även i publiceringsverktyget WordPress.

Skapa sidan i WordPress

1. Skapa filen 404.php och lägg den i ditt temas mapp
2. Fyll filen med information som du vill ha på din 404 sida (tänk på tipsen ovan)

Skapa sidan på en ”vanlig” sajt

1. Öppna en textredigerare och skriv in ErrorDocument 404 /error-page.html på första raden
2. Spara filen som .htaccess.txt
3. Ladda upp filen till rotmappen på din server
4. Döp om filen från .htaccess.txt till .htaccess
5. Skapa sedan filen error-page.html och fyll den med information (tänk på tipsen ovan)
6. Ladda sedan upp error-page.html till rotmappen på din server

Det var väl inte så knepigt va?

Har du tips på hur man anpassar en 404 sida på bästa sätt, ge gärna din syn på saken.

Vad har gjorts?

Efter många långa sena kvällar släpps alltså en ny design här på bloggen. Det var egentligen tänkt att det skulle släppas vid 1-års firandet av bloggen (vid nyår) men kommer som sagt lite tidigare. Jag ville ha en tydligare struktur vilket har gjort att sajten fått en 2 kolumnig design istället för 3 som tidigare. Jag har försökt skilja på vad som är innehåll och vad som tillhör sidpanelen.

Jag har lagt till bilder från mitt Flickr konto (hoppas man orkar uppdatera det nu bara…). Jag har även lagt till mina favoritcitat och musiken som jag lyssnat på under veckan. De mest populära artiklarna har ärats med en egen rubrik i sidpanelen så att man enkelt kan hitta till artiklarna som läses mest. Har också taggat alla inlägg och lagt till ett taggmoln så att man kan lista inlägg efter ämnen.

Min gamle klasskamrat Andreas Eriksson inspirerade mig också till att lägga till ”Notiser” på sidan som är korta nyheter om vad som händer i webbvärlden.

Om du upptäcker något som är felaktigt eller har någon synpunkt får du mer än gärna skriva en kommentar så jag kan rätta till det.

Bjuder på en före och efter bild

Några av de kommande nyheterna i version 2.9

• Trash status
• Bildredigering
• Minifiering av admin css
• Flera förändringar och tillägg för kommentarer

1. Installera skriptet

Börja med att ladda hem källkoden till Timthumb.php och spara den i ditt temas mapp. Skapa också en mapp där och döp den till ”cache”. Kom ihåg att det är viktigt att mappen är skrivbar ifrån servern så sätt korrekta rättigheter.

2. Använd Custom Fields

1. Börja med att ladda upp bilden i den post du vill använda.
2. Lägg till ett nytt ”Custom Field (eget fält) och sätt namnet till ”picture”.
3. Värdet i det här fältet ska vara adressen till bilden du nyss laddat upp.

3. Anrop ifrån WordPress

Nu ska vi ta och anropa Timthumb skriptet ifrån vårt WordPress-tema. I den fil och på den plats i koden du vill infoga en bild skriver du följande:

<?php
$picture = get_post_meta($post->ID, 'picture', true);
<img src="<?php bloginfo('template_directory'); ?>/timthumb.php?src=<?php echo $picture; ?>&h=150&w=150&zc=1" alt="<?php the_title(); ?>" width="150" height="150" />
?>

Det första som händer här är att vi sparar undan adressen till bilden genom att använda oss av det egna fältet ”picture” och sparar undan det i variabeln $picture. Nästa sak vi gör är att skapa en bildtagg och som värde till dess src attribut sätter vi sökvägen till Timthumb skriptet. Efter det följer en querystring ”src” som har värdet av variabeln innehållandes adressen till bilden ($picture) och det sätts även värden för h (height) och w (width) följt av zc (zoomcropping).

Sammanfattning

När det här anropet så körs kommer det att skapas en ny bild av din ursprungliga med de värden som du nyss satt. Behöver du mer hjälp att förstå vad skriptet gör så besök Timthumb supportforum.

All in One Seo Pack

Med hjälp utav All in One Seo Pack kan man enkelt styra hur titlarna på sidorna ska se ut eller fylla på med fler sökord för bloggen. Ett mycket bra plugin i sökmotoroptimerings-syfte.

Broken Link Checker

I takt med att det blir fler och fler inlägg på bloggen så ökar också sannolikt antalet länkar. Det kan vara en otroligt tidsödande process att ständigt ha koll på att alla länkar fungerar. Med Broken Link Checker låter du pluginet hålla koll på detta åt dig, mycket smidigt.

Different posts per page

Ibland vill man inte visa lika många artiklar på sin startsida som tex i arkivet eller i sökresultaten. Då är Different posts per page ett underbart plugin som låter dig styra hur många inlägg som ska visas vid olika förhållanden.

Post Ideas

Med Post Ideas kan man snabbt skriva ner ideér som man får till nya blogginlägg. Skriv ner en titel och några keywords så slipper du skriva hela inlägget på en gång.

Google XML Sitemap

För att Google och andra sökmotorer enkelt ska kunna indexera din blogg behövs en sitemap. Det här pluginet genererar och uppdaterar automatiskt en sitemap för din blogg.

WordPress Database Backup

Det är viktigt att du har säkerhetskopior på informationen i din blogg. Det här pluginet backar automatiskt upp dina inlägg och allt annat som finns i WordPress tillhörande databas och skickar ett mail till dig med backup filerna.

WP Page Navi

Med hjälp utav det här pluginet får du möjlighet att styra pagineringen på bloggen precis som du vill.

Vilka plugin använder du? Kommentera gärna!

1. Tidsinställa inlägg

En mycket smart funktion som gör att man inte behöver publicera sina inlägg direkt utan man kan välja vilken tidpunkt som man vill att inlägget ska publiceras. Detta utförs under ”Publicera” fönstret när man skapar ett nytt inlägg, där väljer man ”Redigera” på alternativet ”Publicera direkt” och där kan man ställa in dag och tidpunkt då inlägget ska publiceras.

2. Ändra dina permalänkar

Standardlänkarna i WordPress kan exempelvis se ut såhär: www.johannesholmberg.se/?p=123 vilket varken ser sexigt ut eller hjälper sökmotorerna på vägen till dina artiklar. Ändra istället dina permalänkar (länkarna till dina artiklar) till något som både du och sökmotorerna får ut någonting av. Detta gör du under Inställningar -> Permalänkar.

3. Använd snabbpress funktionen

När du loggat in i administrationsgränssnittet kan du direkt från din startpanel lägga till ett blogginlägg från fönstret som kallas ”SnabbPress”, detta är smidigt när man har korta inlägg som man snabbt vill lägga till utan att behöva ladda in en ny sida.

Har ni fler smidiga tips på WordPress, kommentera gärna.