[Solucionado] problemas con diseño del header

[Akthon]

Estoy teniendo bastante dificultan para poder dejar el header como yo quiero, ya que si inserto alguna imagen o algo se mueve todo y se descoloca, os dejo capturas para que veáis como esta ahora y como quiero que quede, en la segunda imagen a la derecha se aprecia la diferencia, el nombre del cliente mas bajo y entre este modulo y el de arriba de contacto insertada la imagen del buzon de sugerencias, al que lógicamente también habrá que ponerle un link al formulario.

Edited September 17, 2013 by Akthon (see edit history)

[Akthon]

Aun no he podido solucionar esto, alguien me puede echar una mano.

[Akthon]

Sigo a golpes con esto y no hay forma de solucionarlo, ya no se ni por donde meterle mano, no pongo la dirección de la web por que estoy la modificando en localhost, por eso puse arriba en el primer post la captura de lo que hay y de lo que quiero.

Edited August 19, 2013 by Akthon (see edit history)

[Sergio Ruiz]

Si quieres poner la imagen encima del bloque de información personal ¿Por que no editas el fichero blockuserinfo.tpl?

[Akthon]

ya lo he probado y nada, lo que estoy haciendo es porner el logo como background y la otra imagen la pondre como logo, espero que asi me deje desplazarla y poner el link.

Edited August 19, 2013 by Akthon (see edit history)

[Sergio Ruiz]

ya lo he probado y nada

 

¿nada en que sentido?

 

Editas el fichero:

 

/modules/blockuserinfo/blockuserinfo.tpl

 

/themes/la-plantilla/modules/blockuserinfo/blockuserinfo.tpl

 

Creas un div

 

<div id="sergio_ruiz">
<img src="......." />
</div>

 

Y luego en el css, juegas con el

 

#sergio_ruiz

 

..

[Akthon]

Nada, he probado con ese fragmento de código que me has pasado y lo único que me genera un cuadrado con una imagen como con un enlace roto y me desplaza todo el header hacia abajo, y eso que puse el enlace de la imagen bien y ni asi, voy a dejarlo estar unos días a ver si me despejo un poco y ya vuelvo voy a liarme ahora con otra cosa.

[Paula Martinez]

¿nada en que sentido?

 

Editas el fichero:

 

/modules/blockuserinfo/blockuserinfo.tpl

 

/themes/la-plantilla/modules/blockuserinfo/blockuserinfo.tpl

 

Creas un div

 

<div id="sergio_ruiz">
<img src="......." />
</div>

 

Y luego en el css, juegas con el

 

#sergio_ruiz

 

..

 

Hola,

 

Me llamo Raul Martinez,

 

La idea de "Sergio" me ha servido.

 

Gracias !

 

Saludos,

[Akthon]

Pues a mi no me funciona, mañana si tengo un rato lo haré como me dices y te hare una captura de pantalla para que veas el resultado, a ver si asi podemos llegar a solucionarlo, aun y asi muchas gracias por la ayuda.

 

Un saludo

[Akthon]

Aun sigo con esto, no tengo ningún archivo blockuserinfo.tpl en la carpeta del tema que estoy utilizando y añadiendo este codigo al archivo blockuserinfo.tpl que hay en la carpeta modules de prestashop, le pongo el código hay y no hace nada absolutamente, voy a seguir intentándolo.

[Akthon]

Depues de haber probado todo lo que me habeis comentado sigo con el mismo problema, no hay forma de ponerlo como he puesto en las imagenes, de echo no consigo ni que aparezca la imagen en ningun sitio, alguien me podria ayudar con este tema.

 

Un saludo

[Arakiss]

Tu sitio esta desactivado ponlo online de nuevo y le echo un vistazo.

[Akthon]

arakiss, aun no esta online, trabajo en localhost, pero las imágenes del primer post son una captura de imagen de la web.

[Akthon]

Buenos dias despues de retomar otra vez este tema no le veo solucion no soy capaz de hacer lo que quiero, lo de poner esa imagen con un link, he probado lo que me decis pero me es imposible, no me alcanza la cabeza para mas, y seguramente que sea la sencillo pero no me sale, os dejo los archivos que me decis del block_userinfo que por cierto solo tengo en la carpeta modules de prestashop no en la del theme que estoy usando.

 

 

Edited September 12, 2013 by Akthon (see edit history)

[nadie]

Mira esta guía: http://victor-rodenas.com/2013/06/10/guia-insertar-numero-de-telefono-en-la-cabecera-en-prestashop-1-5/ para que  te hagas una idea, es un ejemplo diferente, pero como ves, tambien es "aplicable" la idea para tu caso.

 

Saludos,

[nadie]

Depues de haber probado todo lo que me habeis comentado sigo con el mismo problema, no hay forma de ponerlo como he puesto en las imagenes, de echo no consigo ni que aparezca la imagen en ningun sitio, alguien me podria ayudar con este tema.

 

Un saludo

Fijate que cuando pongas el <img" ponlo por ejemplo asi:

 

<img src="{$img_dir}nadie.jpg" /> 

Y luego subes la imagen "nadie.jpg" al directorio "/themes/tu-plantilla/img/" (cuando digo tu-plantilla si es la default, pues sera default, si es la xmen, pues sera la xmen)

[nadie]

Otra opción depende seguía el ejemplo de la guía: http://victor-rodenas.com/2013/06/10/guia-insertar-numero-de-telefono-en-la-cabecera-en-prestashop-1-5/

 

Es por ejemplo en el global.css (/themes/tu-plantilla/css/global.css), cambiar esto:

#header_right {
	position:relative;
	float: right
}

por algo asi:

#header_right {
position: relative;
float: right;
background: url('../img/nadie.jpg') no-repeat 779px 19px;
}

y "nadie.jpg" lo subes al directorio "img" de tu plantilla.

 

(Es un ejemplo rapido basado en Prestashop 1.5.5..)

 

Donde he puesto 779px es para mover la imagen de fondo a la derecha y lo de 19px es para bajarlo o subirla dependiendo de si subes o bajas el numero. (El 779px y el 19px lo puedes cambiar como quieras..)

 

----

 

Otra opción seria aplicar el background unicamente sobre el 

#header_user

[Akthon]

Otra opción depende seguía el ejemplo de la guía: http://victor-rodenas.com/2013/06/10/guia-insertar-numero-de-telefono-en-la-cabecera-en-prestashop-1-5/

 

Es por ejemplo en el global.css (/themes/tu-plantilla/css/global.css), cambiar esto:

#header_right {
	position:relative;
	float: right
}

por algo asi:

#header_right {
position: relative;
float: right;
background: url('../img/nadie.jpg') no-repeat 779px 19px;
}

y "nadie.jpg" lo subes al directorio "img" de tu plantilla.

 

(Es un ejemplo rapido basado en Prestashop 1.5.5..)

 

Donde he puesto 779px es para mover la imagen de fondo a la derecha y lo de 19px es para bajarlo o subirla dependiendo de si subes o bajas el numero. (El 779px y el 19px lo puedes cambiar como quieras..)

 

----

 

Otra opción seria aplicar el background unicamente sobre el 

#header_user

 

Lo he echo asi, y la imagen a quedado en su sitio, ahora el tema es poder ponerle un enlace para que me habra el contac_form.

[Akthon]

Es por ejemplo en el global.css (/themes/tu-plantilla/css/global.css), cambiar esto:

#header_right {
	position:relative;
	float: right
}

por algo asi:

#header_right {
position: relative;
float: right;
background: url('../img/nadie.jpg') no-repeat 779px 19px;
}

y "nadie.jpg" lo subes al directorio "img" de tu plantilla.

 

(Es un ejemplo rapido basado en Prestashop 1.5.5..)

 

Donde he puesto 779px es para mover la imagen de fondo a la derecha y lo de 19px es para bajarlo o subirla dependiendo de si subes o bajas el numero. (El 779px y el 19px lo puedes cambiar como quieras..)

 

Lo he echo asi como pones aqui y la imagen ya esta en su sitio, lo unico que falta es crear un enlace para que al pichar sobre la imagen se habra el contact-form.

 

Gracias por la ayuda esto es un gran avance para mi.

[Akthon]

Podeis ayudarme con lo del link a esa imagen, estoy intentando hecerlo con el header.tpl pero no lo consigo ya que me pone o todo el header con ese lin o todo el header_right, y claro solo quiero que sea esa imagen.

[Akthon]

Alguien me puede echar un cable para dejar terminado el asunto este del boton y poder poner un enlace a esa foto, ya que si lo hago desde el header_right, me pone el link a toda esa zona y quiero que solo este en la imagen.

 

Graicas