Crear página personalizada con Prestashop 1.6
Ya que hay veces que surge la necesidad de crear una página nueva en prestashop y que por defecto no existe en prestashop, por ejemplo yo necesitaba crear una página personalizada en prestashop cuando un cliente me pedia mostrar el recorrido de su empresa y mostrando los productos que vendía en esa época. Por lo tanto opté por crear una página personalizada.
Así que sin mas emprezamos a crear nuestra página personaliza en prestashop
Crear página personalizada prestashop
Entramos a la raíz de Prestashop y creamos un archivo con el nombre que queramos, en nuestro caso paginaejemplo.php
Dentro de este archivo copiamos esto
<?
require(dirname(__FILE__).'/config/config.inc.php');
Tools::displayFileAsDeprecated();
Tools::redirect('index.php?controller=paginaejemplo', __PS_BASE_URI__, null, 'HTTP/1.1 301 Moved Permanently');
?>En el trozo de código, esta creando un controlador llamado paginaejemplo.
Vamos a crearlo:
El archivo controlador lo tenemos que guardar en la carpeta controllers>front.
En esta carpeta, creamos un archivo, en nuestro caso con el nombre paginaejemploController.php.
Dentro de este archivo copiamos esto
class paginaejemploControllerCore extends FrontController{
public $php_self = 'paginaejemplo';
public function setMedia(){
parent::setMedia();
$this->addCSS(_THEME_CSS_DIR_.'paginaejemplo.css');
}
public function init(){
parent::init();
}
public function initContent(){
parent::initContent();
$this->setTemplate(_PS_THEME_DIR_.'paginaejemplo.tpl');
}
}En este archivo estamos declarando una clase con el nombre paginaejemploControllerCore que extiende de FrontController.
public $php_self = 'paginaejemplo';
Aquí especificamos nuestro archivo php anterior que hemos creado en la raíz de prestashop.
$this->addCSS(_THEME_CSS_DIR_.'paginaejemplo.css');
Estas linea nos dice que este controlador recoja el archivo .css que se encuentra en la carpeta de nuestro tema por defecto.
$this->setTemplate(_PS_THEME_DIR_.'paginaejemplo.tpl');
Por ultimo esta linea nos dice que nuestro controlador busque nuestro archivo .tpl en el tema por defecto.
Las funciones que no he comentado como el function init() y el function initContent() lo explicare en otra entrada, pero para que os hagáis una idea, la primera es para inicializar las clases que queramos y la segunda para inicializar el contenido hacer peticiones a las clases y también poder enviarle a nuestro .tpl, las variables smarty que necesitemos.
Modificación del .tpl, .css de nuestra página personalida en Prestashop
Nos dirigimos ahora a themes>default-bootstrap
Creamos nuestro archivo paginaejemplo.tpl
<h1 class="titularPaginaPer"> Estoy en una página personalizada </h1>
Ahora mismo tenemos nuestra página personalizada creada, podemos darle estilo ya que hemos declarado un css para esta página, por lo tanto nos dirijimos a themes>default-bootstrap>css
Aquí añadimos un archivo paginaejemplo.css
.titularPaginaPer{Background:red;}Ya tendríamos nuestra página personalizada, pero puede ocurrir que aun no funcione, si esto nos sucediera vamos a cache y eliminamos el archivo class_index.php, este archivo lo regenera automáticamente prestashop con todas las páginas actualizadas. Ahora ya tendría que funcionar.
Pero si queréis añadirle una url amigable a nuestra nueva página, vamos al panel de administración y nos dirigimos a seo y urls, nos sale una lista con todas las páginas que tiene nuestro prestashop. Pulsamos en añadir nuevo, se abre una nueva ventana, como la de abajo.
En páginas buscaremos nuestra páginaejemplo y le pondremos el titulo que queramos y la meta descripción, tags y url amigable.
Ahora ya tendríamos nuestra página personalizada, recordar activar las rutas amigables, es en seo y urls, en el apartado Configuración de los enlaces y marcamos urls amigables si.
Espero que os haya gustado este tutorial de como crear página personalizada en prestashop, os dejo el ejemplo de como crear una página en prestashop para que os lo descargueís. Descargar
Saludos y compartir por vuestras redes sociales, el tutorial crear página personalizada en prestashop.
Hola a todos,
¿Cómo podría incluir varios parametros.idpublicacion = “9999”; ?
¿Cual sería el código completo?
Gracias
Posible hacer este cambio en prestashop para hacer una integración de mi web inmobiliaria de mi novia
nstanciación de Componentes BW
A continuación se indica cómo instanciar componentes del Buscador Web fuera de su entorno de escritorio y mantener la comunicación con este.
Componentes del Buscador Web
BuscadorCompacto: Componente que instancia una versión reducida de los controles para filtrar la búsqueda de inmuebles.
Destacados: Componente que muestra las ofertas destacadas individualmente del listado de inmuebles.
Buscador: Componente que instancia la versión completa de los controles para filtrar la búsqueda de inmuebles. También incluye el listado de resultados y detalles de los inmuebles.
Implementación en la web
Alojar en root de la web, el fichero inmofactory_helper.html1 (suministrado por Inmofactory).
En cada página donde se desee la ubicación de un componente Buscador Web, deberá incluirse el siguiente código en la sección de la misma:
Código a insertar en la página para crear un Buscador (con los parámetros por defecto):
parametros.componente = «Buscador»;
parametros.idpublicacion = «NNNN»;
new Ib2c(parametros);
Código a insertar en la página para crear un BuscadorCompacto o unos Destacados (con los parámetros por defecto):
parametros.urlbuscador = «http://RUTA_WEB_DEL_CLIENTE/PAGINA_DEL_BUSCADOR»;
parametros.componente = «BuscadorCompacto»;
parametros.idpublicacion = «NNNN»;
new Ib2c(parametros);
Los posibles parámetros que puede informar el cliente son:
parametros.componente: Indica el componente a instanciar: ”BuscadorCompacto”, “Destacados” o “Buscador“
parametros.idpublicacion: ID de la publicación a mostrar en el buscador (suministrado por Inmofactory).
parametros.dominiobase: (OPCIONAL) Es la ruta de la web del cliente. Si no lo informa el cliente este valor se informará automáticamente. Se puede informar tanto con http como sin. Útil sobre todo para webs que no estén ubicadas en el root de un dominio.
parametros.idioma: (OPCIONAL) Idioma a mostrar la web. Por defecto: Español
Valores válidos:
“es” = Español “de” = Alemán “fr” = Francés “ca” = Catalán
“eu” = Euskera “en” = Inglés “pt” = Portugués
parametros.modalidad: (OPCIONAL) Tipo de transacción a la que se limitará el buscador. Por defecto: Todos.
Valores válidos:
“1”=Venta “3”=Alquiler ”4”=Traspaso ”7”=Compartir “8”=Alquiler vacacional
parametros.mostrarsoloadjudicados: (OPCIONAL) Indica si se debe limitar el buscador a sólo mostrar los inmuebles de adjudicados bancarios. Por defecto: “0”.
Valores válidos: “1”=Sólo Adjudicados Bancarios, “0”=Todos
parametros.mostrardestacados: (OPCIONAL) Indica si se deben mostrar los destacados entre la parrilla y los filtros en la pantalla del Buscador. Por defecto: “1”.
Valores válidos “0”=No mostrar destacados, “1”=Si mostrar destacados.
parametros.mostrargrid: (OPCIONAL) Indica si se debe mostrar el grid de resultados en la pantalla del Buscador la primera vez que accedemos a él. Por defecto: Si.
Valores válidos “0” = no mostrar, cualquier otro valor muestra la parrilla desplegada
parametros.urlbuscador: (OPCIONAL) Informa la ruta web donde el cliente ha instanciado el componente Buscador. Se usa exclusivamente en el componente “BuscadorCompacto” y “Destacados” para indicar a qué página debe ir la web para mostrar los resultados.
Resumen del procedimiento
1. Ubicar en root de su web, el fichero inmofactory_helper.html (suministrado por Inmofactory).
2. En las páginas donde se instancien componentes BW incluir el siguiente código en la sección :
3. Insertar el siguiente código en la página donde queremos instanciar él componente elegido de una publicación:
parametros.componente = «Componente_Elegido»;
parametros.idpublicacion = «9999»;
new Ib2c(parametros);
Ejemplo de código con todos los parámetros posibles
En la web xxxx
Queremos crear un Buscador Compacto de la publicación “9999” en catalán, limitado a inmuebles en alquiler que sean adjudicados bancarios, que la página del buscador no muestre la lista de resultados la primera vez que se entra y que tampoco muestre inmuebles destacados.
Además esta web está en un hosting gratuito donde no tenemos la web en el root del dominio ni podemos copiar en ese root el fichero inmofactory_helper.html suministrado.
parametros.componente = «BuscadorCompacto»;
parametros.idpublicacion = «9999»;
parametros.idioma = «ca»;
parametros.modalidad = «3»;
parametros.mostrarsoloadjudicados = «1»;
parametros.mostrardestacados = «0»;
parametros.mostrargrid = «0»;
parametros.urlbuscador = » «;
parametros.dominiobase = «/carpeta»;
new Ib2c(parametros);
Hola Yeltdiss,
Podrías explicarlo un poco más corto? primero de todo si vas a montar un negocio te recomiendo que pagues un hosting como mínimo, ya que los gratuitos para montar un negocio… dejan mucho que desear
Saludos,
Valeu amigo. me ajudou muito.
He probado lo que has dicho y no me ha funcionado, he repetido los mismos pasos bajandome el ejemplo que has puesto y tampoco me va, no me aparece en la lista de Seo + URLs.
Borré el class index y tambien cache pero nada.
He probado otra vez y a mi me funciona, has seguido todos los pasos? por comentarios anteriores a la gente le ha funcionado.
Exactamente no se que te puede ocurrir pero entiendo que a lo mejor te has dejado algún paso, ya que si dices que has borrado el class index y cache.
Lo siento por no poder ayudarte más, dime cualquier cosa y te digo.
Sigo los pasos y al intentar acceder a la nueva página sale error 500 🙁
Eliminaste el class index que se encuentra en la carpeta cache?
un pequeño detalle… gracias, esta resuelto 😀
De nada, me alegro que te haya funcionado😀
Muy buen aporte
estoy trabajando con prestashop 1.6 y necesito una pagina nueva, hice exactamene lo que indicas pero al entrar a la pagina me aparece en blanco no me muestra nada, podrias ayudarme.
saludos
Eliminaste el class index que se encuentra en la carpeta cache?
lo he encontrado interesante, pero no me funciona, enteoria con llamar al paginaejemplo.php deberia funcionar?
Hola Sergio,
te envió un ejemplo para que lo compruebes, ya que a mi me ha funcionado crear la página personalizada prestashop , correctamente puede ser que sea porque wordpress genera las comillas simples » de otra manera y luego al copiarlo, he editado los post y ahora no causa ningún problema las comillas simples y he subido un archivo .rar para que quede mas claro el tutorial.
Saludos y gracias
Gracias a ti Antonio!
Muchas gracias, lo he encontrado muy útil, para poder crear una página en prestashop