Implementación de un carrusel de imágenes con Drupal 6

Hola en esta ocasión voy a explicar como se implementó un efecto carrusel de imágenes y/o videos para un proyecto en Drupal, lo que se hizo es utilizar el plugin de jquery llamado jscrollable.min.js el cual me da una apariencia de carrusel (elegante), para ello se debe de instalar previamente Drupal, de forma correcta.

Cuando me refiero de forma correcta es saber ubicar donde se van a agregar temas, módulos, files, etc; para ordenarnos desde un principio, luego instalar los módulos necesarios para nuestro site.

Para poder implementar es prerrequisito tener instalado los módulos jquery_update, jquery_plugin para extender los plugins jquery que trae por defecto Drupal, además el CCK y el image upload para la gestión de subida de archivos, y si uno quiere un módulo para miniaturizar imágenes recomiendo Image Api  + Image Cache, y por supuesto pero no necesario un módulo personalizado.

Para más detalle visita este línk donde podrás descargar un ejemplo.

Como solucionar el conflicto entre JQuery y Prototype usando Akelos PHP Framework

Como sabemos JQuery y Prototype son frameworks escritos en Javascript que permiten simplificar la manera de interactuar con documentos HTML orientándose al desarrollo sencillo y dinámico de aplicaciones web.

Akelos PHP Framework es una plataforma de desarrollo de aplicaciones web basado en el MVC (Modelo Vista Controlador) desarrollado por Bermi Ferrer, el cual contiene las buenas prácticas permitiendo simplificar el tiempo de implementación.

Bueno después de esta pequeña introducción, vamos a nuestro caso:

A veces queremos manejar eventos, desarrollar animaciones y agregar interacción con la tecnología AJAX a nuestras aplicaciones web y para ello decidimos usar JQuery, pero como Akelos por defecto usa el Prototype hay un probrema de compatibilidad, entonces para poder solucionar este problema:

Para nuestro ejemplo nos vamos al directorio view / layouts porsupuesto dentro de nuestra aplicación y seleccionamos main.tpl (puede ser otro tpl, pero se recomienda que sea en el principal).
La librería Prototype ya está funcionando así que la llamamos:

<%= javascript_include_tag ‘prototype’ %>
<%= javascript_include_tag ’scriptaculous’ %>
<%= javascript_include_tag ‘editam’ %>

Luego después de haber instalado nuestra librería JQuery en (se recomienda en este directorio) : public / javascripts / jquery.js la llamamos en nuestro tpl:

<%= javascript_include_tag ‘jquery’ %>
<%= javascript_include_tag ‘treeview’ %> (un plugin jquery de ejemplo)

Al final de las llamadas Prototype y Jquery ingresamos esta pequeña línea de código:

<script>jQuery.noConflict();</script>

Ah y no te olvides de cambiar el caracter “#” por “jQuery”, por ejemplo:

Antes:

function change_visibility(url,container){
#(container).html(‘<b style=”color:blue”>_{Updating}…</b>’);
#(container).load(url);
}

Despues:

function change_visibility(url,container){
jQuery(container).html(‘<b style=”color:blue”>_{Updating}…</b>’);
jQuery(container).load(url);
}

Y ya está solucionado el problema de trabajar con estos dos grandes frameworks.

Nota: Todas las llamadas a los scripts se deben ingresar antes del script que evita el conflicto.