Módulos de PrestaShop II

Lenguajes que usaremos hoy PHP, HTML, CSS. 

Programas usados: XAMPP, JetBrains y notepad++.
Continuamos con la elaboración del modulo anterior. Teníamos la opción administrativa de cambiar el nombre de nuestro modulo. Ahora vamos a delimitar la parte del cliente, y configuraremos su apariencia y funciones.

1.- Modificamos nuestro blogmoduloprestashop.php

/**

* BlogModulePrestashop installation.

* Modify form view in web

*/

public function install()

{

if (Shop::isFeatureActive())

Shop::setContext(Shop::CONTEXT_ALL);

return parent::install() &&

$this->registerHook('leftColumn') &&

$this->registerHook('header') &&

Configuration::updateValue('MYMODULE_NAME', 'Navis');

}

2.- Añadimos los hook necesarios

/**

 * left column

 */

public function hookDisplayLeftColumn($params)

{

$this->context->smarty->assign(

array(

'my_module_name' => Configuration::get('MYMODULE_NAME'),

'my_module_link' => $this->context->link->getModuleLink('blogmoduleprestashop', 'display')

)

);

return $this->display(__FILE__, 'blogmoduleprestashop.tpl');

}

/**

 * right column

 */

public function hookDisplayRightColumn($params)

{

return $this->hookDisplayLeftColumn($params);

}

/**

 * display header

 */

public function hookDisplayHeader()

{

$this->context->controller->addCSS($this->_path.'css/blogmoduleprestashop.css', 'all');

}

3.- Abrimos el bloc de notas o Notepad++ y escribimos lo siguiente:

<!-- Block blogmoduleprestashop -->

<div id="blogmoduleprestashop_block_home" class="block">

  <h4>Welcome!</h4>

  <div class="block_content">

    <p>Hello,

       {if isset($my_module_name) && $my_module_name}

           {$my_module_name}

       {else}

           World

       {/if}

       !       

    </p>   

    <ul>

      <li><a href="{$my_module_link}" title="Click this link">Click me!</a></li>

    </ul>

  </div>

</div>

<!-- /Block blogmoduleprestashop -->

la guardamos en C:\xampp\htdocs\tienda\modules\blogmoduleprestashop\views\templates\hook y cambiamos la extensión por tpl.

4.- Creamos la carpeta css dentro de nuestro modulo (C:\xampp\htdocs\electronicamente\modules\blogmoduleprestashop\css), abrimos el bloc de notas o Notepad++ y escribimos lo siguiente:

div#mymodule_block_home p {
  font-size: 150%;
  font-style:italic;

}

y lo guardamos con extensión css (blogmoduleprestashop.css)

5.- 
" Si usted ha seguido este tutorial a la letra y todavía no ver nada que aparece en la columna izquierda del tema, que podría ser debido a PrestaShop ha almacenado en caché las plantillas anteriores, y todavía está sirviendo éstos para usted. Por lo tanto, se ve la versión original del tema, sin cambios.
Smarty almacena en caché una versión compilada de la página de inicio, por razones de rendimiento. Esto es sumamente útil para los centros de producción, pero es inútil para los sitios de pruebas, donde se puede cargar la primera página de forma regular con el fin de ver el impacto de los cambios.
Al editar o depurar un tema en un sitio de prueba, siempre se debe desactivar la memoria caché, con el fin de obligar a Smarty para volver a compilar plantillas en cada carga de página.
A tal fin, vaya al menú "Parámetros avanzados", seleccione la página "Rendimiento", a continuación, en la sección "Smarty" "

6.- Si como yo aun sigues sin ver nada dirígete al administrador > módulos > Leo Positions Control Panel y ves probando cada hook, hasta que se alineen los astros y veas que coincide el modulo, con la página y la posición que deseas. En mi caso al final hook_left de la página principal.

Continuará...