Question

在PyroCMS中，我使用session:messages标签向用户显示消息。这很好用，但我想为每条消息添加一个关闭按钮，这需要在每条消息中放置一个范围。例如：

<div class="alert success">
  You have logged in successfully. <span class="close">X</span>
</div>

每条消息都包含在div中，通过设置session:messages标记的属性为其提供类。没有内置方法来指定输出。如何覆盖session.php中的messages()函数，添加一个新属性来附加此关闭按钮？

到目前为止，我已经尝试过：

将 system / cms / plugins / session.php 复制到* addons / shared_addons / plugins / session.php *并修改messages()函数。使用核心功能，而不是我希望的新插件。
如上所述复制插件，然后将其类更改为My_Plugin_Session extends Plugin_Session，希望其功能将覆盖核心Plugin_Session类。没有运气。

Answer 1

无法扩展核心中的某些内容（e.g. libraries and helpers） - 我认为这也适用于插件。

在这种情况下，如果我是你（我可能必须为我的下一个项目执行此操作，因为这些可关闭的警报通常在Twitter Bootstrap等）。我只需编辑 / system /直接使用cms / plugins / session.php 并为成功，通知和错误条件（'if'语句）添加额外的<span>关闭按钮。

在一个典型的网站上，我无法想到你需要以不同方式显示某些警报的情况（除了不同的颜色，这取决于当然的结果，你可以在CSS中使用类名做）。

提供你正在使用Git（你已经克隆或分叉了official PyroCMS repository并建立了自己的分支）你将来会对未来的更新完全没问题 - 如果是将来的版本会话插件更改，任何更改将自动合并到您的代码中，或者如果Git无法弄清楚，它会向您显示差异并提示您手动修复它。

注意 - 基于管理界面，针对此特定问题还有其他几种解决方案（您可能已经注意到可以关闭的Flash消息）。

你可以创建一个部分 - 它可以包含PHP，而不仅仅是Lex标签 - 例如使用类似的内容查看 /system/cms/themes/pyrocms/views/admin/partials/notices.php （根据需要进行编辑，重复通知和错误）：

<?php if ($this->session->flashdata('success')): ?>
<div class="alert success">
    <?php echo $this->session->flashdata('success'); ?>
</div>
<?php endif; ?>

PyroCMS管理员实际使用liveQuery在浏览器中附加关闭按钮<span> 来源： /system/cms/modules/wysiwyg/js/wysiwyg.js ：

// Add the close link to all alert boxes
$('.alert').livequery(function(){
    $(this).prepend('<a href="#" class="close">x</a>');
});

Answer 2

我这样做了，它完美无需其他插件而不是jQuery。

在模板布局中添加以下内容：

{{ session:messages success="message success" notice="message info" error="message error" }}

JavaScript ：

$(function() {
    $('.message').prepend('<a class="baxclose" id="baxclose"></a>');
    $('#baxclose').click(function(){
        $('.message').fadeOut('slow');
    });
});

和CSS：

 a.baxclose{
    float:left;
    width:30px;
    height:30px;
    background:transparent url(../img/close-icon.png);
    margin-top: -30px;
    margin-left: -30px;
    cursor:pointer;
}
.message {
    padding: 20px 20px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    margin-bottom: 10px;
    -moz-box-shadow:inset 0 2px 3px rgba(255,255,255,0.5), 0 2px 3px rgba(0,0,0,0.1);
    -webkit-box-shadow:inset 0 2px 3px rgba(255,255,255,0.5), 0 2px 3px rgba(0,0,0,0.1);
    box-shadow:inset 0 2px 3px rgba(255,255,255,0.5), 0 2px 3px rgba(0,0,0,0.1);
    zoom: 1;
    margin-bottom: 20px;
}
    .message h3 {
        margin-top: 0;
        font-size: 12px;
        font-weight: bold;
    }
    .message p {
        margin-bottom: 0;
    }

.message.info {
    border: 1px solid #cadcea;
    background-color: #cdf;
    background-image: -o-linear-gradient(top,  #eef,  #cdf);
    background-image: -ms-linear-gradient(top,  #eef,  #cdf);
    background-image: -moz-linear-gradient(top,  #eef,  #cdf);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#eef), to(#cdf));
    background-image: -webkit-linear-gradient(top,  #eef,  #cdf);
    background-image: linear-gradient(top,  #eef,  #cdf);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#EEEEFF', endColorstr='#CCDDFF');
    color: #225b86;
    text-shadow: 0 1px 1px #fff;
}

.message.error {
    border: 1px solid #eeb7ba;
    background-color: #fae2e2;
    background-image: -o-linear-gradient(top,  #fae2e2,  #f2cacb);
    background-image: -ms-linear-gradient(top,  #fae2e2,  #f2cacb);
    background-image: -moz-linear-gradient(top,  #fae2e2,  #f2cacb);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#fae2e2), to(#f2cacb));
    background-image: -webkit-linear-gradient(top,  #fae2e2,  #f2cacb);
    background-image: linear-gradient(top,  #fae2e2,  #f2cacb);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fae2e2', endColorstr='#f2cacb');
    color: #be4741;
    text-shadow: 0 1px 1px #fff;
}

.message.success {
    border: 1px solid #b8c97b;
    background-color: #e5edc4;
    background-image: -o-linear-gradient(top,  #e5edc4,  #d9e4ac);
    background-image: -ms-linear-gradient(top,  #e5edc4,  #d9e4ac);
    background-image: -moz-linear-gradient(top,  #e5edc4,  #d9e4ac);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#e5edc4), to(#d9e4ac));
    background-image: -webkit-linear-gradient(top,  #e5edc4,  #d9e4ac);
    background-image: linear-gradient(top,  #e5edc4,  #d9e4ac);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5edc4', endColorstr='#d9e4ac');
    color: #3f7227;
    text-shadow: 0 1px 1px #fff;
}

Answer 3

而不是您用来删除的按钮，另一个选项是在点击事件上创建一个fadeOut消息。

HTML：

<div id="msgAlert"> …session:messages goes here...</div>

JS：

<script type="text/javascript">
$('html').click(function() { $('#msgAlert').delay(5000).fadeOut('slow'); });

点击后，会在5秒后淡出会话消息。

会话的自定义输出：消息？

3 个答案: