Jump to content

<Solucionado> Barra horizontal a mi gusto y 2 columnas portada


JBJ

Recommended Posts

Buenas a todos.

 

Utilizo la versión de prestashop 1.5.6.0

 

La plantilla que utilizo es la que viene por defecto, la de la tienda appel.

 

Mi web es www.cajapack.es

 

Mi idea con la tienda es intentar dejar la parte del frontpage (nuestra imagen cara al comprador) a mi gusto.

 

La primera duda que tengo es a la hora de modificar la barra horizontal como yo quiero. Me gustaria poder dejarla como la de la pagina www.rajapack.com

 

Con el texto a 2 lineas y que salga como un desplegable.

 

 

También otra duda que me surge es como puedo dejar la pagina de inicio con 1 sola columna y el resto de paginas con 2 columnas. Tal como pasa en la web que he comentado.

 

Un saludo.

 

 

Edited by JBJ (see edit history)
Link to comment
Share on other sites

Entra en /theme/header.tpl Añade lo que esta en rojo, asi ocultas siempre la columna izquierda. Cambia grid_5 por grid_7 (en verde)

 

<div id="columns" class="grid_9 alpha omega clearfix">
<!-- Left -->
<!--
<div id="left_column" class="column grid_2 alpha">
{$HOOK_LEFT_COLUMN}
</div>
-->
 
<!-- Center -->
<div id="center_column" class=" grid_7">  
 
 
 
Ahora añade en global.css

 

 

#index #right_column{

display: none; /* Con esto ocultas columna derecha en la portada */

}

#index #center_column{

    width: 960px !important; /*Con esto ocupas todo el ancho en la portada. Después tendrás que modificar anchos de slider y otras cosas que tengas en la portada*/

}

  • Like 1
Link to comment
Share on other sites

<!--
<div id="left_column" class="column grid_2 alpha">
{$HOOK_LEFT_COLUMN}
</div>
-->

Yo prefiero personalmente así: (con {* *}) para no llevarme sorpresas (no estoy loco)


{*
<div id="left_column" class="column grid_2 alpha">
{$HOOK_LEFT_COLUMN}
</div>
*}


Si no te puedes llevar una desagradable sorpresa en algunos casos

 

 

---

 

 

Ahora añade en global.css

 

#index #center_column{

    width: 960px !important; /*Con esto ocupas todo el ancho en la portada. Después tendrás que modificar anchos de slider y otras cosas que tengas en la portada*/

}

No es necesario en este caso el !important, prefiero dejarlo así personalmente:

#index #center_column {
margin-right: 0px;
width: 980px;
}
Link to comment
Share on other sites

Buenas a todos,

 

Gracias por las respuestas sobre como eliminar las barras de la derecha y ampliar la de la portada. Lo probare en cuanto pueda.

 

He estado mirando para cambiar la barra superior, me gustaría que tuviese un desplegable y poder escribir en 2 lineas para tener espacio para todas las categorías que quiero poner.

Me he descargado el menú de jbx pero no se si es por la versión de prestashop que no me sale para instalar y desde la pagina ofical da un error la descarga, ¿alguna otra opción?

Link to comment
Share on other sites

Otra cosa que quería preguntaros para hacer las modificaciones que me comentais supongo que hay que hacerlo como programación. Yo de esto tengo poca idea, tengo instalado el prestashop directamente desde mi panel de control, podeis explicarme que tengo que hacer para poder hacer las modificaciones que me decis, si tengo que instalar de alguna forma el prestashop en mi ordenador o volver a cargarla tienda no hay problema por que todavia no e echo nada en la web.

Link to comment
Share on other sites

Buenas tardes,

 

He encontrado un menú horizontal que me gusta bastante con la idea que llevo para la web que estoy haciendo.

 

El menú es de esta web http://www.yves-rocher.es.

 

Me gusta por el desplegable y por poder colocar imagen de bajo de las categorías de productos, ¿hay algún modulo en prestashop que se parezca a eso? Aunque sigo necesitando que se pueda escribir en 2 lineas.

 

Una duda que tengo, ¿el menú horizontal es el mas adecuado que uno puesto de forma vertical? ¿Hay alguna diferencia significativa de uno a otro a la hora de que la web pueda ser más atractiva para el cliente?

 

Un saludo

Link to comment
Share on other sites

No es necesario en este caso el !important, prefiero dejarlo así personalmente:

#index #center_column {
margin-right: 0px;
width: 980px;
}

Este dato de aquí no me ha funcionado, no se si estare haciendo algo mal, cambio el tamaño del modulo:

Imagen de control deslizante para su página web.

 

Pero me sale la pagina en blanco.

No estoy seguro de si es por la foto o por que no he puesto los datos bien.

Link to comment
Share on other sites

Buenas tardes,

 

He encontrado un menú horizontal que me gusta bastante con la idea que llevo para la web que estoy haciendo.

 

El menú es de esta web http://www.yves-rocher.es.

 

Me gusta por el desplegable y por poder colocar imagen de bajo de las categorías de productos, ¿hay algún modulo en prestashop que se parezca a eso? Aunque sigo necesitando que se pueda escribir en 2 lineas.

 

Una duda que tengo, ¿el menú horizontal es el mas adecuado que uno puesto de forma vertical? ¿Hay alguna diferencia significativa de uno a otro a la hora de que la web pueda ser más atractiva para el cliente?

 

Un saludo

Un modulo como el que usa esa web, seria el "Advanced top menu": http://addons.prestashop.com/en/front-office-features-prestashop-modules/2072-advanced-top-menu-the-best-menu-manager.html (Ese módulo es un clasico, la pena es que es de pago, pero yo lo probe en su momento y de los que ahí de pago fue el que mas me convencio, ahora han cambiado las cosas y supongo que tendras algo mas economico y quizas mejor)

 

Gratis, he encontrado estos aportes: http://www.prestashop.com/forums/topic/195259-module-gratuit-menu-mega-drown-evolution-v20/, http://www.prestashop.com/forums/topic/159505-menu-mega-menu-gratuito-en-css/

  • Like 1
Link to comment
Share on other sites

No es necesario en este caso el !important, prefiero dejarlo así personalmente:

#index #center_column {
margin-right: 0px;
width: 980px;
}
Este dato de aquí no me ha funcionado, no se si estare haciendo algo mal, cambio el tamaño del modulo:

Imagen de control deslizante para su página web.

 

Pero me sale la pagina en blanco.

No estoy seguro de si es por la foto o por que no he puesto los datos bien.

 

Una cosa es el ancho de la columna central y otra el del slider. (Recuerda solo 1 duda por tema xDDDDDDD)

 

Supongo que en la configuración del modulo imagen deslizante de control, has configurado las medidas.

 

Pues ahora, para aumentar el contenedor del ancho del slider, haz esto: http://www.prestashop.com/forums/topic/250081-solucionado-varias-dudas-slider-y-columnas-en-diferentes-paginas/?do=findComment&comment=1244535 (el ancho del enlace en tu caso cambialo a lo que tu estimes)

Link to comment
Share on other sites

Una cosa es el ancho de la columna central y otra el del slider. (Recuerda solo 1 duda por tema xDDDDDDD)

 

Supongo que en la configuración del modulo imagen deslizante de control, has configurado las medidas.

 

Pues ahora, para aumentar el contenedor del ancho del slider, haz esto: http://www.prestashop.com/forums/topic/250081-solucionado-varias-dudas-slider-y-columnas-en-diferentes-paginas/?do=findComment&comment=1244535 (el ancho del enlace en tu caso cambialo a lo que tu estimes)

 

 

A ver me explico.

 

Según un articulo de tu blog e eliminado el lado derecho de la portada de mi web y despues e puesto :

 

#index #center_column {

margin-right: 0px;

width: 735px;

}

 

Pero si le doy por ejemplo 740 desaparece el slider,

Y dandole las medidas de 735 al largo del slider no llega hasta el final del lateral si no que se nota que le falta un poco para llegar al final de la pagina, si quieres mira mi pagina y lo veras en seguida.

 

No se realmente que sera por que el slider no llega al final y si a largo la columna final desaparece el centro de la pagina.

 

Un saludo

Link to comment
Share on other sites

Olvidate de mi blog.

 

¿Pero el slider donde lo estas mostrando debajo del menu o en la pagina principal?

 

¿No decias que la pagina principal solo tenia la columna del centro?

 

Si dejas la izquierda y central solo en la home, en todo caso el ancho del center_column:

#index #center_column {
width: 757px;
margin-right: 0px;
}

(ancho 757px) 

 

o modificar el fichero:

/themes/default/header.tpl

y cambiar esto:

				<div id="center_column" class=" grid_5">

por esto:

				<div id="center_column" {if $page_name=='index'}class=" grid_7 alpha omega" {else} class=" grid_5" {/if}>

Y el ancho del slider tendras que ponerlo a

757px
  • Like 1
Link to comment
Share on other sites

En un principio queria solo el centro pero al final voy a dejar la de la izquierda y el centro.

 

 

Voy a probar lo que me comentas y te digo.

 

¿Como ha ido todo al final?

 

(Por lo que veo solo quieres el centro y izquierda para la home, y para el resto de pagina que se vean las 3 columnas (al menos eso veo en tu web) )

Link to comment
Share on other sites

Si en un principio la pagina principal son 2 columnas ( izquierda y central) y las demas con 3 columnas.

 

Pues poniendo lo que tu me dices de :

 

#index #center_column {
width: 757px;
margin-right: 0px;
}

 

Sale ya perfecto.

 

Muchas gracias.

Link to comment
Share on other sites

Si en un principio la pagina principal son 2 columnas ( izquierda y central) y las demas con 3 columnas.

 

Pues poniendo lo que tu me dices de :

 

#index #center_column {

width: 757px;

margin-right: 0px;

}

 

Sale ya perfecto.

 

Muchas gracias.

 

Un placer ayudarte y servirte !

 

PD: Como he visto que has añadido la palabra "Solucionado" al titulo del tema, cierro el tema.

 

Para cualquier otra duda, no dudes en crear un tema nuevo en el foro.

 

Nos vemos por el foro !

Link to comment
Share on other sites

Guest
This topic is now closed to further replies.
×
×
  • Create New...