Categorieën
SQL WordPress

WordPress oude URL’s vervangen met nieuwe URL’s

Bij Pronamic ontwikkel ik WordPress websites en zetten we regelmatige bestaande websites om naar WordPress. Hierbij komt het vaak voor dat er bestaande berichten omgezet moeten worden naar WordPress. Met allerlei handige tools zoals bijvoorbeeld OutWit en de vele WordPress importeer plugins gaat dit vaak relatief eenvoudig.

Bij het importeren van berichten van een website naar een nieuwe WordPress website is het vaak erg handig om de bron URL op te slaan bij het nieuwe WordPress bericht. De extra velden functionaliteit bij WordPress berichten zijn hier zeer geschikt voor. Zodra de content is omgezet is het vaak noodzakelijk om interne koppeling bij te werken. Daarnaast is het vaak gewenst om oude URL’s netjes om te leiden (HTTP 303 redirect) naar de nieuwe URL’s.

Doordat de oude en nieuwe URL’s netjes zijn weggeschreven in de WordPress database kan dit met een aantal slimme MySQL queries gerealiseerd worden. De volgende query zal een lijst met queries genereren die de inhoud van alle WordPress berichten en pagina’s doorzoekt en oude URL’s vervangt met de nieuwe WordPress URL’s:

SELECT
	CONCAT(
		'UPDATE wp_posts SET post_content = REPLACE(post_content, ' ,
		QUOTE(meta.meta_value) , ', ' ,
		QUOTE(post.guid) , ');'
	)
FROM
	wp_posts AS post
		RIGHT JOIN
	wp_postmeta AS meta
		ON
			post.ID = meta.post_id
				AND
			meta.meta_key = 'legacy_url'
WHERE
	post.guid != '';

De output van bovenstaande query zijn nieuwe queries welke uiteraard uitgevoerd moeten worden. Het komt soms voor dat de interne links relatief zijn aan de berichten zelf. Dit maakt het vervangen van de oude URL’s in veel gevallen veel complexer. Als de URL’s relatief zijn aan de domeinnaam dan is waarschijnlijk interessant om eerst de volgende query uit te voeren:

UPDATE wp_posts SET post_content = REPLACE(post_content, 'href="/', 'href="http://www.domeinnaam.nl/');

In andere gevallen zullen er slimme queries uitgevoerd moeten worden, zoals bijvoorbeeld:

UPDATE wp_posts SET post_content = REPLACE(post_content, 'href="../../../nieuws/', 'href="http://www.domeinnaam.nl/nieuws/');

Daarnaast kan met de volgende query een overzicht gemaakt worden van alle oude en nieuwe URL’s. Dit overzicht kan vervolgens geïmporteerd worden naar de Redirection plugin waarmee eenvoudig omleidingen zijn te beheren.

SELECT
	REPLACE(meta.meta_value, 'http://www.domeinnaam.nl', '') AS source ,
	post.guid AS target ,
	0 as hits
FROM
	wp_posts AS post
		RIGHT JOIN
	wp_postmeta AS meta
		ON
			post.ID = meta.post_id
				AND
			meta.meta_key = 'legacy_url'
WHERE
	post.guid != '';
Categorieën
JavaScript jQuery PHP WordPress

WordPress menu met geluid

Onlangs kreeg ik de vraag hoe je een geluidsfragment kunt afspelen zodra je over een WordPress menu item heen gaat met je muis. Op internet is veel informatie te vinden over hoe je een geluidsfragment kunt afspelen, maar hoe integreer je deze netjes in een WordPress thema? In dit bericht beschrijf ik kort een mogelijk oplossing.

Allereerst is het handig om een map ‘audio’ aan te maken binnen je WordPress thema map. Binnen deze map kun je alle gerelateerde audio bestanden plaatsen die je wilt afspelen zodra men met de muis over een menu item gaat. Vervolgens voegen we aan het WordPress functions.php bestand een aantal functies toe:

/**
 * Menu audio
 *
 * @return array
 */
function prefix_menu_audio() {
	$dir = get_stylesheet_directory_uri();

	return array(
		'beep' => array($dir . '/audio/beep.mp3', $dir . '/audio/beep.ogg') ,
		'end' => array($dir . '/audio/end.mp3', $dir . '/audio/end.ogg')
	);
}

In bovenstaand code fragment worden 2 audio fragmenten gedefinieerd in 2 verschillende formaten, namelijk MP3 en OGG. Om deze audio fragmenten te kunnen afspelen moeten ze worden toegevoegd aan de HTML van de website. Dit kunnen we realiseren met behulp van de volgende functie:

/**
 * Menu beep HTML
 */
function prefix_menu_audio_html() {
	$html = '';

	$audio = prefix_menu_audio();

	foreach($audio as $id => $sources) {
		$html .= sprintf('<audio id="%s">', esc_attr($id));
		foreach($sources as $source) {
			$html .= sprintf('<source src="%s" />', esc_attr($source));
		}
		$html .= '</audio>';
	}

	echo $html;
}

add_action('wp_footer', 'prefix_menu_audio_html');

Met behulp van bovenstaande functie wordt er voor gezorgd dat de gedefinieerde audio fragmenten in een nette HTML5 formaat in de footer van de WordPress website worden geplaatst. Vervolgens kunnen we met behulp van een aantal regels code JavaScript / jQuery deze audio fragmenten afspelen. Om dit te realiseren maken we maken een JavaScript bestand menu-audio.js aan in de WordPress thema map.

jQuery(document).ready(function($) {
	$(".menu a").mouseenter(function() {
		$("#beep").trigger("play");
	});
});

Dit bestand kan met behulp van de volgende functie worden toegevoegd aan de WordPress website zodat deze wordt uitgevoerd:

/**
 * Menu beeps enqueue scripts
 */
function prefix_enqueue_scripts_menu_audio() {
	wp_enqueue_script(
		'menu-audio' ,
		get_stylesheet_directory_uri() . '/menu-audio.js' ,
		array('jquery')
	);
}

add_action('wp_enqueue_scripts', 'prefix_enqueue_scripts_menu_audio');

In dit voorbeeld wordt slecht 1 audio fragment afgespeeld voor alle menu items. Met een beetje WordPress en jQuery kennis is dit natuurlijk eenvoudig uit te breiden.

Update: Voor het gemak heb ik een kant en klare WordPress menu audio oplossing klaar gezet, welke uitgepakt kan worden in je thema map en geactiveerd kan worden door include 'menu-audio/menu-audio.php'; in je thema’s functions.php bestand te plaatsen.

Categorieën
E-commerce PHP WooCommerce WordPress

WordPress Google Conversion shortcode

Om Google Conversion doelen bij te houden moet je soms op bepaalde pagina’s een zogenaamde Google Conversion code plaatsen. Binnen WordPress installatie kan het toevoegen van dergelijke codes soms lastig zijn. Daarom heb ik een eenvoudig WordPress shortcode gemaakt waarmee je eenvoudig een Google Conversion code kunt toevoegen aan je WordPress pagina’s.

/**
 * Google Conversion Code
 */
function prefix_shortcode_google_conversion_code($atts) {
	extract(shortcode_atts(array(
		'id' => null , 
		'language' => 'en' , 
		'format' => 3 , 
		'color' => '666666' , 
		'label' => '' , 
		'value' => 0 , 
	), $atts));

	$crlf = "\r\n";

	$noScriptImageUrl = sprintf('http://www.googleadservices.com/pagead/conversion/%d/', $id);
	$noScriptImageUrl = add_query_arg(array(
		'label' => $label , 
		'guid' => 'ON' , 
		'script' => 0
	), $noScriptImageUrl);

	$output = '';

	$output .= '<!-- Google Code for Bezoekers Pagina Douchegoten Remarketing List -->' . $crlf;
	$output .= '<script type="text/javascript">' . $crlf;
	$output .= '/* <![CDATA[ */' . $crlf;
	$output .= sprintf('var google_conversion_id = %d;', $id) . $crlf;
	$output .= sprintf('var google_conversion_language = "%s";', $language) . $crlf;
	$output .= sprintf('var google_conversion_format = "%s";', $format) . $crlf;
	$output .= sprintf('var google_conversion_color = "%s";', $color) . $crlf;
	$output .= sprintf('var google_conversion_label = "%s";', $label) . $crlf;
	$output .= sprintf('var google_conversion_value = %d;', $value) . $crlf;
	$output .= '/* ]]> */' . $crlf;
	$output .= '</script>' . $crlf;

	$output .= '<script type="text/javascript" src="http://www.googleadservices.com/pagead/conversion.js">' . $crlf;
	$output .= '</script>' . $crlf;

	$output .= '<noscript>' . $crlf;
	$output .= '<div style="display:inline;">' . $crlf;
	$output .= sprintf('<img height="1" width="1" style="border-style:none;" alt="" src="%s"/>', esc_attr($noScriptImageUrl)) . $crlf;
	$output .= '</div>' . $crlf;
	$output .= '</noscript>' . $crlf;

	return $output;
}

add_shortcode('google_conversion_code', 'prefix_shortcode_google_conversion_code');

Deze shortcode is met name interessant zijn in combinatie met WordPress webwinkel plugins zoals WooCommerce of Jigoshop. Om de shortcode ook op de product categorieën te kunnen gebruiken zullen de shortcodes ook toegepast moeten worden op de product categorieën beschrijvingen.

/**
 * Add shortcode support to term description
 */
function prefix_term_description($description) {
	if(is_archive()) {
		$description = do_shortcode($description);
	}

	return $description;
}

add_filter('term_description', 'prefix_term_description');
Categorieën
E-commerce iDEAL WordPress

iDEAL voor Shopp 1.2

Op woensdag 6 juli 2011 werd door de ontwikkelaars van de Shopp plugin versie 1.2 aangekondigd. Er werd een indrukwekkende lijst aan verbeterpunten en nieuwe functionaliteiten genoemd. Ik had gehoopt dat na deze aankondiging binnen een aantal weken Shopp 1.2 gelanceerd zou worden. Helaas heeft dit iets meer tijd gekost, maar lijkt Shopp 1.2 er nu toch aan te komen.

Het team achter Shopp heeft blijkbaar toch erg veel moeite moeten doen om de nieuwe versie zo in te richten dat gebruikers probleemloos kunnen overstappen van Shopp 1.1 naar versie 1.2. Met de grote lijst aan nieuwe verbeteringen en nieuwe functionaliteit kan ik me goed voorstellen dat dit een erg lastig klus is (of was). Eind december 2011 werd gelukkig de eerste release candidate van Shopp 1.2 beschikbaar gesteld.

Dit betekende voor Pronamic werk aan de winkel om de Pronamic iDEAL plugin te testen in combinatie met Shopp 1.2. De nieuwe Shopp plugin is uitgerust met een compleet nieuw systeem voor het afhandelen van bestellingen en betalingen. Hierdoor moesten er ook een aantal aanpassingen worden gedaan aan de Pronamic iDEAL plugin.

Door de code van een plugin te bekijken is vaak wel te zien hoe bepaalde functionaliteiten werken. In het geval van Shopp 1.2 was het echter lastig te overzien hoe en wanneer functies werden aangeroepen. Daarom heb ik een stroomdiagram gemaakt waarin te zien is welke functies en actie worden aangeroepen na het plaatsen van een bestelling.

Download ODF tekening

Aan de hand van dit diagram hebben we de Pronamic iDEAL plugin bijgewerkt en werkt deze sinds vandaag ook in combinatie met Shopp 1.2. Alle Shopp gebruikers die werken met de Pronamic iDEAL plugin kunnen straks zonder problemen updaten naar versie 1.2.

Categorieën
WooCommerce WordPress

WooCommerce provincie veld verwijderen

WooCommere is een nieuwe, maar nu al erg populaire, webwinkel plugin voor WordPress. De plugin is inmiddels al rond de 18.000+ keer gedownload. Ook in Nederland lijkt WooCommerce terrein te winnen. Dit bleek al op het ideeën platform van WooThemes, waar de iDEAL betaalmethode meer dan 250 stemmen kreeg. Hier hebben we bij Pronamic op ingespeeld door de Pronamic iDEAL plugin uit te rusten met de iDEAL betaalmethode voor WooCommerce.

Inmiddels zijn we een aantal weken verder en zijn we bij Pronamic druk bezig met de implementatie van een aantal WooCommerce webwinkels. Doordat het een vrij nieuwe plugin is is altijd even uitzoeken wat er mee mogelijk is en wat de beperkingen zijn. Het verwijderen, toevoegen en/of aanpassen van velden in het afrekenen formulier blijkt in ieder geval heel eenvoudig te gaan. Voor Nederlandse webwinkeliers is het “provincie” veld in veel gevallen niet interessant. Met behulp van onderstaande code is deze eenvoudig te verbergen.

function prefix_woocommerce_billing_fields($fields) {
	if(isset($fields['billing_state'])) {
		$fields['billing_state']['class'][] = 'hidden';
		$fields['billing_state']['required'] = false;
	}

	return $fields;
}

add_filter('woocommerce_billing_fields', 'prefix_woocommerce_billing_fields');

Vervolgens kan met behulp van CSS het veld verborgen worden:

.form-row.hidden {
	visibility: hidden;
}

Met behulp van deze code wordt het veld overigens niet volledig verwijderd, maar enkel onzichtbaar gemaakt. Je kunt uiteraard het veld ook volledig verwijderen, maar dan zul je waarschijnlijk ook de andere velden moeten aanpassen om de opmaak van het formulier netjes te houden.

Categorieën
iDEAL WordPress

iDEAL blijft populairste betaalmethode

Volgens de Thuiswinkel Markt Monitor is en blijft iDEAL in 2011 de populairste betaalmethode. Het blijkt dat 52,08% van de gebruikers iDEAL als laatste heeft gebruikt om online af te rekenen. In onderstaande grafiek is een overzicht te zien van welke betaalmethode het vaakst is gebruikt bij de laatste aankopen:

Aangezien iDEAL erg populair ben ik bij Pronamic ook regelmatig bezig met het opzetten van iDEAL koppeling. Zo hebben we vrij recent de iDEAL plugin voor WordPress gelanceerd. Met behulp van deze plugin breiden we andere WordPress plugins uit met de iDEAL betaalmethode.

Inmiddels hebben we er voor gezorgd dat men eenvoudig via Gravity Forms, een populaire formulieren plugin voor WprdPress, eenvoudig iDEAL betalingen kan aanbieden. Daarnaast hebben we vorige week voor de nieuwe webwinkel plugin WooCommerce een koppeling met iDEAL gelanceerd.

Als je hulp nodig hebt met het toevoegen van iDEAL aan je WordPress website dan kun je hiervoor altijd contact opnemen met Pronamic. Ook voor op maat gemaakte koppelingen met iDEAL ben je bij Pronamic op het juiste adres!

Categorieën
WordPress

WordPress network update probleem

Bij het updaten van een WordPress network (multisite) installatie liep ik tegen problemen aan bij het geautomatiseerd updaten van WordPress. Bij het uitvoeren van een update kreeg ik de volgende foutmelding:

Destination directory for file streaming does not exist or is not writable.

De doel map voor het streamen van bestanden bestaat niet of is niet schrijfbaar.

Deze foutmelding werd binnen het bestand class-http.php gecreëerd doordat de te downloaden bestanden niet konden worden opgeslagen.

Dit probleem heb ik uiteindelijk tijdelijk kunnen oplossen door de wp-content map tijdelijk schrijfrechten te geven (chmod 777) zoals ook in een WordPress forum topic werd vermeld.

Categorieën
PHP WordPress

Hoe werkt het WordPress update systeem?

WordPress is uitgerust met een zeer eenvoudig en krachtig update systeem. Dankzij dit systeem kunnen WordPress gebruikers eenvoudig WordPress, plugins en thema’s eenvoudig updaten. Ik als ontwikkelaar was erg benieuwd naar deze opzet van dit systeem. Ik ben daarom de WordPress code ingedoken om de werking van dit systeem te onderzoeken.

Het WordPress update systeem maakt gebruik van een API die op WordPress.org staat. Dankzij deze API is eenvoudig informatie op te vragen over WordPress, plugins en thema’s. Elke WordPress installatie informeert om de 12 uren of er updates beschikbaar zijn via de WordPress.org API. De WordPress.org API kun je benaderen via de volgende URL: http://api.wordpress.org/

Als je de WordPress broncode doorzoekt op deze URL zul je een tiental bestanden vinden waarin hier gebruik van gemaakt wordt. In het bestand wp-includes\update.php is te zien op welke wijze WordPress controleert of er nieuwe versies zijn van WordPress, plugins of thema’s. Ik zal hieronder met enkele code fragmenten laten zien hoe gecontroleerd wordt of er thema update beschikbaar is.

WordPress zal in eerste instantie informatie over de geïnstalleerde WordPress thema’s opvragen met behulp van de get_themes() functie. Vervolgens zal deze informatie met behulp van HTTP POST verzoek worden verstuurd naar de WordPress.org API. Hiervoor wordt gebruik gemaakt van de wp_remote_post() functie die onderdeel is van de WordPress HTTP API. De WordPress.org API zal vervolgens aangeven of er updates beschikbaar zijn voor de geïnstalleerde thema’s.

In onderstaande code fragment is globaal te zien hoe een dergelijk verzoek wordt opgebouwd en uitgevoerd:

$themes = array(
	'twentyten' => array(
		'Name' => 'Twenty Ten' ,
		'Version' => '1.0'
	) ,
	'platform' => array(
		'Name' => 'Platform' ,
		'Version' => '1.0'
	) ,
	'delicate' => array(
		'Name' => 'Delicate' ,
		'Version' => '1.0'
	)
);

$args = array(
	'body' => array('themes' => serialize($themes))
);

$response = wp_remote_post('http://api.wordpress.org/themes/update-check/1.0/', $args);

if(is_wp_error($response)) {
	exit('Sorry, something went wrong.');
}

if(200 != $response['response']['code']) {
	exit('Sorry, something went wrong.');
}

$result = unserialize($response['body']);

Als alles goed gaat dan zal de variabele $result informatie over thema’s bevatten waar updates voor beschikbaar zijn. Hieronder zie je een voorbeeld dump van de $result variabele:

array(3) {
	["twentyten"]=>
	array(3) {
		["new_version"]=>
		string(3) "1.1"
		["url"]=>
		string(44) "http://wordpress.org/extend/themes/twentyten"
		["package"]=>
		string(61) "http://wordpress.org/extend/themes/download/twentyten.1.1.zip"
	}
	["platform"]=>
	array(3) {
		["new_version"]=>
		string(5) "1.3.1"
		["url"]=>
		string(43) "http://wordpress.org/extend/themes/platform"
		["package"]=>
		string(62) "http://wordpress.org/extend/themes/download/platform.1.3.1.zip"
	}
	["delicate"]=>
	array(3) {
		["new_version"]=>
		string(5) "3.4.3"
		["url"]=>
		string(43) "http://wordpress.org/extend/themes/delicate"
		["package"]=>
		string(62) "http://wordpress.org/extend/themes/download/delicate.3.4.3.zip"
	}
}

De WordPress.org API geeft dus aan welke versie nu beschikbaar is en waar deze te vinden is. WordPress zal vervolgens met behulp van de Transient API het updaten van de thema’s kenbaar maken aan de WordPress beheerders. De beheerder krijgen daardoor een melding te zien dat er updates beschikbaar zijn. Zodra de beheerder de update uitvoert zal de package URL gedownload worden en de thema bestanden vervangen worden. Hiervoor gebruikt WordPress onder andere de  Theme_Upgrader PHP klasse.

Categorieën
PHP WordPress

WordPress zoeken sorteren op relevantie en datum

De standaard zoekfunctie van WordPress is erg eenvoudig en beperkt. De zoekresultaten zijn standaard gesorteerd op datum. Het is niet mogelijk om deze te sorteren op bijvoorbeeld relevantie. Daarnaast is het ook niet mogelijk om fancy operators te gebruiken in je zoekopdracht zoals we gewend zijn bij andere zoekmachines. Gelukkig zijn er allerlei plugins die de zoekfunctie van WordPress uitbreid.

Ik wilde op een WordPress website de bezoekers de mogelijkheid geven om te sorteren op relevantie of op datum. Om dit mogelijk te maken heb ik ik de Relevanssi plugin van Mikko Saari (twitter: @msaari) geïnstalleerd en de volgende code toegevoegd aan de search.php template.

<?php 

$url = add_query_arg('s', get_search_query(), home_url('/'));

printf(
	__('ordered by %s | %s', 'text_domain') ,
	sprintf('<a href="%s">%s</a>',
		add_query_arg('orderby', 'relevance', $url) ,
		__('relevance', 'text_domain')
	) ,
	sprintf('<a href="%s">%s</a>',
		add_query_arg('orderby', 'post_date', $url) ,
		__('date', 'text_domain')
	)
);

?>
Categorieën
PHP WordPress

WordPress berichten inclusief bijlagen verwijderen

In mijn vorige blog kon je lezen hoe je WordPress berichten kunt verwijderen die geen gekoppelde media (attachments) hebben. In dit bericht laat ik een code snippet zien waarmee je berichten inclusief gekoppelde bijlagen kunt verwijderen. Als je een bericht binnen de WordPress beheerpaneel verwijderd blijven de gekoppelde bijlagen staan. Als je ook de gekoppelde bestanden wilt verwijderen kun je gebruik maken van de volgende code:

$query = new \WP_Query();
$query->query(array(
	'post_type' => 'project' ,
	'tax_query' => array(
		array(
			'taxonomy' => 'phase' ,
			'field' => 'slug' ,
			'terms' => 'test'
		)
	) ,
	'posts_per_page' => -1
));

while($query->have_posts()) {
	$query->the_post();

	$postId = get_the_ID();

	echo $postId, ' - ', get_the_title(), '<br />';

	$attachmentsQuery = new \WP_Query();
	$attachmentsQuery->query(array(
		'post_type' => 'attachment' ,
		'post_status' => 'inherit' ,
		'post_parent' => $postId
	));

	while($attachmentsQuery->have_posts()) {
		$attachmentsQuery->the_post();

		$attachmentId = get_the_ID();

		echo '- ', $attachmentId, ' - ', get_the_title(), '<br />'; 

		$result = wp_delete_attachment($attachmentId, true);
	}

	$result = wp_delete_post($postId, true);
}

Je kunt uiteraard de WP_Query->query() parameters helemaal naar wens aanpassen.