Wordpress image responsive (Bootstrap 3)

Para todos los que usamos Bootstrap en WordPress, aunque configuremos  nuestro theme, a veces necesitaremos que nuestra galería sea responsive y  que mejor que implementar en cada imagen de la galería la clase .img-responsive, para ello os dejamos este simple snippet.


function bootstrap_gallery( $output = '', $atts, $instance )
{
if (strlen($atts['columns']) < 1) {
$columns = 3;
}
else {
$columns = $atts['columns'];
}
 
$images = explode(',', $atts['ids']);
if ($columns < 1 || $columns > 12) {
$columns == 3;
}
 
$col_class = 'col-xs-' . 12/$columns;
 
$return = '
<div class="row gallery">';
$i = 0;
foreach ($images as $key => $value) {
if ($columns == 0 && $i > 0) {
$return .= '</div>
<div class="row gallery">';
}
$image_attributes = wp_get_attachment_image_src($value, 'full');
$return .= '
<div class="'.$col_class.'">
<div class="gallery-image-wrap"><a href="'.$image_attributes[0].'" data-gallery="gallery">
<img class="img-responsive" src="'.$image_attributes[0].'" alt="" />
</a></div>
</div>
';
$i++;
}
$return .= '
 
</div>
';
return $return;
}
add_filter( 'post_gallery', 'bootstrap_gallery', 10, 4);

En 13Node buscamos freelance con talento que quieran colaborar en nuestros trabajos y proyectos. Si eres diseñador, animador, programador web..., ponte en contacto con nosotros enviando tu portafolio a [email protected]