Mostrar mensajes del sistema Joomla en ventana emergente

popup joomla2.5

Question

No tengo mucha experiencia con Joomla. Es por eso que necesito tu consejo. La idea es mostrar los mensajes del sistema en ventanas emergentes.

La solución:

1. Eliminé las siguientes líneas en las bibliotecas de archivos / joomla / document / html / renderer / message.php, porque no necesito este div

$buffer .= "/n<div id=/"system-message-container/">";
$buffer .= "/n</div>";

2. En index.php reemplacé

<jdoc:include type=”message” />

con

<?php if ($this->getBuffer(''message'')) : ?>
<?php
$message = $this->getBuffer(''message'');
$script = ''<div id="popup"><div id="popup-inner">''.$message.''</div></div><div id="popup-mask"></div>'';
echo $script;
?>
<?php endif; ?>

div # popup se usa para la ventana emergente y div # popup-mask para overlay

3. Diseñé #popup y # popup-mask en css

#popup-mask {position: absolute; top: 0; left: 0; z-index: 9997; background: url(../images/bg-overlay.png);}
#popup {position: fixed; width: 400px; top: 40%; left: 50%; margin-left: -200px; z-index: 9999; background: #e6e6e6; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px;}

4. Y agregó algo de jQuery

jQuery.fn.showMask = function () {
var maskHeight = jQuery(document).height();
var maskWidth = jQuery(window).width();
jQuery(this).css({''width'':maskWidth,''height'':maskHeight});
};
jQuery(document).ready(function() {
if (jQuery(''#popup-mask'').length){
jQuery(''#popup-mask'').showMask();
jQuery(''#popup-mask'').click(function () {
jQuery(this).hide();
jQuery(''#popup'').hide();
});
jQuery(window).resize (function() {
jQuery(''#popup-mask'').showMask();
});
}
});

Funciona, pero como ya he mencionado, soy bastante nuevo en Joomla.

Entonces, la pregunta es:

- ¿esta solución está bien?

- ¿Cómo puede ser mejorado?

Answer 1

Me gustaría sugerirle que no cambie los archivos core de joomla a menos que realmente deba hacerlo por alguna razón. Para su situación, puede intentarlo, ya que puede serle de ayuda.

1. Agregue el código de mensaje del sistema Joomla predeterminado, si es necesario. Si esta es una plantilla existente que está usando, probablemente ya tenga el código de mensaje del sistema en algún lugar donde se mostrarán los mensajes del sistema de Joomla:

Código:

<jdoc:include type=”message” />

Si aún no está allí, generalmente quiere agregarlo justo encima de este código:

Código:

<jdoc:include type=”component” />

1. Cargue Mootools que creará el mensaje modal emergente animado. Justo después de la etiqueta de apertura, agregue este código:

JHTML :: (''behavior.mootools''); JHTML :: (''behavior.modal'');

NOTA: Si obtiene un error de conflicto de Mootools, su sitio probablemente ya está cargando Mootools. Intente eliminar esta sección de código.

1. Agregue el código JavaScript para "abrir" automáticamente el mensaje del sistema "Justo antes de la etiqueta CLOSING agregue este código:

Guión:

<script type=”text/javascript”>
window.addEvent(‘domready’, function(){
if( $(‘system-message’) ){
SqueezeBox.initialize();
SqueezeBox.open( $(‘system-message’), {
handler: ‘adopt’,
shadow: true,
overlayOpacity: 0.5,
size: {x: 600, y: 100},
onOpen: function(){
$(‘system-message’).setStyle(‘visibility’, ‘visible’);
}
});
}
});
</script>

Según su necesidad, puede cambiar su JAVASCRIPT y CSS .

Answer 2

No recomendaría un truco a menos que realmente lo necesites. En este caso, no creo que sea necesario. En cambio, esto debería funcionar para usted:

Envuelva los mensajes de su sistema en un DIV (en su plantilla index.php) como este:

<div d="systmsg" onclick="javascript:this.style.display=''none'';"><jdoc:include type="message" /></div>

Y luego algo de css:

#systmsg {
position:absolute;
text-align:center;
width:100%;
top:300px (what you want)
}
#system-message {
display:block;
width:(what you want);
max-height:(what you want);
margin-left:auto;
margin-right:auto;
z-index: 100;
}

El enlace a este ejemplo se puede encontrar aquí .