Gestión de imágenes en wordpress y mostrarlas utilizando jquery.
by dorian06
Cual era el problema a resolver? Encontrar una forma de poder gestionar los álbumes desde wordpress,
agregando fotos, descripción, etc y además de mostrar todos estos los álbumes en alguna sección de la pagina, mostrar los últimos (ponele 6) utilizando jquery o mootools (para llamar un poco la atención del lector) en la página principal. Se entiende? Osea, subir imágenes y mostrar las últimas con un poco mas de ‘onda’
Para mi suerte, me encontré con un excelente (y conocido) plugin llamado wp photo album y una galería hecha en jquery llamada prettygallery que combinándolos logre lo buscado. El resultado, lo pueden ver acá: entornoeconomico.com. En la página principal muestra las útlimas imagenes con el link y en la sección de sociales queda el archivo.
Implementar ‘wp photo album’ es muy sencillo, y las instrucciones las pueden ver acá, igual que las instrucciones de prettygallery desde acá; una vez que ya tenemos el plugin funcionando y la galería implementada, pasame a la pregunta que nos trae hoy:
como hacemos para mostrar automáticamente las imágenes y álbumes que subimos a wordpress en la galería jquery ?
Para lograrlo, vamos a llamar a la base de datos de wordpress, buscar el nombre del álbum en la tabla wp_wppa_albums para después, buscar alguna imagen de ese álbum, en la tabla wp_wppa_photos e imprimirlas dentro del <ul> </ul> de prettygallery con el nombre + la imagen + la url del album. Nos queda + o menos asi:
<ul class=’gallery’>
<?php
$query_album=”SELECT * FROM wp_wppa_albums ORDER BY id DESC LIMIT 6″;
$sal_album=mysql_query($query_album);
while($query_fetch_album=mysql_fetch_array($sal_album)){
$id_album=$query_fetch_album['id'];
$name_album=$query_fetch_album['name'];
$name_album=substr($name_album, 0, 30);
$query_imagen=”SELECT * FROM wp_wppa_photos WHERE album = $id_album LIMIT 1″;
$sal_imagen=mysql_query($query_imagen);
while($query_fetch_imagen=mysql_fetch_array($sal_imagen)){
$id_imagen=$query_fetch_imagen['id']; //el id es el nombre de la imagen
$ext=$query_fetch_imagen['ext']; //extensión de la imagen
?>
Ya tenemos todo lo necesario para imprimir la imágenes dentro del <li> </li> de prettygallery, lo hacemos de la siguiente manera:
recordemos que la forma por default de mostrar la imágenes prettygallery es:
Y asi es como tiene que quedarnos:
<li>
<a href=”http://www.URL.com/?album=<?php echo “$id_album”; ?>”>
<img src=”http://www.URLDELAIMAGEN/<?php echo “$id_imagen.$ext”;?>” />
<center><h4><?php echo “$name_album”;?>…</h4></center></a>
</li>
<?php }
} ?>
</ul>
Eso es todo, ahora tenemos un forma fácil y rapida de subir imagenes a wordpress y mostrar las últimas en la página principal utilizando javascript!










Comments
Está bueno porque te resuelve un problema, pero… ¿qué pasa con el MVC? ¿No importa en WP?
Saludos!