Idag för 7 år sedan skrev Matt Mullenweg (@photomatt) ett inlägg på Wordpress.org med rubriken WordPress Now Available. Första releasen var version 0.7 och sedan dess har mycket hänt. Nu väntar alla på version 3.0 som inte är långt ifrån att släppas.

Wordpress har under åren som gått utvecklats från en plattform för bloggar till att även fungera utmärkt som CMS för göra sajter. Innan jag fick upp ögonen för Wordpress använde jag uteslutande Joomla men har nu nästan helt gått över till Wordpress.

Har du inte testat Wordpress än rekommenderar jag verkligen att du ger det en chans, du kommer inte att ångra dig.

Vad är fördelen med att lägga shortcodes i en plugin?

Det vanligaste är att man lägger sina shortcodes i functions.php som finns i de flesta teman. De uppenbara nackdelarna med detta är att när man uppdaterar eller byter ut sitt tema och glömmer att kopiera över sina shortcodes till det nya temat kommer dessa att försvinna.

Lösningen på detta är att skapa ett plugin där man lägger alla sina shortcodes. På detta sätt blir de tillgängliga oberoende vilket tema du använder. Det är också väldigt lätt att flytta dem till andra bloggar.

Hur gör man ett plugin för sina shortcodes?

Börja med att skapa en fil som heter shortcodes.php. För att det ska gå att aktivera ett plugin i Wordpress måste följande rader finnas.

<?php
/*
Plugin Name: Name Of The Plugin
Plugin URI: http://URI_Of_Page_Describing_Plugin_and_Updates
Description: A brief description of the Plugin.
Version: The Plugin's Version Number, e.g.: 1.0
Author: Name Of The Plugin Author
Author URI: http://URI_Of_The_Plugin_Author
*/
?>

Nu när grunden är klar återstår det bara att lägga in alla shortcodes du vill använda.

Så här kan ett färdigt plugin se ut med en shortcode som skriver ut Hello World.

<?php
/*
Plugin Name: My plugin for shortcodes
Plugin URI: http://fredrikmalmgren.se/2010/05/tutorial–skapa-ett-plugin-for-dina-shortcodes-i-wordpress
Description: This is a plugin for all my shortcodes to separate them from my theme
Version: 1.0
Author: Fredrik Malmgren
Author URI: http://fredrikmalmgren.se
*/

function hello() {
 return 'Hello, World!';
}
add_shortcode('hw', 'hello');

?>

Lägg sedan denna fil i wp-content/plugins. När du gjort det borde du kunna se något liknande i Wordpress under Plugins.

Wordpress plugin för shortcodes

För att kunna börja använda sina shortcodes är det bara att man aktiverar sitt plugin.

Att göra ett plugin som endast ska användas för eget bruk ställer inte samma krav som ett plugin som man ska publicera i Wordpress plugin directory. Vill man göra ett plugin som ska publiceras krävs en del andra saker.

Vad är shortcodes?

Det finns tre grundtyper av shortcodes. Den enklaste varianten är att man endast skriver följande i sin bloggpost:

[adsense]

Ovan version ger inget utrymme för val av till exempel storlek på annonsen. Vill man kunna välja storlek kan man lägga till en parameter:

[adsense format=1]

Ovan version ger dig en AdSense annons med till exempel bredden 468 pixlar. Den sista typen är när man vill lägga till eget innehåll. Så här kan det se ut när man skapar en AdSense annons med en rubrik:

[adsense format=1]Annons:[/adsense]

Dessa koder skriver man helt enkelt in i sin editor där man vill att de ska bli synliga. När sedan en besökare läser din bloggpost kommer denna shortcode att översättas och den bakomliggande funktionen körs och visar innehållet i bloggposten.

Hur skapar man shortcodes?

Att skapa en shortcode är väldigt enkelt. Kan du skriva lite PHP har du stora möjligheter att skapa användbara shortcodes som kommer att spara mycket tid åt dig.

Först skapar vi den enklaste versionen av shortcode:

[adsense]

I detta fall finns det bara en typ av annons man kan välja på.

Börja med att öppna filen functions.php som ligger i ditt tema. Finns den inte kan du skapa den. Efter det skriver du in följande kod:

function add_adsense() {
return '<script type="text/javascript"><!--
google_ad_client = "pub-XXXXXXXXXXXXXX";
google_ad_slot = 'XXXXXXXXXX';
google_ad_width = 468;
google_ad_height = 60;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>';
}

Nu när funktionen är klar måste vi berätta för Wordpress att det är en shortcode och det gör vi med följande rad:

add_shortcode('adsense', 'add_adsense');

Den första parametern är vad du skriver i din bloggpost för att använda din shortcode och den andra är funktionens namn i functions.php

Om man vill använda sig av flera olika storlekar på annonser kan man lägga till en parameter som anger format. Då får man istället en shortcode som ser ut så här:

[adsense format =1]

I functions.php skriver man istället följande:

function add_adsense( $atts ) {
extract(shortcode_atts(array(
'format' => '1',
), $atts));
switch ($format) {
case 1 :
$ad = ' <script type="text/javascript"><!--
google_ad_client = "pub-xxxxxxxxxxxxxxxx";
google_ad_slot = "xxxxxxxxxx";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script>';
break;
case 2 :
$ad = ' <script type="text/javascript"><!--
google_ad_client = "pub-xxxxxxxxxxxxxxxx";
google_ad_slot = "xxxxxxxxxx";
google_ad_width = 300;
google_ad_height = 250;
//-->
</script>';
break;
}
$rest = '<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>';
return $ad.$rest;

}
add_shortcode('adsense', 'add_adsense');

Vill man lägga till flera annonstyper är det bara att lägga till fler case i koden ovan.
Om man vill bygga på sin shortcode ytterligare kan man välja att lägga till extra innehåll i form av en text som talar om att det är en annons på följande sätt.

 [adsense format=1]Annons:[/adsense]

I vår functions.php skriver vi då följande kod:

function add_adsense( $atts, $content = null ) {
extract(shortcode_atts(array(
'format' => '1',
), $atts));
switch ($format) {
case 1 :
$ad = ' <script type="text/javascript"><!--
google_ad_client = "pub-xxxxxxxxxxxxxxxx";
google_ad_slot = "xxxxxxxxxx";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script>';
break;
case 2 :
$ad = ' <script type="text/javascript"><!--
google_ad_client = "pub-xxxxxxxxxxxxxxxx";
google_ad_slot = "xxxxxxxxxx";
google_ad_width = 300;
google_ad_height = 250;
//-->
</script>';
break;
}
$rest = '<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>';

return = '<strong>'.$content. '</strong><br/>'.$adsense.$rest;

}
add_shortcode('adsense', 'add_adsense');

Det var tre exempel på olika typer av shortcodes man kan använda för att lägga till annonser från Google AdSense mitt i en bloggpost. Glöm inte bort att byta ut AdSense koden till din egen.

Läs mer om Wordpress shortcodes API.

Aktivera ministyrbilder i Wordpress

Det första man måste göra är att aktivera funktionen för miniatyrbilder. Man kan välja på om man vill aktivera det för både poster och sidor eller bara för någon av dem. Lägg till någon av följande rader i functions.php beroende på hur du vill göra.

add_theme_support( 'post-thumbnails' ); // post och sida
add_theme_support( 'post-thumbnails', array( 'post' ) ); // endast post
add_theme_support( 'post-thumbnails', array( 'page' ) ); // endast sida 

Nästa steg är att ange storleken för dina miniatyrbilder, även det i functions.php. Här har man lite olika val både när det gäller storleken på bilderna men även hur man ska beskära bilden. Det enklaste fallet är att ange miniatyrbilder enligt följande.

 set_post_thumbnail_size( 100, 100 );

Detta betyder att bilder är i storlek 100×100 pixlar och bilden förminskas tills den får plats inom angiven storlek. Anger man istället följande så betyder det att man beskär bilden i angiven storlek.

 set_post_thumbnail_size( 100, 100, true );

Det kan finnas tillfällen då man vill använda samma bild fast i en annan storlek på till exempel sidan som visar hela posten (single.php). Detta gör man genom att ange fler storlekar på detta sätt i functions.php.

 add_image_size( 'single-post-thumbnail', 400, 9999 );

Visa miniatyrbilder på sajten

För att sedan visa miniatyrbilderna i home.php eller index.php anger man följande kod.

<?php the_post_thumbnail(); ?>

För att visa bilder på single.php i den större storleken anger man följande.

<?php the_post_thumbnail( 'single-post-thumbnail' ); ?>

Stöd tidigare versioner av Wordpress

Om man utvecklar ett tema som man planerar att publicera kan man lägga till funktioner som kontrollerar vilken version av Wordpress man använder och om inlägget verkligen har en miniatyrbild. Ange följande kod i function.php för att kontrollera vilken version av Wordpress du använder. Använder man version 2.9 eller nyare aktiverar man funktionen för miniatyrbilder.

if ( function_exists( 'add_theme_support' ) ) { // Från och med 2.9
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 100, 100, true ); // index.php eller home.php
add_image_size( 'single-post-thumbnail', 400, 9999 ); // single.php
}

För att kontrollera om en post innehåller en miniatyrbild anger man följande.

if ( has_post_thumbnail() ) {
the_post_thumbnail(); // posten har en miniatyrbild
} else {
// posten saknar en miniatyrbild
}

Använd CSS med dina thumbnails

Vill man använda CSS tillsammans med sina miniatyrbilder kan man såklart göra det.

the_post_thumbnail('single-post-thumbnail', array('class'=>'thumbnail')); 

Hur fungerar det för användare?

Efter att ha gått igenom hur man aktiverar miniatyrbilder i sitt tema ska vi kolla på hur det fungerar när man väl skriver inlägg i sin blogg eller på sin webbsida.

Har man gjort allt ovanstående och går till sidan där man skriver sina inlägg så ser man följande box där man kan ladda upp en miniatyrbild.

Ladda upp en miniatyrbild

Om man klickar på Set thumbnail i bilden ovan så kommer man till den vanliga bilduppladdningen i Wordpress men nu så har man fått ytterligare ett val att använda bilden som miniatyrbild (thumbnail).

Använd som miniatyrbild

När detta är gjort så ser man den uppladdade bilden direkt på sidan.

Förhandsgranska inläggets miniatyrbild

Svårare än så är det inte att aktivera miniatyrbilder i sitt tema och att använda funktionen när man skriver inlägg på sin blogg.

1. Om du har tillgång till php.ini, kan man ändra följande rad till 64M istället för 32M

memory_limit = 64M;

2. Om du inte har tillgång till php.ini, kan man lägga till följande rad till sin .htaccess

php_value memory_limit 64M

3. Ett annat alternativ är att lägga till följande rad till sin wp-config.php

define('WP_MEMORY_LIMIT', '64M');

4. Sista alternativet är att ta kontakt med ditt webbhotell

För mig fungerade lösning nummer två bra.

Servage

I veckan blev jag godkänd för Google AdSense så jag satt en stund med det i helgen och testade lite saker. Nu ligger det annonser efter första inlägget på bloggen. Jag har också lagt upp en banner till Servage där jag har denna blogg. Annonsen genererar inga pengar per klick eller visningar utan endast om någon registrerar sig för ett nytt konto hos dem. Dealen är att man får 2 månaders extra abonnemangstid plus 75 GB extra utrymme. Även den som registrerar sig får 75 GB extra. Hittills är jag väldigt nöjd med Servage. Just nu får man även en Google AdWords kupong på 400 kronor när man registrerar sig.

I helgen har jag inte bara jobbat med egna saker. Jag har även gjort en sajt baserad på Wordpress till ett företag. Har lite småsaker kvar att fixa men i det stora hela är den klar. Det är skönt med lite inkomster i företaget och inte bara utgifter. Tyvärr så är jag alldeles för dålig på att ta betalt, måste ta mig i kragen på den punkten.

I torsdags hade vi på Squace en fest, många intressanta människor kom. Jag ska försöka komma över lite bilder som jag kan lägga upp på bloggen. Mer om festen i senare inlägg.

Efter att jag installerat om Wordpress och aktiverat samma plugins som förut är knapparna än så länge kvar i editorn. Jag har fortfarande ingen aning om vad som gjorde att knapparna försvann, bara att hoppas att de håller sig kvar. En sak är säker, backup är något jag ska vara noga med ifall detta händer igen.