Contao : Installer KCFinder

Ce tutoriel se base sur la version 2.9 de Contao.

Nous voilà partie dans un nouveau système de gestion de contenu nommé CONTAO (anciennement Typolight).

Pour ceux qui ne connaissent pas il s’agit d’un portail internet assez simple à utiliser, cependant il lui manque une partie importante concernant l’éditeur de texte tinyMCE : un explorateur de fichier.

À travers les lignes suivantes, je vais essayer de vous montrer comment intégrer ce super petit navigateur de fichier à tinyMCE.

Pour commencer téléchargez l’archive de KCFinder (kcfinder archive zip).

Il vous faut maintenant extraire le contenu de cette archive dans le répertoire : plugins/tinyMCE/plugins/kcfinder/

Le plus dur est fait, il ne nous reste plus qu’à configurer le tout.

Commençons dans l’ordre par KCFinder, dans le répertoire ouvrir le fichier « config.php » et modifier les lignes suivantes :

'uploadURL' => "upload",

par

'uploadURL' => "../../../../tl_files/",
'uploadDir' => "",

par

'uploadDir' => $_SERVER['DOCUMENT_ROOT']."/tl_files",

et enfin,

//'_tinyMCEPath' => "/tiny_mce",

par

'_tinyMCEPath' => "/plugins/tinyMCE/",

Les modification pour notre navigateur de fichier sont terminées, passons maintenant à la configuration de tinyMCE.

Trouvez les fichier : tinyMCE.php dans system/config et modifiez les lignes suivantes :

Ajoutez

file_browser_callback: 'openKCFinder',

après

tinyMCE.init({
mode : "exact",
height : "300",
language : "< ?php echo $this->language; ?>",
elements : "< ?php echo $this->rteFields; ?>",

et aussi

function openKCFinder(field_name, url, type, win) {
tinyMCE.activeEditor.windowManager.open({
file: 'plugins/tinyMCE/plugins/kcfinder/browse.php?opener=tinymce&amp;amp;amp;type=' + type + '&amp;amp;amp;dir=' + type + '/public',
title: 'KCFinder',
width: 700,
height: 500,
resizable: "yes",
inline: true,
close_previous: "no",
popup_css: false
}, {
window: win,
input: field_name
});
return false;
}

sous la fin de la fonction précédente.

Vous pouvez faire la même chose dans les fichiers : tinyFlash.php et tinyNews.php.

Vous verrez apparaître maintenant une icône sur le bord de vos fenêtres d’insertion de documents et vous obtiendrez ainsi un joli explorateur de fichiers.

Créer un web service avec Zend Framework

Pour commencer revenons un petit peu sur les web services. Qu’est ce que c’est ? À quoi ça sert ? Comment ça marche ?

À travers les lignes qui suivent je vais essayer de vous faire comprendre l’utilité de tout ça. Commençons avec une petite définition de ce terme, d’après Wikipedia :

Un service web est un programme informatique permettant la communication et l’échange de données entre applications et systèmes hétérogènes dans des environnements distribués. Il s’agit donc d’un ensemble de fonctionnalités exposées sur internet ou sur un intranet, par et pour des applications ou machines, sans intervention humaine, et en temps réel.

(Source http://fr.wikipedia.org/wiki/Service_Web)

En gros ça permet à des applications hétérogènes, il faut entendre par ce terme programmées dans plusieurs langages différents, de partager des informations en utilisant des protocoles en commun :

  • WSDL : c’est un fichier de description du WS écrit en XML
  • SOAP : un des protocoles permettant la communication entre 2 applications (il existe aussi par exemple le protocole REST)

Rentrons dans le vif du sujet, pour créer un WS, nous avons vu qu’il nous fallait un fichier appelé WSDL, il existe plusieurs façons de le faire, vous pouvez par exemple utiliser Zend Studio (Logiciel Payant), mais nous allons voir comment le faire encore plus simplement en utilisant Zend Framework.

(ce tutoriel est basé sur la version 1.9.7 de Zend Framework disponible sur le site de Zend)

Pour ce faire nous allons créer une classe PHP TestWS.php


< ?php

class TestWS{

}

?>

Pour le moment rien de compliqué, nous allons maintenant ajouter 2 méthodes à l’intérieur, une première qui devra nous renvoyer « Hello Word » et la seconde qui nous renverra le texte qu’on lui aura passé en paramètre.


< ?php

class TestWS{

public function getHello(){

return 'Hello Word';

}

public function getMyText($text){

return $text;

}

}

?>

Utilisons maintenant la PHPDoc pour commenter un peu notre code, c’est aussi grâce à la PHPDoc que ZF va pouvoir générer à notre place le fichier WSDL.


< ?php

class TestWS{

/**
* This function return the text 'Hello Word'
* @return string
*/
public function getHello(){

return 'Hello Word';

}

/**
* This function return the text in $text
* @param string $text
* @return string
*/
public function getMyText($text){

return $text;

}

}

?>

Maintenant il nous faut utiliser le Framework Zend, dans mon cas je l’utilise comme « Boîte à outils », je vais donc inclure les fichiers nécessaires à cette démonstration.


< ?php
ini_set("soap.wsdl_cache_enabled", "0");
require_once 'Zend/Soap/AutoDiscover.php';
require_once 'Zend/Soap/Server.php';

class TestWS{

/**
* This function return the text 'Hello Word'
* @return string
*/
public function getHello(){

return 'Hello Word';

}

/**
* This function return the text in $text
* @param string $text
* @return string
*/
public function getMyText($text){

return $text;

}

}

?>

Pour une question de pratique, je vais proposer mon WS directement sur ma classe, mais vous pouvez très bien les proposer à travers un autre fichier.

Nous allons maintenant créer « Le serveur de Web Service » pour rendre notre WS disponible, vous allez voir c’est assez simple.


< ?php
ini_set("soap.wsdl_cache_enabled", "0");
require_once 'Zend/Soap/AutoDiscover.php';
require_once 'Zend/Soap/Server.php';
require_once 'Zend/Soap/Client.php';

if(isset($_GET['wsdl'])) { // On aura accès à mon WS à l'adresse http://MonServeur/test.php?wsdl
$wsdl = new Zend_Soap_AutoDiscover();
$wsdl->setClass('TestWS'); // Il faut ajouter le nom de la classe
$wsdl->handle();
}else {
$server = new Zend_Soap_Server('http://MonServeur/test.php?wsdl');
$server->setClass('TestWS');
$server->handle();
}

class TestWS{

/**
* This function return the text 'Hello Word'
* @return string
*/
public function getHello(){

return 'Hello Word';

}

/**
* This function return the text in $text
* @param string $text
* @return string
*/
public function getMyText($text){

return $text;

}

}

?>

Si nous nous rendons à l’adresse http://MonServeur/TestWs.php?wsdl, nous pourrons visualiser notre Web Service.

Notre Web Service est maintenant en place, il ne nous reste plus qu’à le consommer (l’utiliser), nous allons donc créer un fichier client.php et inclure les librairies de ZF dont nous avons besoin.


< ?php
require_once 'Zend/Soap/Client.php';

try {
$client = new Zend_Soap_Client('http://MonServeur/TestWS.php?wsdl');

}
catch(Zend_Exception $e) {
echo $e->getMessage();
}

?>

Nous avons maintenant notre code de base pour consommer notre WS, nous pouvons par exemple demander la liste complète des fonctions disponibles via ce web service avec la fonction suivante ;


$client->getFunctions();

et on aura la réponse suivante :

Array
(
[0] => string getHello()
[1] => string getMyText(string $text)
)

Appelons maintenant nos fonctions.


< ?php
ini_set("soap.wsdl_cache_enabled", "0");
require_once 'Zend/Soap/Client.php';

try {
$client = new Zend_Soap_Client('http://MonServeur/TestWS.php?wsdl');
print($client->getHello());
print('<br />');
print($client->getMyText('Je veux mon texte'));
}
catch(Zend_Exception $e) {
echo $e->getMessage();
}

?>

et nous aurons la réponse suivante :


Hello Word
Je veux mon texte

J’espère que ces lignes vous aideront, à très vite pour de nouveaux tutoriels.

A venir prochainement

Histoire de mettre quelques infos sur ce blog, je suis en train de vous préparer une série de tutoriaux sur PHP et Zend Framework :

  • Création d’un mini-cms
  • Création et utilisation de webservices

FrogSoft

Logo FrogSoft

Et voilà c’est fait. Notre petite société viens d’ouvrir au Québec

Google Latitude

Rien de mieux qu’une vidéo.

En plus ça fonction sur presque tous les téléphones (nokia, ipod touch et iphone, blackberry ,…)

Alors à tout de suite sur google latitude

Accélérer WordPress

Quelques petites astuces pour optimiser son blog sous WordPress.

Attention, avant de faire vos modifications, pensez à sauvegarder vos bases de données, si vous le souhaitez un plugin peux le faire pour vous : Wp-DBmanager

  • Désactiver le versionnage des articles (ou modifier le nombre maximum de versions)

Pour empêcher la création de versions, vous pouvez ajouter la ligne suivante à votre fichier wp_config.php

define(’WP_article_REVISIONS’, false);

Vous pouvez sinon limiter le nombre de version avec la ligne

define(’WP_article_REVISIONS’, no_of_revision);

  • Supprimer les images inutiles

Chaque fois que vous une télécharger une image, WordPress créé automatiquement des copies de celle-ci en la redimensionnant à des tailles petite et moyenne. Le plus souvent, ces images ne sont pas utilisées. De même, il peut également y avoir quelques images que vous avez téléchargées, mais que vous n’utilisées pas. Ces images inutilisées peuvent facilement augmenter la taille de vos répertoires et de votre base de données.

Le plugin DUI va scanner automatiquement toutes ces images inutilisées dans vos articles. Il vous proposera alors de les supprimer de la base de données et du serveur.

  • Optimiser la base de données

Grâce au plugin de base de données cité dans cet article nous pouvons effectuer plusieurs opérations sur nos données.

Db Manager

Une des fonctionnalités de ce plugin est d’optimiser la base données, pour cela allez dans Database->Optmize DB et sélectionner les tables que vous voulez optimiser.

Cette opération peut également être réalisé automatiquement à intervalle régulier, pour cela allez dans Database->DB options et validez cette optimisation.

Découverte du siècle !!!

Enfin une avancée importante pour mon iPod et moi : mettre des accents.
Ça parait simple mais pourtant, il suffit de rester sur la lettre et alors on pourra voir un nouveau « sur clavier » contenant tous les accents de la lettre sélectionnée

Un article bien sympa

Le langage

Le premier point et non le moindre est la cible du tutoriel, essayer de définir a qui vous allez vous adresser.

Imaginez que vous parlez a un enfant de 6 ou 7 ans et que vous devez lui expliquer comment créer un patchwork … c’est pas facile ! alors évitez les termes trop technique et les phrase du type : « Définissez un masque de fusion dans un calque superposé au calque inférieur .. » et préférez plutôt la syntaxe suivante :  » Posez votre souris sur le claque toto et appuyez simultanément sur CTRL+clic gauche, créez un nouveau calque (calque>nouveau>calque ou CTRL+MAJ+N), puis positionnez vous sur le nouveau calque et créez un masque de fusion (Calque>masque de fusion>tout faire apparaitre ) »

Certes c’est plus long mais du coup même les plus débutants pourront utiliser votre tuto.

L’illustration

Un bon tutoriel ne doit pas manquer d’illustration. Selon le type de tuto n’hésitez pas a mettre des aperçu d’écran pour les tutos design ou des exemple de code avec des pages de démonstrations pour les tutos de programmation.

L’avertissement

Si malgré tout cela vous n’arrivez pas à rendre accessible votre tutoriel pensez a mettre un avertissement concernant la difficulté d’exploitation de votre tutoriel

(Article du site http://www.jarodxxx.com/)

Un peu de réalité augmentée

Réalité augmentée

Qui n’a jamais eu envie de rencontrer le BigFoot (Yeti), et bien maintenant rien de plus simple:

Munissez vous de votre webcam favorite et de votre imprimante et rendez vous sur le site : http://www.livingsasquatch.com/

Et puis en plus de le voir, vous pouvez même le faire danser.

Dans cette même optique visitez les sites suivants :

www.c3picasso.com/fr

http://www.gskinner.com/blog/archives/2005/11/flash_8_webcam_1.html

www.therelapse.co.uk/3dartcomp/#/home

http://ge.ecomagination.com/smartgrid/#/augmented_reality

www.bentobox.jp/realite.php

http://earthinyourhands.earthhour.org/our-earth/our-earth.html

OpenID

Et oui depuis aujourd’hui vous pouvez vous connectez à mon site grâce à l’OpenID.

Vous ne savez pas ce que c’est ?

OpenID est un système d’authentification décentralisé qui permet l’authentification unique, ainsi que le partage d’attributs. Il permet à un utilisateur de s’authentifier auprès de plusieurs sites (devant prendre en charge cette technologie) sans avoir à retenir un identifiant pour chacun d’eux mais en utilisant à chaque fois un unique identifiant OpenID. Le modèle OpenID se base sur des liens de confiance préalablement établis entre les fournisseurs de services (sites web utilisant OpenID par exemple) et les fournisseurs d’identité (OpenID providers). Il permet aussi d’éviter de renseigner à chaque fois un nouveau formulaire en réutilisant les informations déjà disponibles.

Source : Wikipédia

Et à quand un serveur OpenID chez FrogSoft ?

À suivre ….