Logo de islavisual
Isotipo de islavisual IslaVisual
imagen de sección

Ultima revisión 05/05/2013

Cómo sacar el slider de Prestashop de la columna central

Hoy, en este tutorial vamos a aprender cómo extraer el módulo HomeSlider de PrestaShop de la columna central a la zona de la cabecera. Por defecto, este módulo no puede ser movido o trasplantado fuera de la columna central. Sin embargo, es más simple y fácil de lo que parece a primera vista.

prestashop_image

Probablemente, cuando se trata de hacer este cambio, a la fuerza bruta, se muestre este error:

Entonces ¿ Cómo modificar el módulo homeslider ?. Lo primero es abrir el archivo homeslider.php que está localizado en la carpeta modules/homeslider del directorio raíz de nuestro prestashop, pegamos justo encima de la función hookDisplayHome el siguiente código y guardamos el archivo.

public function hookdisplayTop(){
    if(!$this->_prepareHook())
    return;
 
    if ($this->context->getMobileDevice() != false)
    return false;
 
    $this->context->controller->addJS($this->_path.'js/jquery.bxSlider.min.js');
    $this->context->controller->addCSS($this->_path.'bx_styles.css');
    $this->context->controller->addJS($this->_path.'js/homeslider.js');
    return $this->display(__FILE__, 'homeslider.tpl');
}

Con esta función, que es idéntica a la función hookdisplayHome(), sólo preparamos a Prestashop para que cuando cambiemos la posición lo muestre.

Ahora tenemos que decir a Prestasho que el HomeSlider ya no pertenezca a la columna central sino a la cabecera. Para ello, desde phpMyAdmin o MySQL Workbench editamos la base de datos.

NOTA: El prefijo ps_ debéis sustituirlo por el prefijo de las tablas de vuestro Prestashop.

Ejecutamos la siguiente consulta para saber ´donde tocar:

SELECT hm.*  
 FROM `ps_hook_module` hm, `ps_module` m, `ps_hook` h 
WHERE hm.`id_module` = m.`id_module` 
  AND h.id_hook = hm.id_hook
  AND m.`name` LIKE '%homeslide%'
  AND h.name LIKE '%displayHome%'

Esta consulta nos devolvera un registro que será parecido, si no igual, a :

id_module id_shop id_hook position
39 1 8 1

Ahora consultamos el ID del Hook dónde lo queremos insertar, en este caso el TOP o header.

SELECT id_hook FROM `ps_hook` WHERE `name` LIKE 'displayTop';

Esta consulta nos devolverá el ID del hook de displayTop que, en nuestro caso, es 14. Y, ahora, finalmente editamos el registro anterior y le asignamos los valores nuevos:

UPDATE  `hd_hook_module` SET id_hook = 14, position = 10 WHERE  `id_module` = 39 AND id_hook = 8;

Recordad que los valores anteriores 14, 39 y 8 pueden ser distintos y que debésis cambiarlos por los vuestros si procede.

El motivo de establecer el campo position a 10 es para que se establezca como último elemento del hook, es decir, debajo del menu de navegación principal.

Ahora sólo queda que cambiéis los anchos, altos y demás estilos, lo que podéis hacer en el archivo bx_styles.css localizado en el mismo directorio del homeslider.php.



Sobre el autor

Imagen de Pablo Enrique Fernández Casado
Pablo Enrique Fernández Casado

CEO de IslaVisual, Manager, Full Stack Analyst Developer y formador por cuenta ajena con más de 25 años de experiencia en el campo de la programación y más de 10 en el campo del diseño, UX, usabilidad web y accesibilidad web. También es escritor y compositor de música, además de presentar múltiples soft kills como la escucha activa, el trabajo en equipo, la creatividad, la resiliencia o la capacidad de aprendizaje, entre otras.

Especializado en proveer soluciones integrales de bajo coste y actividades de consultoría de Usabilidad, Accesibilidad y Experiencia de Usuario (UX), además de ofrecer asesoramiento en SEO, optimización de sistemas y páginas web, entre otras habilidades.