<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>css 4 design &#187; URL</title>
	<atom:link href="http://css4design.com/tag/url/feed" rel="self" type="application/rss+xml" />
	<link>http://css4design.com</link>
	<description>Le blog de l&#039;intégrateur web</description>
	<lastBuildDate>Tue, 13 Jul 2010 19:09:57 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
	<atom:link rel='hub' href='http://css4design.com/?pushpress=hub'/>
		<item>
		<title>WordPress &#8212; Gérer les images avec les champs personnalisés (Customs fields)</title>
		<link>http://css4design.com/wordpress-gerer-les-images-avec-les-champs-personnalises-customs-fields</link>
		<comments>http://css4design.com/wordpress-gerer-les-images-avec-les-champs-personnalises-customs-fields#comments</comments>
		<pubDate>Thu, 07 Aug 2008 02:29:03 +0000</pubDate>
		<dc:creator>Bruno Bichet</dc:creator>
				<category><![CDATA[WordPress]]></category>
		<category><![CDATA[Balise meta]]></category>
		<category><![CDATA[Boucle]]></category>
		<category><![CDATA[Customs fields]]></category>
		<category><![CDATA[Loop]]></category>
		<category><![CDATA[Magazine]]></category>
		<category><![CDATA[Tutoriels]]></category>
		<category><![CDATA[URL]]></category>

		<guid isPermaLink="false">http://www.css4design.com/?p=503</guid>
		<description><![CDATA[Les champs personnalisés permettent d&#8217;ajouter des informations avant ou après le contenu de votre billet (dans la boucle WordPress) sans quitter l&#8217;interface de rédaction. Il s&#8217;agit d&#8217;associer une valeur (le contenu) à une clé choisie librement (ou parmi celles que vous avez déjà définie) et d&#8217;utiliser la fonction get_post_meta() dans votre thème. De nombreux thèmes à tendance &#171;&#160;magazine&#160;&#187; se servent des champs personnalisés pour afficher une image au-dessus d&#8217;un billet. Pour cela, on crée la clé illustration et on met l&#8217;URL de l&#8217;image dans le champs valeur. Voici un exemple concret : &#60;?php $image = get_post_meta($post-&#62;ID, 'illustration', $single = true); [...]]]></description>
			<content:encoded><![CDATA[<div class="tweetmeme_button" style="float: right; margin-left: 18px;">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fcss4design.com%2Fwordpress-gerer-les-images-avec-les-champs-personnalises-customs-fields">
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=http%3A%2F%2Fcss4design.com%2Fwordpress-gerer-les-images-avec-les-champs-personnalises-customs-fields&amp;source=br1o&amp;style=normal&amp;service=bit.ly&amp;service_api=R_0c1ee4b64f105d1b2672690740a77d6a" height="61" width="50" />
			</a>
		</div><p>Les <a href="http://codex.wordpress.org/fr:Utiliser_les_champs_personnalis%C3%A9s">champs personnalisés</a> permettent d&#8217;ajouter des informations avant ou après le contenu de votre billet (dans la <a href="http://codex.wordpress.org/fr:La_Boucle">boucle WordPress</a>) sans quitter l&#8217;interface de rédaction. Il s&#8217;agit d&#8217;associer une valeur (le contenu) à une clé choisie librement (ou parmi celles que vous avez déjà définie) et d&#8217;utiliser la fonction <code>get_post_meta()</code> dans votre thème.<span id="more-503"></span></p>

<p>De nombreux thèmes à tendance &laquo;&nbsp;magazine&nbsp;&raquo; se servent des champs personnalisés pour afficher une image au-dessus d&#8217;un billet. Pour cela, on crée la <code>clé</code> <em>illustration</em> et on met l&#8217;URL de l&#8217;image dans le champs <code>valeur</code>.</p>

<p>Voici un exemple concret :</p>

<pre><code>&lt;?php $image = get_post_meta($post-&gt;ID, 'illustration', $single = true); ?&gt;
</code></pre>

<p>Le contenu de la clé <em>llustration</em> est placée dans la variable <code>$image</code> pour l&#8217;afficher plus loin :</p>

<pre><code>&lt;img src="&lt;?php echo $image; ?&gt;" /&gt;
</code></pre>

<p>C&#8217;est déjà fini ?</p>

<h3>Les problèmes commencent</h3>

<p>Maintenant, il faut saisir l&#8217;URL de votre image dans la section <em>Champs personnalisés</em> en bas de l&#8217;interface d&#8217;édition du billet.</p>

<p>Oui, mais voilà, cette URL, vous ne l&#8217;a connaissez pas encore. En effet, WordPress s&#8217;occupe lui-même de l&#8217;emplacement de votre image dans un dossier du genre <code>/wp-content/uploads/2008/08/...</code></p>

<h4>1ère solution : télécharger l&#8217;image via un client FTP</h4>

<p>Certains ont résolu le problème en créant un répertoire dédié pour ces images et en les téléchargeant avec un client FTP. Mais à l&#8217;usage, ça reste très lourd au point d&#8217;enlever presque tout intérêt à l&#8217;affichage d&#8217;images par ce moyen.</p>

<pre><code>&lt;img src="mes-images/&lt;?php echo $image; ?&gt;" /&gt;
</code></pre>

<p>Toutefois, il existe une option sous forme de case à (dé)cocher (<em>organiser mes fichiers envoyés dans des dossiers mensuels et annuels</em>) pour mettre toute les images en vrac dans le dossier <code>/uploads</code>. Comme ça, il suffit d&#8217;ajouter le nom du répertoire dans le thème et de saisir le nom de l&#8217;image dans le champ <code>valeur</code> :</p>

<pre><code>&lt;img src="uploads/&lt;?php echo $image; ?&gt;" /&gt;
</code></pre>

<p>Toutefois, ces images en vrac ne sont pas une solution satisfaisante : on risque de créer plus de problèmes sur le long terme que ça en a réglé sur le court terme. Et puis, il est toujours nécessaire de télécharger les images à part, même si l&#8217;on économise la création d&#8217;un dossier ;)</p>

<h4>2ème solution : utiliser la boite de dialogue prévue&#8230;</h4>

<p>En réfléchissant un peu à la question, j&#8217;ai trouvé une petite astuce toute simple pour connaitre cette fameuse URL en évitant de mettre le bazar dans <code>/uploads</code></p>

<ol>
    <li>Ajouter une image comme vous le feriez si vous vouliez l&#8217;afficher dans le billet,</li>
    <li> Copier l&#8217;adresse de l&#8217;image qui apparait dans la boite de dialogue.</li>
    <li>Fermer la fenêtre d&#8217;importation</li>
    <li>Coller l&#8217;adresse de votre image dans le champ <code>valeur</code> à côté de la <code>clé</code> <em>llustration</em> dans les Champs personnalisé.</li>
</ol>

<p>Voilà, c&#8217;est simple, efficace et sans bavure ;)</p>

<p><strong>MAJ :</strong> Dans la version 2.7, l&#8217;adresse n&#8217;apparait plus dans la boite de dialogue d&#8217;importation. Il est nécessaire d&#8217;incorporer l&#8217;image pour obtenir l&#8217;url.</p>
]]></content:encoded>
			<wfw:commentRss>http://css4design.com/wordpress-gerer-les-images-avec-les-champs-personnalises-customs-fields/feed</wfw:commentRss>
		<slash:comments>47</slash:comments>
		</item>
		<item>
		<title>Des mini-liens personnalisés avec MinURL</title>
		<link>http://css4design.com/des-mini-liens-personnalises-avec-minurl</link>
		<comments>http://css4design.com/des-mini-liens-personnalises-avec-minurl#comments</comments>
		<pubDate>Sun, 27 Jul 2008 23:39:18 +0000</pubDate>
		<dc:creator>Bruno Bichet</dc:creator>
				<category><![CDATA[Le petit journal du web]]></category>
		<category><![CDATA[Twitter]]></category>
		<category><![CDATA[URL]]></category>

		<guid isPermaLink="false">http://www.css4design.com/?p=352</guid>
		<description><![CDATA[C&#8217;est bien connu, size doesn&#8217;t matter! Malgré tout, il existe de nombreux sites permettant de raccourcir les URL trop longues. MinURL de Darklg innove avec le bookmarklet Twitt! pour touitter une adresse web raccourcie directement dans l&#8217;interface de Twitter sans utiliser vos identifiants. Cerises sur le gâteau vous pourrez : personnaliser l&#8217;adresse raccourcie, ajouter un compteur pour connaitre le nombre de fois où votre mini-lien a été cliqué, activer ou non la prévisualisation du lien en question.]]></description>
			<content:encoded><![CDATA[<div class="tweetmeme_button" style="float: right; margin-left: 18px;">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fcss4design.com%2Fdes-mini-liens-personnalises-avec-minurl">
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=http%3A%2F%2Fcss4design.com%2Fdes-mini-liens-personnalises-avec-minurl&amp;source=br1o&amp;style=normal&amp;service=bit.ly&amp;service_api=R_0c1ee4b64f105d1b2672690740a77d6a" height="61" width="50" />
			</a>
		</div><p>C&#8217;est bien connu, <em>size doesn&#8217;t matter!</em> Malgré tout, il existe de nombreux <a href="http://www.travailleursduweb.com/2008/07/21/10-raccourcisseurs-durl.html">sites permettant de raccourcir les URL</a> trop longues. <a href="http://minurl.fr/">MinURL</a> de <a href="http://blog.darklg.fr/">Darklg</a> innove avec le bookmarklet <a href="javascript:void(location.href='http://minurl.fr/?twitter&amp;titrelien='+escape(document.title)+'&amp;url='+escape(location.href))">Twitt!</a> pour <em>touitter</em> une adresse web raccourcie directement dans l&#8217;interface de <a href="http://twitter.com/br1o">Twitter</a> sans utiliser vos identifiants. Cerises sur le gâteau vous pourrez :</p>

<ul>
    <li>personnaliser l&#8217;adresse raccourcie,</li>
    <li>ajouter un compteur pour connaitre le nombre de fois où votre mini-lien a été cliqué,</li>
    <li>activer ou non la prévisualisation du lien en question.</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://css4design.com/des-mini-liens-personnalises-avec-minurl/feed</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
	</channel>
</rss>

<!-- Performance optimized by W3 Total Cache. Learn more: http://www.w3-edge.com/wordpress-plugins/

Minified using disk
Page Caching using disk (enhanced) (user agent is rejected)

Served from: css4design.com @ 2010-07-29 17:34:19 -->