Problemas de visualización de Joomla en Intenet Explorer 8  

 
Jorge
 Jorge
Estimable Member

Hola buenas tardes,

Me podríais indicar por favor algunas indicaciones para tratar de solucionar estos problemillas que estoy teniendo a la hora de visualizar correctamente Joomla en Internet Explorer 8, lo explicaré con algunas imágenes para detallarlo mejor.

Datos de referencia:
- Joomla 1.5.23
- Template JA Purity

En primer lugar, en Internet Explorer 8 el Header sale descompensado en su parte derecha, y en la izquierda y centro no aparecen las imágenes que debieran.

Vista en Internet Explorer 4.0.1

Vista en Firefox 4.0.1

En segundo lugar, el Footer queda desplazado hacia arriba

Y para terminar, en la página de registro la página se desplaza hacia la parte inferior y en ocasiones aparece el siguiente mensaje.
Debajo de la foto os anoto lo que decían los detalles de dicho error.


Contenido solo visible a usuarios registrados

He leído algunos post de hace tiempo pero o bien son desplazamiento de menús y módulos o si no son para otro template algo distintos del JA Purity.

Os agradezco de antemano vuestra inestimable ayuda.

Un saludo

Citar
Respondido : 14/06/2011 4:26 pm
Jhon
 Jhon
Soporte CMS Webempresa Moderator

Hola Jorge

Has instalado o habilitado recientemente alguna extensión?, de ser así prueba desactivándola

Revisa si tienes activo el pluging de mootools updgrade, prueba desactivándolo
Revisa también si tienes algún pluging de compatibilidad con IE (IE8 Compatibility) , prueba activándolo

Prueba lo sugerido y nos comentas.

Saludos.

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar mi Testimonio
¡Gracias!.

ResponderCitar
Respondido : 14/06/2011 7:42 pm

optimiza-automaticamente-todas-las-imagenes-de-tu-wordpress

Jorge
 Jorge
Estimable Member

Hola buenas tardes Jhon,

He mirado todo lo que me comentas y lo tengo así:

- mootools upgrade --> desactivado
- IE8 Compatibility --> activado y configurado con Emule IE7

En cuanto a si he activado o instalado alguna extensión recientemente, no, tan solo he ido incluyendo nuevos artículos.

Un saludo

ResponderCitar
Respondido : 14/06/2011 8:26 pm
Jhon
 Jhon
Soporte CMS Webempresa Moderator

Hola Jorge

He visto que colocas la imagen en varias etiquetas del template, esto no es necesario, bastaría solo con una de ellas.
Otra buena práctica es sólo colocar una franja de la imagen ya que puede repetirse y dar la apariencia de una imagen más grande.

Si estas teniendo problemas con ie, es por q sólo esta imprimiendo una porción, el problema al parecer es que sólo se visualizar la última capa con imagen .ja-headermask , prueba agregando un width =100%, es decir :

.ja-headermask{
/*otro código*/
width:100%;
}

Saludos.

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar mi Testimonio
¡Gracias!.

ResponderCitar
Respondido : 15/06/2011 12:34 am

Gestor de Contraseñas - VPN Conexión Segura - Gestor 2FA (Segundo Factor de Autenticación

Jorge
 Jorge
Estimable Member

Buenas noches Jhon,

Acabo de realizar el cambio que me has comentado, pero en el IE8 no se ha solucionado nada.

Te pego aquí el código que tengo en el template.css en la línea 938 que corresponde al Header, para que veas como está ahora y por si vieras que se necesitara cambiar alguna otra cosilla.

/* HEADER
--------------------------------------------------------- */
#ja-headerwrap {
	background: url(../images/header-mask.png); /* no-repeat top right;*/
	//background: #333333; /* Línea descomentada sustituida por la de arriba  */
	color: #CCCCCC;
	line-height: normal;
	height: 120px;/* Cambiada altura inicial de 80px */
}

#ja-header {
	position: relative;
	height: 120px; /* Cambiada altura inicial de 80px, esto desplaza la caja de texto hacia la parte inferior */
}

.ja-headermask {
	width: 100%; /* Para cambiar anchura imagen logo central, ----px*/
	display: block;
	background: url(../images/header-mask.png) no-repeat top right;
	height: 120px; /* Para cambiar altura imagen logo central, ----px*/
	position: absolute;
	top: 0;
	right: -1px;
}

#ja-header a {
	color: #CCCCCC;
}

h1.logo, h1.logo-text {
	margin: 0 0 0 5px;
	padding: 0;
	font-size: 180%;
	text-transform: uppercase;
}

h1.logo a {
	width: 350px;
	display: block;
	background: url(../images/logo.png) no-repeat;
	height: 120px; /* Cambiada altura original de 80px */
	position: relative;
	z-index: 100;
}

h1.logo a span {
	position: absolute;
	top: -1000px;
}

h1.logo-text a {
	color: #CCCCCC !important;
	text-decoration: none;
	outline: none;
	position: absolute;
	bottom: 40px;
	left: 5px;
}

p.site-slogan {
	margin: 0;
	padding: 0;
	padding: 2px 5px;
	color: #FFFFFF;
	background: #444444;
	font-size: 92%;
	position: absolute;
	bottom: 20px;
	left: 0;
}

/* Search */
#ja-search {
	padding-left: 20px;
	background: url(../images/icon-search.gif) no-repeat center left;
	position: absolute;
	bottom: 15px;
	right: 0;
}

#ja-search .inputbox {
	width: 120px;
	border: 1px solid #333333;
	padding: 3px 5px;
	color: #999999;
	background: #ffffff; /* Cambiado color original #444444; */
	font-size: 92%;
}

Venga un saludo

ResponderCitar
Respondido : 15/06/2011 1:02 am
Jhon
 Jhon
Soporte CMS Webempresa Moderator

Hola Jorge

Modifica el background en .ja-headermask, borra que no se repita y la alineación y sólo deja la ruta

.ja-headermask {
	width: 100%; /* Para cambiar anchura imagen logo central, ----px*/
	display: block;
	background: url(../images/header-mask.png);
	height: 120px; /* Para cambiar altura imagen logo central, ----px*/
	position: absolute;
	top: 0;
	right: -1px;
}

Saludos

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar mi Testimonio
¡Gracias!.

ResponderCitar
Respondido : 15/06/2011 1:56 am

wpdoctor-revisa-la-salud-de-tu-wordpress

Jorge
 Jorge
Estimable Member

Buenas tardes Jhon,

Al final, he conseguido dejarlo bastante apañado, por lo menos eso creo.

He eliminado las tres imágenes que había dentro del directorio template/ja_purity/images/header y he dejado una sola dentro de template/ja_purity/images como me indicabas; aparte también he eliminado una etiqueta background para un fondo que había debajo de la imagen, con lo que ahora los dos trocitos pequeños que había en los extremos han desaparecido y ahora funciona todo como una sola imagen.
Creo que haberlo hecho todo bien puesto que parece que funciona correctamente, pero como en este tema soy muy novel siempre me queda esa duda.

Así ha quedado ahora.


/* HEADER
--------------------------------------------------------- */
#ja-headerwrap {
	width: 100%; /* Etiqueta de anchura añadida */
	background: url(../images/header-mask.png);
	color: #CCCCCC;
	line-height: normal;
	height: 120px;/* Cambiada altura inicial de 80px */
}

#ja-header {
	width: 100%; /* Etiqueta de anchura añadida */
	position: absolute; /* Etiqueta cambiada, valor anterior Relative */
	height: 120px; /* Cambiada altura inicial de 80px, esto desplaza la caja de texto hacia la parte inferior */
}

.ja-headermask {
	width: 100%; /* Para cambiar anchura imagen logo central, ----px*/
	display: block;
	background: url(../images/header-mask.png);
	height: 120px; /* Para cambiar altura imagen logo central, ----px*/
	position: absolute;
	top: 0;
	right: -1px;
}

#ja-header a {
	color: #CCCCCC;
} 

He hecho alguna modificación mas aparte de la de la anchura que me proponías, ya que la caja de texto del buscador así como las letras para modificar el tamaño ("zoom") de los textos de la página, se me desplazaban a media pantalla; le he cambiado el valor Relative por Absolute a la etiqueta Position en ja-header. Y en ja-usertools-font, he centrado un poco ambas cosillas.

 
/*usertool*/
ul.ja-usertools-font {
	font-size: 11px;
	position: absolute;
	top: 20px; /* Valor cambiado, anterior 8px */
	right: 10px; /* Valor cambiado, anterior 70px */
}

Ahora todo lo referente al Header se ve bastante bien tanto en FF, Crome como IE8, lo que no he conseguido es solucionar lo del Footer.

Sabrías indicarme por favor, dónde buscar para ver si soy capaz de corregir ese pequeño desplazamiento hacia arriba en IE8.

Te agradezco un montón toda la ayuda aportada.

Un saludo

ResponderCitar
Respondido : 15/06/2011 3:52 pm
Jhon
 Jhon
Soporte CMS Webempresa Moderator

Hola Jorge

Lo veo bien el footer en IE8 e IE7, tal como lo puedes ver en la siguiente imagen, y además no me sale ningún error.
Te sugiero lo pruebes desde otra máquina con IE.

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar mi Testimonio
¡Gracias!.

ResponderCitar
Respondido : 15/06/2011 4:58 pm

Cursos Gratuitos WordPress

Jorge
 Jorge
Estimable Member

Buenas tardes Jhon,

Ya puedes perdonar, se me había olvidado comentarte que el error del desplazamiento ocurre cuando se pulsa sobre un Leer mas.

En cuanto al error no me ha vuelto a salir, así que tendré que esperar a ver si vuelve a ocurrir.

Un saludo

ResponderCitar
Respondido : 15/06/2011 5:33 pm
Jhon
 Jhon
Soporte CMS Webempresa Moderator

Hola Jorge

Para el footer, en el archivo de estilos de tu template agrega un margen superior al siguiente estilo:

#ja-footer .copyright{
	/*otro código*/
	margin-top : 20px;
}

Pruébalo y nos comentas

Saludos.

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar mi Testimonio
¡Gracias!.

ResponderCitar
Respondido : 15/06/2011 5:49 pm

optimiza-automaticamente-todas-las-imagenes-de-tu-wordpress

Jorge
 Jorge
Estimable Member

Buenas tardes Jhon,

He retocado lo que me comentabas y al final todo el texto que hay en la zona del copyright se ha centrado un poquito mas, aunque si hubiera bajado a su vez la línea de la parte izquierda y los botones de validación del W3C y XHTML hubiera quedado perfecto, por mas que he alternado unos cuantos valores distintos no he sido capaz de centrarlo, pero bueno lo importante es que ahora ya no se montan los textos encima de las líneas y los que usan el IE lo verán algo mejor.
A ver si en futuras versiones estos de MS se aplican un poquito mas.

Bueno pues muchas gracias por todo nuevamente.

Un saludo

ResponderCitar
Respondido : 15/06/2011 7:46 pm
Luis Mendez Alejo
 Luis Mendez Alejo
Miembro Admin

Hola Jorge,

¿Podemos dar por solucionado entonces el entuerto con IE 8 ?

🙂

Saludos

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar Testimonio
¡Gracias!.

ResponderCitar
Respondido : 15/06/2011 7:59 pm

Gestor de Contraseñas - VPN Conexión Segura - Gestor 2FA (Segundo Factor de Autenticación

Jorge
 Jorge
Estimable Member

Hola Luis,

Ya lo siento, se me ha olvidado ponerlo en el anterior mensaje, si podéis darlo por solucionado.

Un saludo y muchas gracias

ResponderCitar
Respondido : 15/06/2011 8:15 pm

Por favor Iniciar Sesión o Registro