El rotador de libros

Vamos con el resumen de ese primer pequeño proyecto de programación en WordPress que he llevado a cabo a saltos en un par de ratos entre pañales, llantos y demás tareas paternales: el rotador de libros.

Dar primero un poco de contexto acerca de lo que quería conseguir y por qué.

Tenía un widget en portada de esta página que mostraba una imagen estática de la portada de El Diario Teutón de manera que, al pulsar sobre el mismo, se iba a la página de los detalles del libro y se ofrecía la compra. A modo de mini-proyecto para empezar con buen pie en la programación para WordPress, se pretendía usar un widget que aceptara código PHP para que alternara esa portada con la de El Diario de Nantes y que, igualmente, al pulsar sobre la misma, condujera a la página del libro en cuestión. Con cada carga de la portada del sitio se seleccionaría uno de los dos libros al azar.

Una de las condiciones del mini-desarrollo era hacerlo con vistas al futuro. Es decir, si en el futuro se añade otro libro, que el código creado se pueda reutilizar.

Pues bien, después de algunos compases y dificultades, ya he terminado el mini-proyecto, que me ha llevado tal vez media hora o algo más. Menciono el tiempo porque es importante saber cuánto nos lleva hacer las cosas para poder planear el trabajo.

Los puntos clave del mini-proyecto han sido:

  • Crear un arreglo indexado que contiene como índices las portadas de los libros y como elementos los enlaces a sus páginas. Esta aproximación permite, en el futuro, ampliar el arreglo con nuevos libros siguiendo esa estructura.
  • Selección aleatoria de uno de los elementos del arreglo. Para ello me encontré con la función PHP array_rand() que hace precisamente eso.
  • Finalmente, sólo quedaba mostrar el elemento HTML a, que permite enlazar cosas, y hacer que muestre la imagen de la portada seleccionada. Especificar también el ancho de la imagen, para que encaje en el hueco, y darle la clase CSS propia correspondiente para que le ponga un borde a la imagen.

Y básicamente eso ha sido todo.

Destacar que al principio no me funcionó porque abrí mal las etiquetas de PHP. En lugar de abrir con <?php> abrí con <php>, lo que me produjo una gran vergüenza. Pero oye, hay que aceptar lo que hay y estar dispuestos a aprender y hacerlo con gusto.

Y, finalmente, aquí el código:

<?php
// Alterna El Diario Teutón y El Diario de Nantes
// Enlaces a los libros (portada, enlace)
$libros = array("https://elsentidodelavida.net/wp-content/uploads/2020/09/portada-Diario-Nantes.jpg" => "https://elsentidodelavida.net/el-diario-de-nantes/",
"https://elsentidodelavida.net/wp-content/uploads/2020/08/Diario-Teuton-El-Javier-Malonda-Ricart-208x300.jpg" => "https://elsentidodelavida.net/el-diario-teuton/");

// Selecciona una portada
$portada = array_rand($libros);

?>
// Muestra el libro
<a href="<?php echo $libros[$portada] ?>"><img class="portada-libro" width="170px" src="<?php echo $portada ?>"></a>
<?php
// Alterna El Diario Teutón y El Diario de Nantes
// Enlaces a los libros (portada, enlace)
$libros = array("https://elsentidodelavida.net/wp-content/uploads/2020/09/portada-Diario-Nantes.jpg" => "https://elsentidodelavida.net/el-diario-de-nantes/",
"https://elsentidodelavida.net/wp-content/uploads/2020/08/Diario-Teuton-El-Javier-Malonda-Ricart-208x300.jpg" => "https://elsentidodelavida.net/el-diario-teuton/");

// Selecciona una portada
$portada = array_rand($libros);

// Muestra el libro
?>
<a href="<?php echo $libros[$portada] ?>"><img class="portada-libro" width="170px" src="<?php echo $portada ?>"></a>

Primero creamos un arreglo llamado libros. Luego seleccionamos la portada y, finalmente, mostramos el libro. La última parte es algo delicada porque hay que imbuir el código PHP en el HTML para que le suministre las variables apropiadamente.

¿Cómo lo veis? ¿Sugerencias? ¿Correciones?

¿Conocéis PHP? ¿Qué os llama la atención? ¿Queréis alguna aclaración acerca del código?

PD: El código veo que se muestra mal pero, con un bebé en brazos, no lo puedo investigar ahora.

PD2: He añadido un bloque de código extra, sin colorines, mientras investigo por qué no funciona el otro.

Comentarios

Deja una respuesta