Björn Sennbrink om WordPress och webbutveckling.

Visa eller dölj innehåll med CSS och HTML

Du kan använda jQuery och javascript för att dölja/visa innehåll på din hemsida. Eller, så kan du använda CSS och HTML för att åstadkomma samma sak.

På min reseguide för Zanzibar har jag nyligen lagt till en lista med interna länkar (restips). Den listas visas i högerkolumnen och tar en del plats (många artiklar). Jag ville hitta ett sätt att kunna låta besökaren dölja listan t.ex. för de återkommande besökare som är tillbaka för det senaste och som läst allt annat.

Först la jag till några rader i min CSS-fil:

/* CSS3 för att dölja och visa innehåll i restips-reseguide-sidebar */
.show {display: none; }
.hide:focus + .show {display: inline; }
.hide:focus { display: none; }
.hide:focus ~ #list { display:none; }
@media print { .hide, .show { display: none; } }

..och därefter gick jag till berörd WordPress-temafil, la till en ny DIV (container för loopen som visar de aktuella internlänkarna) och placerade ut ”show/hide” där jag ville att besökaren ska kunna göra valet av visa/dölja internlänkarna:

<a href="#" class="hide">Dölj restipsen</a>
<a href="#" class="show">Visa restipsen</a>
<div id="list">
The Loop för posttypen
</div>

..och gjorde länkarna snyggare via CSS-filen:

.show {display: none; font-family: Arial;font-size: 12px; margin: 0 0 3px 7px;}
.hide:focus + .show {display: inline; }
.hide:focus { display: none; }
.hide:focus ~ #list { display:none; }
@media print { .hide, .show { display: none; } }
.hide {font-family: Arial;font-size: 12px; margin: 0 0 3px 7px;}

Skriv inlägg via e-post

Skriv inlägg via e-post är en standardfunktion i WordPress som gör det möjligt att skapa blogginlägg via e-post.

Du hittar funktionen under menyfliken Inställningar – Skriva (Settings – Write på engelska). E-postadressen måste vara hemlig om du vill undvika att obehöriga postar till din blogg. När du använder WordPress version 3.2 skapas slumpvis e-postadresser som du kan använda. Mitt förslag är att du tar alla slumpade förslag och sätter samman till en enda lång e-postadress.

Innan du kan börja skriva inlägg via e-post måste du skapa kontot på ditt webbhotell. Du behöver därefter gå tillbaka till WordPress och mata in uppgifterna för E-postserver, Användarnamn och Lösenord. Användarnamnet ska som sagt vara väldigt svårt och samma sak med lösenordet. Om du har möjlighet, inkludera flera specialtecken i ditt lösenord. Du måste även ange en förvald inläggskategori där inlägg via e-post ska hamna när de publiceras.

Testa nu att sända ett mail till e-postadressen du la till tidigare. Gå sen till domän.tld/wp-admin/edit.php och kolla efter det nya inlägget. Om du inte ser ett inlägg, gå till domän.tld/wp-mail.php och gå därefter tillbaka till domän.tld/wp-admin/edit.php för att se det nya inlägget.

Ett alternativ till att manuellt kolla efter inlägg som inkommit via e-post är att redigera footer.php i din temamapp och lägga till:

Redigera sökvägen så att den blir rätt för din WordPress-installation.

Läs mer: http://codex.wordpress.org/Post_to_your_blog_using_email

Advanced Custom Field Widget

Advanced Custom Field Widget är ett WordPress-plugin som baserat på data i custom fields visar något där widgeten är placerad.

Displays the values of specified custom field keys, allowing post- and page-specific meta content in your sidebar.

Advanced Custom Field Widget kan även användas för att hjälpa besökaren vidare till fördjupning t.ex. genom att hänvisa till böcker på ämnet.

Enkel installation
Ladda ner, packa upp, ladda upp, aktivera och gå till Utseende-Widgets. Kolla efter ”Adv. Custom Field” och placera din widget:en där du vill att den ska visas, förslagsvis under ”Single Post Side” eller vad du nu kallar den.

Nästa steg är att skapa ett nytt inlägg och skapa det custom field du angett som Primary Key i widget:en. Jag har valt ”books” och skapar således ett custom field som heter ”books”.

Jag har här valt att länka till en läsvärd bok och gör så genom att ange vanligt HTML i mitt nya (egna) fält ”books”. Förhandsgranskar och ja visst, nu visas Advanced Custom Field Widget på rätt plats, med rätt innehåll.

..efter detta kan du gå tillbaka och lägga till affiliate-koden på länken så att du tjänar pengar på att länka ut 😉

Använda shortcode i ditt WordPress-tema

Hur du gör för att använda shortcodes i ditt WordPress-tema.

Shortcodes är en funktion i WordPress för att skapa ett makro t.ex. för att visa en funktion skapad av ett plugin. Utvecklare av WordPress-plugin kan dra nytta av Shortcode API:et i syfte att förenkla användningen av ett tillägg.

Du kan lägga till en shortcode i ditt WP-tema via ”[ shortcode ]” (utan citattecken samt utan mellanslag till höger och vänster om klamrarna).

Det finns ingen generell shortcode för alla plugins. Vad som ska stå inom klamrarna skiljer sig åt. Om två plugin med två olika funktioner har samma shortcode kan det uppstår en konflikt.

Läs mer på http://codex.wordpress.org/Shortcode_API

Vårda din sajt: Koll på brutna länkar

Det finns nästan inget värre än återvändsgränder på webbplatser och bloggar. 404 är ett svar från webbservern när besökare försöker visa en sida som inte finns (eller som bytt adress). Här några tips på hur du behåller besökaren på din webbplats genom att använda WP-tillägg som vakar över din sajts länkar, externa såväl som interna.

Redirection är ett tillägg till WordPress som skickar besökaren vidare till en ny sida utan att besökaren måste klicka sig dit. Jag använder Redirection för ett 40-tal numera raderade sidor på bjornsennbrink.se även om jag för andra webbplatser valt att göra samma sak med en .htaccess-fil direkt i webbserverns root. Reservation för att det inte fungerar med WP-versioner senare än 3.7.1.

För att få reda på vilka sidor på din blogg/webbplats som genererar 404 till besökaren kan du kolla i webbserverns loggfil. Men det är överkurs för somliga varför Google är ett enklare verktyg att ta till.

Du har förmodligen ett Google-konto och därmed tillgång till Webmaster Tools. Under ”Diagnostics” och ”Crawl errors” finns du rubriken ”Not found”. Med uppgifter från Webmaster Tools tar det inte lång tid att kopiera/klistra in den webbadress som det är fel på och med hjälp av Redirection ge besökaren en ny sida att besöka.

När du korrigerat måladresserna för inkommande länkar och delar av din blogg dit besökare kommer från sökmotorerna, är det dags att ge sig på de utgående länkarna. Kör du egen installation av WordPress rekommenderar jag Broken Link Checker. Tillägget scannar igenom ditt innehåll och returnerar en lista med trasiga länkar.

Broken Link Checker fungerar tillfredställande men gav t.ex. uppgifter att en utgående länk var trasig, även fast målsajten i själva verket fungerade som den skulle. Viktigt att nämna här är att du bör vänta ett par minuter och låta tillägget arbeta sig genom din sajt. För egen del hittades först bara tre trasiga utgående länkar. En kvart senare hade det antalet ökat till närmare 30 stycken.

Broken Link Checker fungerar tillsammans med WordPress 2.8 3.9+ och lägger sig som en funktion på huvudpanelen. Varje trasig länk kan redigeras utan att du behöver ge dig in i varje enskilt inlägg vilket är riktigt användarvänligt. Du kan välja att ta bort länken helt, modifiera den och få utökad information om länken t.ex. ankartexten.