joomla - 在弹出窗口中显示 Joomla 系统消息

Question

我对 Joomla 不太有经验。这就是为什么我需要你的建议。这个想法是在弹出窗口中显示系统消息。

解决办法:

1.我删除了文件libraries\joomla\document\html\renderer\message.php中的下一行，因为我不需要这个div

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

2.在index.php中我替换了

<jdoc:include type=”message” />

与

<?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 用于弹出窗口本身，div#popup-mask 用于覆盖

3.我在 css 中设置了 #popup 和 #popup-mask 的样式

#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.并添加了一些 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();
        });
}
});

它有效，但正如我已经提到的，我对 Joomla 还很陌生。

所以，问题是:

- 这个解决方案可以吗？

-如何改进？

Answer 1

我建议您不要更改joomla的核心文件，除非由于某些原因确实需要这样做。对于您的情况，您可以尝试一下，它可能会对您有所帮助。

1. 如果需要，添加默认的 Joomla 系统消息代码如果这是您正在使用的现有模板，它可能已经在显示 Joomla 系统消息的地方有系统消息代码:

代码:

<jdoc:include type=”message” />

如果它尚不存在，您通常需要将其添加到此代码的正上方:

代码:

<jdoc:include type=”component” />

1. 加载Mootools，它将创建动画弹出模式消息在开始标记后面添加以下代码:

JHTML::(‘behavior.mootools’); JHTML::(‘behavior.modal’);

注意:如果您遇到 Mootools 冲突错误，则您的网站可能已经在加载 Mootools。尝试删除这部分代码。

1. 添加JavaScript代码以自动“弹出”系统消息”在 CLOSING 标签之前添加以下代码:

脚本:

<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>

根据您的需要，您可以更改 JAVASCRIPT 和 CSS。