Visualiza la presentación de diapositivas desde un solo nodo


11

Estoy tratando de lograr una presentación de diapositivas de las imágenes en un solo nodo. Las imágenes se cargan desde el campo de imagen. Es drupal 7. Creé un nuevo tipo de contenido y todo lo que hice ahora es una presentación de diapositivas desde múltiples nodos (con una imagen en cada nodo). Esto funciona bien, pero eso es demasiado problemático para agregar un nuevo nodo para cada imagen.


Tener un nodo por imagen es IMO, la forma preferida de hacerlo, ya que es más flexible. Puede publicar / anular la publicación de nodos, agregar títulos / textos descriptivos / enlaces a los nodos que se pueden usar en la presentación de diapositivas, la cola de nodos se puede usar para organizar la clasificación, etc. Debe agregar los problemas que realmente enfrenta con el nodo único enfoque de presentación de diapositivas, ¿qué has intentado, qué pasó, qué está roto, etc.? ¿También es este Drupal 6 o 7? ¿Qué módulo de presentación de diapositivas utiliza?
googletorp

@googletorp Utilizo el módulo "Views Slideshow" con Drupal 7. Será una simple presentación de diapositivas / introducción y no necesito nada más que una simple presentación de imágenes sin título, descripción, botones de navegación, etc. Configuré vistas como esta: formato : Presentación de diapositivas, show: fields, content: intro (es mi tipo de contenido para este nodo). Ahora muestra las imágenes una por una en una sola fila.
smogg

Respuestas:


10

En la configuración de campo de imagen de vistas, en Configuración de campo múltiple , hay una casilla de verificación para "Mostrar todos los valores en la misma fila" que está marcada de forma predeterminada. Si desmarca esta casilla, colocará cada imagen en una nueva fila y funcionará según lo requiera. Sé que las vistas han tenido esta característica desde al menos la versión 2, pero podría llamarse algo ligeramente diferente en versiones anteriores.

Me gusta hacerlo de esta manera para presentaciones de diapositivas simples, puedo reorganizar todas las imágenes en un nodo / página de edición. Pero para presentaciones de diapositivas más complejas, como donde cada imagen se vincula en algún lugar o tiene texto alternativo, su mejor opción es probablemente usar un nodo por fila.


7

El módulo Field Slideshow es exactamente lo que necesita entonces. Todas las imágenes están contenidas dentro del nodo (sin hinchazón de nodo) y utiliza el ciclo jquery (al igual que las presentaciones de diapositivas) para producir una galería dinámica y presentación de diapositivas.


2

Recientemente construí un sitio con galerías simples y terminé sin usar módulos de presentación de diapositivas adicionales. Todo lo que necesitaba era jQuery Cycle y un pequeño javascript, agregado a mi tema personalizado. Este sitio tiene un tipo de contenido de 'foto' y un vocabulario de 'álbum' para asignar fotos a diferentes álbumes. Una vista crea una lista de fotos filtradas por álbum. En mi tema tengo un archivo js que se ve así:

(function($){

Drupal.behaviors.myAlbumSlideshow = {
  attach: function(){
    var slideshowContent = $('.view-fotoalbum.view-display-id-page_1>.view-content');

    slideshowContent.before('<div id="slideshow-prev">&lt;</div><div id="slideshow-next">&gt;</div>');

    slideshowContent.cycle({
      fx:       'scrollHorz',
      next:     '#slideshow-next',
      prev:     '#slideshow-prev',
      timeout:  0
    });

    var slideshowHeight = slideshowContent.height() + 'px';
    $('#slideshow-prev, #slideshow-next').css('lineHeight', slideshowHeight);
  }
}

})(jQuery)

Un toque de CSS lo termina:

.view-fotoalbum {
  width: 710px;
  margin-right: 10px;
}

.view-fotoalbum #slideshow-prev {
  color: #808080;
  border-right: 1px solid #808080;
  cursor: pointer;
  float: left;
  line-height: 300px;
  margin-left: -40px;
  text-align: center;
  width: 30px;  
}

.view-fotoalbum #slideshow-next {
  color: #808080;
  border-left: 1px solid #808080;
  cursor: pointer;
  float: right;
  line-height: 300px;
  margin-right: -40px;
  text-align: center;
  width: 30px;
}

PD. En mi humilde opinión, no siempre es mejor tener un solo nodo por imagen. Es cierto que este enfoque proporciona una mayor flexibilidad (por ejemplo, agregar una imagen a múltiples presentaciones de diapositivas), pero para algunos usuarios finales, la flexibilidad innecesaria es simplemente una complejidad inútil.


2

Puede considerar usar el módulo Galleria . Utiliza un solo nodo y muestra las imágenes de él como una presentación de diapositivas.


Sí, conozco este módulo y lo estoy usando en el mismo sitio que la galería. Pero es difícil lograr una presentación de diapositivas simple sin botones de navegación, etc. Pero no importa, me quedo con el sistema de imagen por nodo. Además, el módulo galleria no funciona cuando enciendo la compresión js en la configuración >> rendimiento; /
smogg

2

Descubrí una buena manera de tener múltiples imágenes y múltiples enlaces por imagen en un solo nodo:

Lo que querrá hacer es asegurarse de que tanto los campos de imagen como de enlace estén configurados en ilimitado en el tipo de contenido. Cuando cree su vista, también asegúrese de que "Mostrar todos los valores en la misma fila" NO esté marcado. Agregue un campo delta para su imagen y para su enlace. Agregue un filtro Global: PHP y establezca el código del filtro para esto: return (! $ Row-> delta == $ row-> delta_1);

Deberias hacer eso. Necesitará tener instalado el módulo PHP Vistas para usar PHP como filtro.


2

Para mostrar múltiples imágenes de un solo nodo en el control deslizante, use el módulo de bloque de visualización dinámica y lea la configuración. En esto, cuando cree una vista para mostrar el bloque deslizante, no marque la casilla de verificación al agregar la imagen con "Mostrar configuración de campo múltiple" si ya está marcada, desactívela.



1

Como casi todo en Drupal, hay muchas soluciones diferentes para esto, pero quiero compartir una simple que aún no he encontrado en ningún lado.

Básicamente, estaba buscando una manera de mostrar un montón de campos diferentes, todos conectados a un solo nodo, en una presentación de diapositivas. Estos campos incluían campos de imagen y texto. Entonces, para mostrar todos los campos adjuntos a un solo nodo en una presentación de diapositivas:

  1. Crea una vista para tu presentación de diapositivas. Use el formato "Lista sin formato".
  2. Configure la vista para mostrar solo un elemento, de modo que solo esté tratando con un solo nodo (o use el Filtro contextual: NID)
  3. Agregue todos los campos que desea que aparezcan en la presentación de diapositivas. Excluir todos los campos de la pantalla.
  4. Agregue un campo personalizado (asegúrese de que este campo se represente después de todos los campos que ha excluido de la visualización). Aquí podrás crear el marcado básico para tu presentación de diapositivas. Usando los patrones de reemplazo disponibles, configure cada campo disponible dentro de un lielemento como este:
    
    <ul id="slider">
    <li>[text_field_1]</li>
    <li>[image_field_1]</li>
    <li>[text_field_2]</li>
    <li>[image_field_2]</li>
    </ul>
    
    
  5. Luego puede ejecutar su control deslizante jQuery preferido. Si ya ha instalado en jQuery Cycle Plugin , puede ejecutarlo en el control deslizante con mucha facilidad. Solo asegúrese de que el complemento esté cargado en la página con su control deslizante y luego ejecútelo en su recién creado ul:
    
    (function ($, Drupal, window, document, undefined) {
    
        $(document).ready(function() {
            $('#slider').cycle({
            // choose your options
        });
        });
    
    })(jQuery, Drupal, this, this.document);
    
    

Y deberías estar listo para irte.


0

Hay un https://www.drupal.org/project/field_slideshow moduel que está hecho para crear una presentación de diapositivas desde un solo nodo.

Personalmente, creo que este sería un gran uso de una plantilla de tipo de nodo, luego cada nodo de ese tipo se formateará como una presentación de diapositivas con un alto grado de control, como dónde presentar el resto de los campos para ese nodo...

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.