Nya affärer

• Forumdelen är byggd i bbPress
• Artiklarna på förstasidan går att sortera i valfri ordning genom ”dra-och-släpp”-funktionalitet i admingränssnittet.
• Specialfunktionalitet för att visa faktarutor och ”se också”-länkar.
• Senaste forumdiskussionerna syns på startsidan
• Cachehantering via WP-Supercache

Exempel 1

function bloginfo_shortcode( $atts ) {
    extract(shortcode_atts(array(
        'key' => '',
    ), $atts));
    return get_bloginfo($key);
}
add_shortcode('bloginfo', 'bloginfo_shortcode');

Funktionen add_shortcode registrerar en ny shortcode, och i exemplet ovan betyder det att om man skriver [bloginfo] i ett inlägg, så kommer funktionen bloginfo_shortcode() att anropas. Just i det här exemplet ska man dessutom skicka med en parameter, det ser ut så här: [bloginfo key=”template_url”]
(Exemplet kommer från Blue Anvil)

Exempel 2

Jag har i ett tidigare inlägg visat hur man kan koppla en spotifylista till en wordpress-post, en metod som jag använder på http://topp30.se.
Jag vill utnyttja det faktum att listorna nu ligger som egna fält, och skapa en sida med alla spotifylistor i en lång (nåja) HTML-lista.
Steg ett är att definiera en funktion som hämtar alla inlägg med ”spotify-fält” och sen generera en lista av dem.
Nästa steg är att koppla en shortcode till den funktionen.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40

// [spotifylist] - shortcode function
function spotify_sc_func($atts) {
   ob_start();
?>
   <ul id="spotifylist">
   <?php
   global $wpdb, $post;
   $querystr = "
    SELECT wposts.* 
    FROM $wpdb->posts wposts, $wpdb->postmeta wpostmeta
    WHERE wposts.ID = wpostmeta.post_id 
    AND wpostmeta.meta_key = 'spotify' 
    AND wposts.post_status = 'publish' 
    AND wposts.post_date < NOW() 
    ORDER BY wposts.post_type, wposts.post_date DESC
    ";
 
   $pageposts = $wpdb->get_results($querystr, OBJECT);
?>
   <?php if ($pageposts): ?>
      <?php foreach ($pageposts as $post): ?>
         <?php setup_postdata($post); ?>
	 <?php $spotify = get_post_custom_values("spotify"); ?>
         <li><?php echo the_title(); ?>: <a href='<?php echo $spotify[0]; ?>'>spotify</a> | <a href="<?php the_permalink(); ?>">text</a></li>
      <?php endforeach; ?>
 
   <?php else : ?>
      <h2 class="center">Not Found</h2>
      <p class="center">Sorry, but you are looking for something that isn't here.</p>
   <?php endif; ?>
 
 
   </ul>
   <?php
   $output = ob_get_contents();
   ob_end_clean();
   return $output;
}
 
add_shortcode('spotifylist', 'spotify_sc_func');

Nu återstår bara att skapa en sida som använder vår nya shortcode.

Och resultatet ser blir det här

Läs också Mastering WordPress Shortcodes på Smashing Magazine.

Länken till spotifylistan finns i varje inlägg som en vanlig textlänk, men den ligger ofta på olika ställen, har olika ankartext och kan vara lite svår att hitta. Därför la jag till en genererad spotifylänk som alltid hamnar på samma ställe, uppe till höger i varje inlägg. Lättare att hitta, mer konsekvent.

Detta kan man åstadkomma genom att lägga spotifylänken som ett ”eget fält”, ändra i varje template-fil på rätt ställe (index.php/archive.php/search.php etc.) och där läsa in spotify-fältet och visa länken, men det blir opraktiskt att underhålla, lätt att göra fel och lite fult.

En betydligt snyggare lösning är att använda WordPress filterfunktionalitet.

Steg 1:
Lägg spotifylänken som ett ”Eget fält” (för varje inlägg som har en spotifylista).

Steg 2:
Lägg till en funktion (i functions.php), som visar en länkad spotify-logga när det finns en lista tillgänglig.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

function spotify_content($content) {
	global $post;
	$meta_key = 'spotify';
	$extra_info = "";
	$spotify_logo = get_bloginfo('template_url') . "/img/spotify.png";
	$meta_value = get_post_meta($post->ID, $meta_key, TRUE);
	if($meta_value != '') {
		$extra_info = <<<EOT
			<div class="spotify-link">
				<a href="$meta_value"><img src="$spotify_logo" alt="Lyssna på låtarna via Spotify" /></a>
			</div>
EOT;
	}
	return $extra_info . $content;
}

Steg 3:
Lägg till ett filter, som anropar spotify_content varje gång WordPress-funktionen the_content anropas. Det är the_content som visar texten i ett blogginlägg så den kommer definitivt att anropas från exempelvis single.php och index.php (det finns undantag, se längre ner)

add_filter( 'the_content', 'spotify_content' );

Steg 4:
Lägg till en css-klass i style.css som lägger din div som du vill ha den. Den allra enklaste varianten blir så här:

1
2
3

.spotify-link {
   float: right;
}

Och det var allt. Resultatet, med en klickbar spotify-logga för varje spotifierat inlägg blir så här:

topp30.se med automatisk spotifylänk

Observera att ibland används the_excerpt stället för the_content i mallarna. Det är när man bara vill visa ett utdrag ur inläggen istället för hela texten.
Om man vill ha spotify-länken även i dessa mallar så är det inte svårare än att man lägger in ett filter för the_excerpt också:

add_filter( 'the_excerpt', 'spotify_content' );

Aktiverade tillägg

  Akismet 2.3.0
» Automattic (url)
Akismet checks your comments against the Akismet web service to see if they look like spam or not. You need an API key to use it. You can review the spam it catches under ”Comments.” To show off your Akismet stats just put <?php akismet_counter(); ?> in your template. See also: WP Stats plugin.

  Analytics360 1.2.2
» Crowd Favorite (url)
Allows you to pull Google Analytics and MailChimp data directly into your dashboard, so you can access robust analytics tools without leaving WordPress. Compliments of MailChimp.

  Clicky for WordPress 1.1.4
» Joost de Valk (url)
Integrates Clicky on your blog!

  Contact Form 7 2.3
» Takayuki Miyoshi (url)
Just another contact form plugin. Simple but flexible.

  FaceBook Share (New) 1.9.2
» Appointy.com (url)
Adds a button which allows you to share post and also shows the number of times the post or page has been shared through out the Facebook just like tweetmeme button does for twitter.

  FD Feedburner Plugin 1.42
» John Watson (url)
Redirects all feeds to a Feedburner feed

  Fix Image Margins 1.0.2
» Justin Adie (url)
removes the arbitrary 10px margin from the new caption based images

  Flickr Gallery 1.4.0
» Dan Coulter (url)
Use easy shortcodes to insert Flickr galleries and photos (and videos) in your blog.

  flickrRSS 5.1
» Dave Kellam and Stefano Verna (url)
Allows you to integrate the photos from a flickr rss feed into your site.

  FollowMe 2.0.4
» WPburn.com (url)
WP FollowMe is a wordpress plugin that allow you to add a twitter Follow me badge on your wordpress blog.

  Google Analyticator 6.1.1
» Ronald Heft (url)
Adds the necessary JavaScript code to enable Google’s Analytics. After enabling this plugin visit the settings page and enter your Google Analytics’ UID and enable logging.

  Google Friend Connect Integration 0.9.7.4
» Social Mind (url)
Easily integrate Google Friend Connect with Wordpress. To get started, please enter your Google Friend Connect Site Id number in the GFC Integration admin page and choose whether to turn on the social bar or not. You can add Google Friend Connect gadgets to your sidebars by visiting the widgets page. For help and support see the official Google Friend Connect integration for WordPress page.

  Google XML Sitemaps 3.2.4
» Arne Brachhold (url)
This plugin will generate a special XML sitemap which will help search engines like Google, Yahoo, Bing and Ask.com to better index your blog.

  HeadSpace2 3.6.33
» John Godley (url)
Meta-data manager on steroids, allowing complete control over all SEO needs such as keywords/tags, titles, description, stylesheets, and many many other goodies.

  Inline Google Docs 0.9
» Lim Jiunn Haur (url)
Inline Google Docs allows the user to display contents of his google documents in his pages/posts, using shortcode for markup. Requires PHP 5, Prototype, and jQuery.

  IntenseDebate 2.8
» IntenseDebate & Automattic (url)
IntenseDebate Comments enhance and encourage conversation on your blog or website. Full comment and account data sync between IntenseDebate and WordPress ensures that you will always have your comments. Custom integration with your WordPress admin panel makes moderation a piece of cake. Comment threading, reply-by-email, user accounts and reputations, comment voting, along with Twitter and friendfeed integrations enrich your readers’ experience and make more of the internet aware of your blog and comments which drives traffic to you! To get started, please activate the plugin and adjust your IntenseDebate settings .

  Kill ie6 1.07
» Jonk (url)
Adds a warning at the top of each page visible to users that are still using Internet Explorer 6.

  Last.fm Recently Played Tracks 1.0.7
» Justin Turner (url)
Last.fm widget that supports customization for showing album art, how many tracks, and username. More customization to come soon! On load, uses jQuery (if JS enabled browser) to decrease page load time, but is still backwards compatible for non JS browsers. Shows track name, artist, and time played. No pesky ”Support us” links.

  Recommended Reading: Google Reader Shared 4.0.4
» Jacob M Goldman (C. Murray Consulting) (url)
Pulls shared items from your Google Reader account for display in a sidebar widget or within pages or posts. Easily customized with friendly interface. Embed in page or post via shortcode; can always show newest, or start at post publication date!

  ServerBuddy 0.1.6
» Dustin Bolton (url)
Tests server & hosting configuration to determine problems & compatibility with various WordPress themes and plugins. By PluginBuddy.

  Smart Youtube 3.7
» Vladimir Prelovac (url)
Insert YouTube videos in posts, comments and RSS feeds with ease and full customization.

  Twitter Tools 2.3.1
» Alex King (url)
A complete integration between your WordPress blog and Twitter. Bring your tweets into your blog and pass your blog posts to Twitter. Show your tweets in your sidebar, and post tweets from your WordPress admin.

  W3 Total Cache 0.9.1.1
» Frederick Townes (url)
The fastest and most complete WordPress performance plugin. Dramatically improve the speed and user experience of your site. Add browser, page, object and database caching as well as minify and content delivery network (CDN) to WordPress.

  WordPress Beta Tester 0.93
» Peter Westwood (url)
Allows you to easily upgrade to Beta releases.

  WordPress Related Posts 1.2
» Denis (url)
Generate a related posts list via tags of WordPress

  WP-Infobox 0.7
» Jonas Nordstrom (url)
Add an info box to posts. You can add title, ingress, a bullet list and ”more text”

  WP-PluginsUsed 1.50
» Lester 'GaMerZ' Chan (url)
Display WordPress plugins that you currently have (both active and inactive) onto a post/page.

  WP-Stats 2.50
» Lester 'GaMerZ' Chan (url)
Display your WordPress blog statistics. Ranging from general total statistics, some of my plugins statistics and top 10 statistics.

  WP-Syntax 0.9.8
» Ryan McGeary (url)
Syntax highlighting using GeSHi supporting a wide range of popular languages. Wrap code blocks with <pre lang="LANGUAGE" line="1"> and </pre> where LANGUAGE is a geshi supported language syntax. The line attribute is optional.

  Yo Status 0.1
» Jonas Nordstrom (url)
Display your yo.se status in sidebar

Inaktiva tillägg

  FeedBurner FeedSmith 2.3.1
» FeedBurner (url)
Originally authored by Steve Smith, this plugin detects all ways to access your original WordPress feeds and redirects them to your FeedBurner feed so you can track every possible subscriber.

  Fix Rss Feeds 2.0
» flyaga li (url)
fix wordpress rss feed error ”Error on line 2: The processing instruction target matching ”[xX][mM][lL]” is not allowed.” while you burn wordpress rss feed from http://www.feedburner.com, also fix error ”XML or text declaration not at start of entity” in firefox, and fix error ”XML declaration not at beginning of document” in opera.

  Hello Dolly 1.5.1
» Matt Mullenweg (url)
This is not just a plugin, it symbolizes the hope and enthusiasm of an entire generation summed up in two words sung most famously by Louis Armstrong: Hello, Dolly. When activated you will randomly see a lyric from Hello, Dolly in the upper right of your admin screen on every page.

  MaxBlogPress Ping Optimizer 2.2.5
» MaxBlogPress (url)
Saves your wordpress blog from getting tagged as ping spammer by installing this plugin. Adjust your settings here.

  RSS Cloud 0.4.1
» Joseph Scott (url)
Ping RSS Cloud servers

  SharedItems2WP 2.0.4
» Craig Fifield (Google Tutor), Jonas Skovmand, Joakim Jardenberg and Marcus Fridholm (url)
Scheduled automatic posting of Google Reader Shared Items.

  Twitter Avatar 1.1
» BusinessXpand.com (url)
Allows a User to enter their Twitter username when posting a comment on your blog and a link to their Twitter page will appear next to their comment. This plugin will also replace the avatar on the comment with their picture on Twitter.

  Twitter Tools - Bit.ly URLs 2.3.1
» Crowd Favorite (url)
Use Bit.ly for URL shortening with Twitter Tools. This plugin relies on Twitter Tools, configure it on the Twitter Tools settings page.

  Twitter Tools - Exclude Category 2.3.1
» Crowd Favorite (url)
Exclude posts in certain categories from being tweeted by Twitter Tools. This plugin relies on Twitter Tools, configure it on the Twitter Tools settings page.

  Twitter Tools - Hashtags 2.3.1
» Crowd Favorite (url)
Set #hashtags for blog post tweets sent by Twitter Tools. This plugin relies on Twitter Tools, configure it on the Twitter Tools settings page.

  WP-Referer 1.0
» Henry Lu (url)
Add referer to Comments list

  WP-Yo-status 0.1
» Jonas Nordström (url)
Display Yo-status

  WUN Usertags 0.4
» Jonas Nordstrom (url)
User tags

Här kommer en omotiverad bild, som test

Du vet säkert att en widget är en plugin-liknande funktion som man kan placera någonstans på sin WordPress-sajt, ofta hamnar den i sidomenyn. Vanliga exempel är ”Arkiv”, ”Taggmoln” eller ”Senaste flickr-bilderna”.

Det fungerar så att man i ett tema har definierat ett antal utrymmen där man kan placera widgets, dessa utrymmen kallas för ”sidebars”. Sidebars kan man placera i sidomenyn, footern eller egentligen var som helst i temat. I varje ”sidebar” kan sen sajt-administratören dra in en eller flera widgets.
Hos mig ser det ut så här, under ”Utseende” -> ”Widgets”.

Widgets i WordPress dashboard

Från och med WordPress 2.8 har det blivit lättare att skapa egna widgets. Man utgår från basklassen WP_Widget och implementerar en del av metoderna.
De här metoderna måste man implementera:

class My_Widget extends WP_Widget {
	function My_Widget() {
		// widget actual processes
	}
 
	function widget($args, $instance) {
		// outputs the content of the widget
	}
 
	function update($new_instance, $old_instance) {
		// processes widget options to be saved
	}
 
	function form($instance) {
		// outputs the options form on admin
	}
}
register_widget('My_Widget');

Jag tänkte bygga en widget som visar min senaste status-uppdatering från sajten Yo!. Genom att logga in på yo.se och gå till URL:en http://yo.se/widget/, får man en HTML-snutt som egentligen gör hela jobbet åt oss när det gäller att visa senaste status. den ser ut så här:

<div class="yo-widget" id="_yo_windyjonas">
  <h1><a href="http://windyjonas.yo.se/" title="Jonas Nordström">Windyjonas</a></h1>
  <script src="http://yo.se/widget/1/w.js" type="text/javascript" charset="utf-8"></script>
  <script type="text/javascript" charset="utf-8">
    _yo.username = "windyjonas";
    _yo.hostname = "http://yo.se";
    _yo.style = "http://yo.se/widget/1/w.css";
    _yo.init();
  </script>
</div>

Det allra enklaste hade förstås varit att klippa in den här koden i en text-widget, men då hade det här inte blivit ett exempel på hur man skapar en WordPress-widget, så vi struntar i det och går vidare

Jag kallar widgeten för ”Yo Status”, så min widgetklass ska få namnet ”Yo_Status_Widget” och de metoder jag ska implementera blir följaktligen:

• Yo_Status_Widget() – konstruktor
• widget() – funktionen som ska skicka ut widget-koden till webbläsaren
• update() – Det ska gå att konfigurera widgeten. update() ser till så att man kan ändra aliasnamn (yo-användare)
• form() – Skapar formuläret för att ändra aliasnamn

Yo_Status_Widget()

Skapa ett WP_Widget-objekt med rätt metainfo och options. ”classname” nedan är alltså css-klassen i det omslutande HTML-elementet.

function Yo_Status_Widget() {
	$widget_ops = array('classname' => 'widget_yo_status', 
            'description' => 'Display status from Yo! (http://yo.se)' );
	$this->WP_Widget('yo-status', __('Yo Status'), $widget_ops);
}

widget()

function widget($args, $instance) {
	extract($args, EXTR_SKIP);
 
	echo $before_widget;
	$alias = empty($instance['alias']) ? ' ' :
          apply_filters('widget_alias', $instance['alias']);
   ?>
    <div class="yo-widget" id="_yo_<?php echo $alias ?>">
		  <h1><a href="http://<?php echo $alias ?>.yo.se/">
                 <?php echo $alias ?></a></h1>
		  <script src="http://yo.se/widget/1/w.js" 
                     type="text/javascript" charset="utf-8"></script>
		  <script type="text/javascript" charset="utf-8">
		    _yo.username = "<?php echo $alias ?>";
		    _yo.hostname = "http://yo.se";
		    _yo.style = "http://yo.se/widget/1/w.css";
		    _yo.init();
		  </script>
		</div>
		<?php
	echo $after_widget;
}

update()

Den här funktionen anropas efter att användaren matat in ett yo-alias och klickat på ”Spara”

function update($new_instance, $old_instance) {
	$instance = $old_instance;
	$instance['alias'] = strip_tags($new_instance['alias']);
 
	return $instance;
}

Formuläret som möjliggör ändring av yo-användare.

form()

	function form($instance) {
		$instance = wp_parse_args( (array) $instance, array( 'alias' => '') );
		$alias = strip_tags($instance['alias']);
?>
		<p>
			<label for="<?php echo $this->get_field_id('alias'); ?>">Alias på yo.se: 
				<input class="widefat" id="<?php echo $this->get_field_id('alias'); ?>" 
					name="<?php echo $this->get_field_name('alias'); ?>" type="text" 
					value="<?php echo attribute_escape($alias); ?>" />
			</label>
		</p>
<?php
	}

Resultat

Till slut bakar jag ihop alltihop till en ny plugin. Det hade i och för sig gått att deklarera hela widgeten i functions.php, men jag föredrar att inte röra temafilerna så mycket.
Jag gjorde en plugin av alltihop genom att skapa filen /wp-contents/plugins/yo-status/yo-status.php. En del av outputen i widget()-metoden är här utbruten i en egen metod.

<?php 
/* 
Plugin Name: Yo Status
Plugin URI: http://jonasnordstrom.se/yo-status-widget 
Description: Display your yo.se status in sidebar
Version: 0.2
Author: Jonas Nordstrom
Author URI: http://jonasnordstrom.se
*/
 
add_action( 'widgets_init', 'yo_status_load_widgets' );
 
function yo_status_load_widgets() {
	register_widget( 'Yo_Status_Widget' );
}
class Yo_Status_Widget extends WP_Widget {
	function Yo_Status_Widget() {
		$widget_ops = array('classname' => 'widget_yo_status', 'description' => 'Display status from Yo! (http://yo.se)' );
		$this->WP_Widget('yo-status', __('Yo Status'), $widget_ops);
	}
 
	function yo_status($alias) {
		?>
		<div class="yo-widget" id="_yo_<?php echo $alias ?>">
		  <h1><a href="http://<?php echo $alias ?>.yo.se/"><?php echo $alias ?></a></h1>
		  <script src="http://yo.se/widget/1/w.js" type="text/javascript" charset="utf-8"></script>
		  <script type="text/javascript" charset="utf-8">
		    _yo.username = "<?php echo $alias ?>";
		    _yo.hostname = "http://yo.se";
		    _yo.style = "http://yo.se/widget/1/w.css";
		    _yo.init();
		  </script>
		</div>
		<?php
	}
 
	function widget($args, $instance) {
		extract($args, EXTR_SKIP);
 
		echo $before_widget;
		$alias = empty($instance['alias']) ? '&nbsp;' : apply_filters('widget_alias', $instance['alias']); 
        $this->yo_status($alias);
		echo $after_widget;
	}
 
	function update($new_instance, $old_instance) {
		$instance = $old_instance;
		$instance['alias'] = strip_tags($new_instance['alias']);
 
		return $instance;
	}
 
	function form($instance) {
		$instance = wp_parse_args( (array) $instance, array( 'alias' => '') );
		$alias = strip_tags($instance['alias']);
?>
			<p><label for="<?php echo $this->get_field_id('alias'); ?>">Alias på yo.se: <input class="widefat" id="<?php echo $this->get_field_id('alias'); ?>" name="<?php echo $this->get_field_name('alias'); ?>" type="text" value="<?php echo attribute_escape($alias); ?>" /></label></p>
<?php
	}
}
?>

Resultatet syns längst ner i högersplaten, eller om jag ändrat något, så såg det en gång ut så här:

Exempel på hur Yo Status kan se ut

Så här ser det ut i den senaste officiella WordPress-versionen (2.8.4) när man vill redigera bilder:

I den senaste utvecklar-versionen (från WordPress svn) ser det helt annorlunda ut:

Bildredigering i WordPress 2.9

Notera de nya valen för att grafiskt markera ett område och beskära, fungerar riktigt bra!

Läs mer om nyheterna i WordPress 2.9.

Uppdatera nu, även om du inte blivit attackerad! Ja, det är så allvarligt. Om du redan blivit angripen, läs Lorelles instruktioner om hur du återställer din WordPress-miljö

Läs mer här och kanske framförallt här.

Ladda hem programmet WordPress for iPhone från iTunes app store (antingen från iTunes eller direkt från app store i telefonen)

Om du använde iTunes, så måste du förstås synka telefonen nu, så att programmet hamnar på din iPhone.

Starta WordPress-programmet på iPhone
Första bilden ser ut något i stil med:

Programmets startbild

Välj ”Set up your blog”, och du hamnar här:

Lägg till ny blogg

Fyll i adressen till din blogg, och användaruppgifterna, och välj ”Save”. Om allt har fungerat så kommer du tillbaka till startsidan igen, men nu har din blogg lagts till som ett av alternativen i listan. Om du får felmeddelandet “We could not find the XML-RPC service for your blog”, så måste du gå till administrationspanelen för din blogg och aktivera protokollet XML-RPC, det gör du under ”Inställningar” -> ”Skriva” -> ”Fjärrstyrd publicering” -> ”XML-RPC”, kryssa i den rutan där det står ”Aktivera WordPress, Movable Type, MetaWeblog och Blogger XML-RPC publiceringsprotokoll.”. Om du fortfarande har problem, se om du kan hitta en lösning i FAQ:n.
När allt fungerar kommer det att se ut så här:

Bloggen finns nu med i listan

Välj din blogg, då hamnar du här:

Inne i bloggen, startsida

Härifrån kan du alltså välja att skapa eller redigera inlägg och sidor, du kan också granska kommentarer härifrån.
Välj ”posts” för att komma till inläggen.

Om du vill skapa ett nytt inlägg, så väljer du ikonen längst ner till höger i bilden här ovanför.

Skapa nytt blogginlägg

Så, nu är det bara att fylla i titel, kategorier, etiketter och innehåll precis som vanligt.
Du kan lägga till bilder via knappen ”Photos”.
Välj sen ”Save” för att publicera, syns inte i bilden ovan, men den dyker upp när man börjar lägga till innehåll.

Lycka till! Mer instruktioner kan man få via videoklippen WordPress for iPhone och Introducing WordPress for iPhone 1.2 eller via den officiella hemsidan för WordPress for iPhone.