Integrando las thumbnails con lightbox
Lo primero que haremos será descargar el plugin Slimbox o cualquier plugin de las variedades del lightbox, lo descomprimen en la carpeta wp-content/plugins o desde su administrador pueden instalarlo y lo activamos.
Ahora vamos a abrir nuestro archivo functions.php y ponemos lo siguiente
PHP:
-
/***********************************************
-
* HABILITAR POST THUMBNAILS EN EL THEME
-
***********************************************/
-
/***********************************************
-
* AGREGANDO EL VALOR PARA REL="$VARIABLE"
-
***********************************************/
-
$relative ="lightbox";
-
/***********************************************
-
* OBTENIENDO LA URL COMPLETA DE LA THUMBNAIL
-
***********************************************/
-
function storelicious_thumb_url(){ //MINIATURA
-
return $thumb_image[0];
-
}
-
function storelicious_full_thumb_url(){ //FULL
-
return $full_image[0];
-
}
Ok, ahora tenemos que cambiar los valores...
- $relative = "lightbox" Pueden cambiarlo por prettyphoto o cualquier otro valor para que tome el rel=""
- $thumb_imageCambiar los valores dentro del array por los que deseen que se muestre la imagen.
- $full_image Cambiar los valores dentro del array por los que deseen que abra dentro del lightbox.
Abrimos el archivo single.php y ponemos el siguiente código abajo de div class="entry"
PHP:
-
<?php
-
/**********************************************************
-
* OBTENIENDO LA IMAGEN SI EXISTE LA THUMBNAIL SE ABRIRA
-
* COMPLETA EN LIGHTBOX, SINO SE QUEDARA CON EL LINK A SINGLE
-
***********************************************************/
-
if(has_post_thumbnail()):
-
echo '<a href="'.storelicious_full_thumb_url().'" title="'.get_the_title($post->post_parent).'" rel="'.$relative.'">
-
<img src="'.storelicious_thumb_url().'" alt="'.get_the_title($post->post_parent).'" class="alignright" /></a>';
-
else :
-
echo '<a href="'.get_permalink().'" title="'.get_the_title($post->post_parent).'"><img src="'.get_bloginfo('template_directory').'/images/default.png" alt="'.get_the_title($post->post_parent).'" width="200" height="200" class="alignright" /></a>';
-
endif;
-
?>
Listo! otro tutorial más terminado y les dejo el theme kubrick modificado con lo que hemos visto en este post, los archivos modificados son:
- functions.php
- index.php
- single.php
8 comentarios para Como usar las miniaturas generadas por WordPress en un theme
Justo lo que estaba buscando para le nuevo tema, me podrías decir que plugin usas en el sidebar el trabajo de…el slider de imagenes …
Intente ponerlo en practica pero no me funciono como yo queria, despues de varios intentos fallidos me di por vencido y seguire usando el Timthumb.
Obviamente en mi localhost seguire intentando, bueno espero que salga…
que buen tutorial
muchas gracias!
tengo una duda el código de la pagina 4 en donde ay que introducirlo?
Buena nota! Y hablando de thumbs, no hay algún plugin que permita mover la imagen y acomodarla antes de crear la miniatura? Parecido a como tiene facebook con las fotos de perfil.
Existe alguna forma de evitar que wordpress cree la imagen en varios tamaños? por ejemplo subo una imagen wordpress me crea varios tamaños de esa imagen como 150×150 300×300 etc.
De cada imagen que subo genera 4 imágenes de diferentes tamaños, algo ridículo a mi parecer.
Bueno espero que exista alguna solución para esto.
Llevo 4 dias (casi con sus noches) buscando en español, ingles y hasta en chino esta información y lo unico que hay es nada: especifico o relacionado directamente con el problema…
¡AL FIN!!!! Gracias….!!!!
excelente.
saludos,
martin