BuddyPress France

Parution ce 17 juin de la méga version 3.0 de Wordpress. Cette version stable est appelée Thelonious, en hommage comme toutes les versions de WP à un grand nom du jazz.
Reste plus qu’à faire swinguer vos sites. Attention tout de même si vous utilisez BP, la version 1.2.4.1 actuelle est encore au stade des beta tests et  n’est de ce fait, pas “tout à fait” compatible avec WP 3.0. Un BP 1.3 100% compatible et dans un environnement de production devrait paraître sous peu.

Notez aussi qu’en raison des importantes modifications apportées à WP 3.0, qu’il n’y a aucune raison de mettre à jour un wpmu/bp qui fonctionne correctement. Considérez cela comme un conseil et consolez-vous en vous disant que vous utilisez une version d’avant la 3.0 ….

Annonce officielle en anglais: http://wordpress.org/development/2010/06/thelonious/

Ceci est un tutoriel en 2 parties qui vous explique la création d’un widget et la mise en place d’un thème enfant

BP est une suite de plugins préformatés en termes d’affichage pour s’adapter au thème par défaut. BP 1.2.x utilise un affichage sur deux colonnes.

Dans certaines conditions, on peut vouloir modifier cet aspect et donc ajouter ou supprimer une colonne, ce qui oblige à reconfigurer le template d’origine. En clair, il s’agit de modifier la position de certaines fonctions afin de les faire coïncider avec une maquette.

Première partie

Pour créer un widget, il faut utiliser le fichier “functions.php” qui se trouve dans la plupart des thèmes WP. S’il n’existe pas, il faut le créer et le mettre à la racine du template.

Supposons que vous voulez créer un nouveau widget dans la colonne de droite. BP fournit en natif  la structure d’affichage de celui-ci. C’est à dire les appels à une fonction quelconque, ainsi que l’affichage sous forme de titre, contenu, texte additionnel, le tout entouré des balises HTML nécessaires.

On va donc mettre le code suivant dans le fichier “functions.php”

if ( function_exists('register_sidebar') )
register_sidebar(array(
 'name' => 'nom_du_widget',
 'before_widget' => '<div id="XYZ">',
 'after_widget' => '</div>',
 'before_title' => '<h3>',
 'after_title' => '</h3>'
 )
);

Cette fonction génère l’affichage du widget sur la page d’administration des widgets.

Vous lui attribuez un nom unique à la ligne ‘name’ – ce que vous voulez, en majuscule ou minuscule . C’est ce nom qui s’affichera dans l’admin.

Vous devez aussi nommer le ID, par exemple  ‘XYZ’,  que vous intègrerez à la feuille de style. Si vous préférez utiliser une classe, vous pouvez le faire aussi. Il suffit alors de remplacer div id=’XYZ’ par div class=’XYZ’.

Une fois ces modifs enregistrées, votre widget est potentiellement opérationnel. Si vous voulez en créer d’autres, il vous suffit de recopier autant de fois que nécessaire la  fonction ci-dessus et de l’ajouter dans le fichier functions.php, avec un nom unique pour chacun d’eux.

Vos widgets sont à présent visibles dans l’admin des widgets et vous pouvez les positionner depuis cet emplacement sur votre template.

Reste à implémenter le widget dans le template.

Pour cela vous devez ouvrir le fichier concerné dans le répertoire de votre thème.  Il y en a plusieurs et c’est là ou il ne faut pas se tromper. Supposons que vous voulez ajouter un de vos widgets personnels  sur la page d’activité de votre site.

Vous ouvrez le fichier “activity/index.php” et vous collez le code suivant à l’endroit souhaité:

<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('nom_du_widget') ) : ?>
/* ici vous mettez tout ce qui vous convient en terme de php, html, javascript,... Mais vous pouvez très bien ne rien mettre aussi... */
<?php endif; ?>

Ne vous laissez pas abuser par le terme sidebar: c’est à usage interne et BP ne vous fera pas la gueule si vous collez un widget à un endroit qui n’est pas une sidebar, mais carrément à l’emplacement de votre contenu principal ou dans le footer ou quoi que ce soit d’autre. En fait un widget est d’abord un bout de code qui vous permet de contrôler une position dans un template.

Bien entendu ce n’est là que le principe général de l’implémentation. Vous devrez encore adapter ce bout de code à votre template à l’aide de la feuille de style. Vous pourrez appliquer tout ce qui vous chante pour avoir un affichage correct, à condition de respecter votre code de nommage des ID et des CLASS précités.

Deuxième partie

Comme vous allez modifier des fichiers natifs et que ces modifs seront perdues à la prochaine mise à jour, WP a prévu ce cas de figure et vous offre la possibilité de créer un thème enfant.  En travaillant les fichiers du thème enfant plutôt que ceux du thème parent d’origine, vous ne perdrez jamais vos modifs. L’autre avantage est que vous n’avez pas à dupliquer la totalité du thème, mais juste les parties qui vous intéressent.

Dans l’exemple ci-dessus, vous allez créer un thème enfant auquel vous allez attribuer un nom unique., disont Toto

Allez dans wp-content/themes et créez un dossier “Toto”

Dans ce répertoire, vous allez créer un fichier nommé “style.css”

En en-tête de fichier vous mettez obligatoirement ce commentaire:

/*
Theme Name: Toto
Theme URL: http://www.monsite.com/themes/Toto
Description:  a 2-column theme created for WordPress.
Author:  vous
Author URI:  l'url de votre site
Version: 1.0
Template: bp-default
Tags:  buddypress, two-columns

The CSS, XHTML and design is released under GPL:

http://www.opensource.org/licenses/gpl-license.php

*/

Les lignes vraiment importantes sont theme name: “le nom de VOTRE thème enfant” et Template: “le nom de votre thème principal” qui est le parent associé à votre enfant. Ainsi WP associera les deux thèmes automatiquement, en allant voir si un enfant existe. Si c’est oui, il le lira en premier. Si c’est non, il enverra le thème parent.

Après le commentaire ci-dessus vous allez ajouter ces 2 lignes:

@import url( ../../plugins/buddypress/bp-themes/bp-default/_inc/css/adminbar.css );
@import url( ../../plugins/buddypress/bp-themes/bp-default/_inc/css/default.css );

La première ligne contrôle l’affichage de la buddybar (la barre d’administration de BP…)
La seconde appelle tous les styles prévus d’origine pour buddypress.
Vous avez maintenant une copie conforme du thème original pour votre thème enfant.

Vous enregistrez le tout et vous activez ce thème pour votre site en lieu et place du thème BP par défaut.
Vous ne verrez aucun changement, mais si vous prenez pas exemple le style par défaut de la balise H1 présent dans style.css qui se trouve dans le thème BP-Default et que vous lui attribuez vos propres paramètres, vous verrez ce changement.

Il faut bien entendu écrire cela dans le nouveau fichier style.css que vous venez de créer.

Par exemple ceci qui affichera tous les titres h1 en rouge:

h1 {
color: red;
}

Le thème enfant étant prioritaire, c’est lui qui sera pris en compte à l’affichage. Votre modif est bien interprétée depuis le thème enfant. Vous n’avez rien touché au fichier original qui sera écrasé à la prochaine mise à jour et votre style à vous est préservé, puisque BP n’écrase pas les thèmes qui ne font pas partie de sa distribution.

Vous procédez de la même manière pour toutes les autres modifs de styles, en copiant le nom originel de l’id ou de la classe à changer et en les collant dans le style.css de votre enfant.

Concernant les fichiers de template que vous voudriez modifier, vous procédez de la même façon. Vous faites d’abord une copie conforme du fichier que vous voulez modifier, et le cas échéant de son chemin, comme ci-dessus “activity/index.php” que vous collez dans votre thème enfant.

Résumé de ce que vous devez voir après les manips décrites ci-dessus.

wp-content/themes/Toto
wp-content/themes/Toto/style.css
wp-content/themes/Toto/functions.php
wp-content/themes/Toto/activity/index.php

Fonctionnement général de BuddyPress

http://codex.buddypress.org/

La dernière version de la traduction française comprend plusieurs corrections importantes.

Les premières concernent des accents qui ne passaient pas dans le fil RSS à cause d’une mauvaise interprétation du php dans le fichier bp-activity-templatetags.php

Les suivantes concernent l’affichage des décomptes de posts au bas des articles et  autour des posts dans les forums qui restaient désespérement en anglais depuis un bon moment. Pour ce dernier point c’est la quasi totalité du fichier bp-forums-templatetags qui n’était pas(plus) pris en compte dans le fichier pot et par conséquent dans sa traduction. Le retrait un peu trop violent de la traduction de bbPress à l’occasion de la sortie de BP 1.2.3 y est pour beaucoup.

Plusieurs tickets relatant ces rectifications ont été ouverts par mes soins.

http://trac.buddypress.org/ticket/2194

http://trac.buddypress.org/ticket/2303

http://trac.buddypress.org/ticket/2304

N’hésitez pas à me signaler les oublis et autres erreurs de traductions que vous pourriez rencontrer dans buddypress.