Cómo crear una galería de álbumes de fotos en WordPress sin complemento

En este artículo, le mostraremos cómo crear una galería de álbumes de fotos en WordPress sin un complemento.

Todos sabemos que con los complementos en WordPress, nada es imposible de lograr.

Pero cuantos más complementos use, más se degradará el rendimiento de su sitio web.

Para cualquier sitio web, la galería juega un papel muy importante.

Si su galería involucra trabajos y filtros complicados, el rendimiento del sitio web en general puede verse afectado.

Se supone que una galería de álbumes de fotos tiene varias fotos en su interior.

Aquí estamos creando un álbum mensual para que cada álbum tenga una imagen de portada y cuando se hace clic en la imagen de portada, lo lleva dentro del álbum para ver cada foto individualmente.

También necesita saber cómo crear una galería de álbumes de fotos en WordPress sin un complemento para realizar tareas complicadas para las que necesita comprar un complemento premium si desea usar un complemento.

Además, puede usar uno de estos programas de edición de fotos para editar fotos que se adjuntarán a la galería de su álbum de fotos.

Pasos para crear una galería de álbumes de fotos en WordPress sin un complemento

Todas las características requeridas para lograr el propósito se pueden realizar utilizando las funcionalidades integradas de WordPress. Considere cada álbum mensual como una publicación con su propia página única. Considere cada imagen dentro de los álbumes como un archivo adjunto con una sola página propia.

Los álbumes necesitarán una miniatura y la función está incorporada en WordPress. Si su sitio web es el sitio web de un fotógrafo, puede convertir sus publicaciones predeterminadas en un álbum. De lo contrario, debe crear un tipo de publicación personalizada.

Cree un complemento específico del sitio (no listo para usar) y un tipo de publicación personalizada

Debe crear un complemento específico del sitio que no dependa de su tema. Son útiles para crear tipos de publicaciones personalizadas, agregar códigos abreviados, mostrar miniaturas y similares. Para crear un complemento específico del sitio, debe ir al directorio de complementos mediante FTP.

En wp-content/plugins/ cree una nueva carpeta y asigne a la carpeta el mismo nombre que el complemento que desea crear. Vaya dentro de la carpeta y cree un archivo php con el mismo nombre que la carpeta. Pegue el siguiente código dentro del archivo.

/*
Nombre del complemento: Complemento del sitio para website.com
Descripción: cambios de código específicos del sitio para website.com
*/
/* Comenzar a agregar funciones debajo de esta línea */
/* Deja de agregar funciones debajo de esta línea */

Guarda el archivo y cierra. El código mencionado anteriormente no tiene ningún significado y se reemplazará cuando se cree el tipo de publicación personalizada.

Genere el código para el tipo de publicación personalizada desde el Generador de código de tipo de publicación personalizado de WordPress.

Visualización de tamaños de imagen adicionales y campos adicionales–

Desde el Panel de administración, vaya a Apariencia y luego a Editor. Busque el archivo functions.php y agregue el siguiente código para registrar un tamaño de imagen adicional para la visualización de la cuadrícula.

add_image_size('cuadrícula-álbum', 225, 150, verdadero);

Si desea agregar campos personalizados adicionales al Cargador de medios, como el nombre del fotógrafo, sus páginas y otra información cuando carga una imagen, debe agregar el siguiente código en functions.php.

/**
 * Agregue los campos Nombre del fotógrafo y URL al cargador de medios
 * @param matriz $form_fields, campos para incluir en el formulario adjunto
 * @param $objeto de publicación, registro adjunto en la base de datos
 * @return $form_fields, campos de formulario modificados
 */

función be_attachment_field_credit ($form_fields, $post) {
    $form_fields['be-photographer-name'] = array(
        'label' = 'Nombre del fotógrafo',
        'entrada' = 'texto',
        'valor' = get_post_meta ($ post-ID, 'be_photographer_name', true),
        'helps' ='Si se proporciona, se mostrará el crédito de la foto',
    );
    $form_fields['be-photographer-url'] = array(
        'label' ='URL del fotógrafo',
        'entrada' = 'texto',
        'valor' = get_post_meta ($ post-ID, 'be_photographer_url', verdadero),
        'helps' = 'Añadir URL de fotógrafo',
    );
    devolver $formulario_campos;
}
add_filter('attachment_fields_to_edit', 'be_attachment_field_credit', 10, 2);

/**
 * Guarde los valores del nombre del fotógrafo y la URL en el cargador de medios
 * @param $post array, los datos de publicación para la base de datos
 * @param $matriz de archivos adjuntos, campos adjuntos del formulario $_POST
 * @return matriz $post, datos de publicación modificados
 */
función be_attachment_field_credit_save ($ publicación, $ archivo adjunto) {
    if( isset( $archivo adjunto['be-photographer-name'] ) )
        update_post_meta( $post['ID'], 'be_photographer_name', $adjunto['be-photographer-name'] );
    if( isset( $archivo adjunto['ser-fotógrafo-url'] ) )
update_post_meta( $post['ID'], 'be_photographer_url', esc_url( $attachment['be-photographer-url'] ) );
    devolver $ publicación;
}
add_filter('attachment_fields_to_save', 'be_attachment_field_credit_save', 10, 2);

Como puede ver, agregará dos campos de texto en el Cargador de medios, a saber, Nombre del fotógrafo y URL del fotógrafo.

Creación de páginas para mostrar todos los álbumes

Ahora es el momento de crear algunos álbumes (tipos de publicaciones personalizadas) y agregarles fotos. La imagen destacada será la imagen de portada del álbum. El contenido que agregue al área de contenido de la publicación se convertirá en la descripción del álbum.

Página de plantilla para álbumes

Cree un archivo y asígnele el nombre archive-albums.php. Copie el código del encabezado, pie de página, barra lateral y otros elementos de la interfaz de usuario y péguelo. Pegue el siguiente código para mostrar todos los álbumes en una página.

<li class="album-grid">a href="title=""</a></li>
post_type == 'álbumes' $post-post_status == 'publicar' ) {
        $archivos adjuntos = get_posts( array(
            'post_type' ='archivo adjunto',
            'publicaciones_por_página' =-1,
            'post_parent' =$post-ID,
            'excluir' =get_post_thumbnail_id()
        ) );
        if ($archivos adjuntos) {
            foreach ($archivos adjuntos como $archivo adjunto) {
                $clase = "mimo post-adjunto-" . sanitize_title ($ archivo adjunto-post_mime_type);
                $título = wp_get_attachment_link( $adjunto-ID, 'álbum-cuadrícula', verdadero);
                echo '<li class="' . $class . ' album-grid">' . $título . '</li>';
            }           
        }
    }

Coloque el siguiente código en el archivo CSS principal de su tema para que las imágenes de portada se muestren en una cuadrícula.

.album-grid{ancho: 225px; altura: 150px; flotador izquierdo; estilo de lista: ninguno; tipo-estilo-lista: ninguno; margen: 0 18px 30px 0px;}

Página de plantilla para cada imagen

Cree un archivo y asígnele el nombre single-attachments.php. Copie todo el código del single.php prediseñado del tema. Puede encontrarlo en Editor en el menú Apariencia. Luego busque el código de bucle en su single-attachments.php y reemplace esa sección con lo siguiente.

if ( have_posts() ) : while ( have_posts() ) : the_post();

$fotógrafo = get_post_meta($post-ID, 'be_photographer_name', true);

$photographerurl = get_post_meta($post-ID, 'be_photographer_url', true);

<h1>el_título();</h1>
<div class="photometa"><span class="nombre del fotógrafo"> echo $fotógrafo; </span> // <a href=" echo $photographerurl " target="_blank" class="photographerurl" rel="noopener noreferrer"> echo $photographerurl </a></div>
                        <div class="entrada-adjunto">
 if ( wp_attachment_is_image( $post-id ) ) : $att_image = wp_get_attachment_image_src( $post-id, "full"); 
                        <p class="archivo adjunto"><a>id); "título=" el_título(); " rel="adjunto"<img src=" echo $att_image[0];" width=" echo $att_image[1];" height="echo $att_image[2];" class="adjunto-medio">post_excerpt ;" //a>
                        </p>
 demás :
                        <a>ID) " title=" echo wp_specialchars( get_the_title($post-ID), 1 )" rel="attachment"echo basename($post-guid) </a>
 terminara si; 
                        </div>
 mientras tanto; 
 terminara si;