[fusion_builder_container hundred_percent= »yes » overflow= »visible »][fusion_builder_row][fusion_builder_column type= »1_1″ background_position= »left top » background_color= » » border_size= » » border_color= » » border_style= »solid » spacing= »yes » background_image= » » background_repeat= »no-repeat » padding= » » margin_top= »0px » margin_bottom= »0px » class= » » id= » » animation_type= » » animation_speed= »0.3″ animation_direction= »left » hide_on_mobile= »no » center_content= »no » min_height= »none »][heading size= »5″ style= »underline »] Utilisation du shortcode [/heading]
Quoi tu m’as pris pour le codex ou quoi ?

[/fusion_builder_column][fusion_builder_column type= »1_1″ background_position= »left top » background_color= » » border_size= » » border_color= » » border_style= »solid » spacing= »yes » background_image= » » background_repeat= »no-repeat » padding= » » margin_top= »0px » margin_bottom= »0px » class= » » id= » » animation_type= » » animation_speed= »0.3″ animation_direction= »left » hide_on_mobile= »no » center_content= »no » min_height= »none »][fusion_separator/]
[heading size= »5″ style= »underline »] Refonte de la css [/heading]
A partir de la version WordPress 3.1 il est possible de faire un reset de la css. Dans le fichier « functions.php » de ton thème il faut rajouter en fin de fichier :
[php] add_filter( ‘use_default_gallery_style’, ‘__return_false’ ); [/php]

Meow Gallery: The gallery is empty.

Puis copie/colle la css soit dans le fichier « style.css« , je me doute bien que tu vas pas tout retaper 🙂
[css]
/* The Gallery container (div) */
.gallery { }

/* A Gallery item container,
for 3, 2 and 4 column galleries */
.gallery .gallery-item { }
.gallery-columns-2 .gallery-item { }
.gallery-columns-4 .gallery-item { }

/* The actual image inside a container
for 3, 2 and 4 column galleries */
.gallery img { }
.gallery-columns-2 .attachment-medium { }
.gallery-columns-4 .attachment-thumbnail { }

/* A gallery image caption */
.gallery .gallery-caption { }

/* Definition lists elements */
.gallery dl, .gallery dt { }

/* Pick the second line break if two
line breaks are adjacent */
.gallery br+br { }
[/css]

Sinon,
[php]
add_filter( ‘gallery_style’, ‘hfnCssGallery’ );

function hfnCssGallery() {
$css = "<style type=’text/css’>
.gallery { margin: 0 auto 18px; }
.gallery .gallery-item {
float: left;
margin-top: 0;
text-align: center;
width: 33%;
}
.gallery-columns-2 .gallery-item { width: 50%; }
.gallery-columns-4 .gallery-item { width: 25%; }
.gallery img {
box-shadow: 0px 0px 4px #999;
border: 1px solid white;
padding: 8px;
background: #f2f2f2;
}
.gallery img:hover {
background: white;
}
.gallery-columns-2 .attachment-medium {
max-width: 92%;
height: auto;
}
.gallery-columns-4 .attachment-thumbnail {
max-width: 84%;
height: auto;
}
.gallery .gallery-caption {
color: #888;
font-size: 12px;
margin: 0 0 12px;
}
.gallery dl, .gallery dt { margin: 0; }
.gallery br+br { display: none; }
</style>
<div id=’$selector’ class=’gallery galleryid-{$id} gallery-columns-{$columns} gallery-size-{$size_class}’>";
return $css;
}
[/php]

[fusion_separator/]
[heading size= »5″ style= »underline »] Mise en place d’une lightbox [/heading]
En mode faignant l’utilisation de plugin genre :

  • Cleaner Gallery
  • jQuery Lightbox For Native Galleries

Mais les plugins c’est mal on ne nous dit pas tout !!

Tu es developpeur, bidouilleur ou encore tu n’y connais rien mais tu es curieux et tu n’as même pas peur ?
Voici d’autre méthodes un peu mieux, un bon vieux hack.

A la mode barbare, dans le fichier « wp-includes/post-template.php » de remplacer :
[php]return apply_filters( ‘wp_get_attachment_link’, "<a href=’$url’ title=’$post_title’>$link_text", $id, $size, $permalink, $icon );[/php]
par
[php]return apply_filters( ‘wp_get_attachment_link’, "<a href=’$url’ title=’$post_title’>$link_text", $id, $size, $permalink, $icon );[/php]
Le problème de cette méthode c’est lors de la prochaine mis à jour le fichier sera écraser et il l’opération sera a renouveller.

Donc cette solution est mal !!

Deux autres méthodes a rajouter dans le fichier fonction de ton thème :
[php]
add_filter( ‘wp_get_attachment_link’ , ‘add_lighbox_rel’ );
function add_lighbox_rel( $attachment_link ) {
if( strpos( $attachment_link , ‘a href’) != false && strpos( $attachment_link , ‘img src’) != false )
$attachment_link = str_replace( ‘a href’ , ‘a rel="prettyPhoto[]" href’ , $attachment_link );
return $attachment_link;
}
[/php]

ou encore
perso j’aime bien celle-ci car elle va permettre de rajouter a tout mes liens contenant une image l’attribut ici « rel= »prettyPhoto »« .

[php]
// Adapted and Modified from http://wordpress.org/extend/plugins/add-lightbox/
// Adds a rel="prettyPhoto" tag to all linked image files

add_filter(‘the_content’, ‘addlightboxrel_replace’, 12);
add_filter(‘get_comment_text’, ‘addlightboxrel_replace’);
function addlightboxrel_replace ($content)
{ global $post;
$pattern = "/<a(.*?)href=(‘|")([^>]*).(bmp|gif|jpeg|jpg|png)(‘|")(.*?)>(.*?)</a>/i";
$replacement = ‘<a$1href=$2$3.$4$5 rel="prettyPhoto[‘.$post->ID.’]"$6>$7</a>’;
$content = preg_replace($pattern, $replacement, $content);
return $content;
}
[/php]

Il y’a la possibilité également de le faire en javascript et sinon si tu es un grand malade et tu ne sais pas quoi faire ?
Tu te dis pourquoi ne pas reprendre le shortcode et faire le miens ?
Et pourquoi pas …

Direction « wp-include/media.php » et trouve :
[php]add_shortcode(‘gallery’, ‘gallery_shortcode’);

/**
* The Gallery shortcode.
*
* This implements the functionality of the Gallery Shortcode for displaying
* WordPress images on a post.
*
* @since 2.5.0
*
* @param array $attr Attributes of the shortcode.
* @return string HTML content to display gallery.
*/
function gallery_shortcode($attr) {
[/php]

Mes sources ?

  • WordPress › Support » How-To and Troubleshooting[resolved] Add rel= »xyz » to Gallery Link
  • Web2Fenua, creation de site web a Tahiti
  • Le codex bien sur !!

[/fusion_builder_column][/fusion_builder_row][/fusion_builder_container]