1

PyroCMSでは、session:messagesタグを使用してユーザーにメッセージを表示しています。これはうまく機能していますが、各メッセージ内にスパンを配置する必要がある各メッセージに閉じるボタンを追加したいと思います。例えば:

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

session:messages各メッセージはdivでラップされ、タグの属性を設定することでクラスが与えられます。出力を指定する組み込みの方法はありません。messages()この閉じるボタンを追加するための新しい属性を追加して、session.phpの関数をオーバーライドするにはどうすればよいですか?

これまでに試しました:

  1. system / cms / plugins/session.phpを*addons/ shared_addons / plugins / session.php *にコピーし、関数を変更しますmessages()。私が期待していた新しいプラグインではなく、コア関数が使用されます。

  2. 上記のようにプラグインをコピーし、My_Plugin_Session extends Plugin_Sessionその関数がコアPlugin_Sessionクラスをオーバーライドすることを期待して、そのクラスをに変更します。運がない。

4

3 に答える 3

3

コアにある特定のもの(ライブラリやヘルパーなど)を拡張することはできません-これはプラグインにも当てはまると思います。

この場合、私があなただった場合(これらの閉鎖可能なアラートは通常、Twitter Bootstrapなどにあるため、次のプロジェクトでこれを行う必要があるかもしれません)/system/cms/plugins/session.phpを直接編集して<span>成功、通知、およびエラーの条件('if'ステートメント)に閉じるボタンの追加を追加します。

典型的なサイトでは、アラートを他のアラートとは異なる方法で表示する必要がある状況は考えられません(もちろん、CSSでクラス名を使用して実行できる結果に応じて異なる色を使用する場合を除きます)。

Gitを使用している場合(公式のPyroCMSリポジトリを複製またはフォークし、独自のブランチを作成した場合)、将来の更新で完全に問題ありません-将来のバージョンでセッションプラグインが変更された場合、変更はすべてにマージされますコードを自動的に、またはGitがそれを理解できない場合は、違いが表示され、手動で修正するように求められます。

注-管理インターフェースに基づいて、この特定の問題には他にもいくつかの解決策があります(フラッシュメッセージが閉じられることに気付いたかもしれません)。

Lexタグだけでなく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>');
}); 
于 2012-08-15T21:23:41.857 に答える
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;
}
于 2012-08-26T21:58:02.713 に答える
0

削除に使用するボタンの代わりに、クリックイベント時にfadeOutメッセージを作成する別のオプションがあります。

HTML:

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

JS:

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

クリックすると、5秒後にセッションメッセージがフェードアウトします。

于 2014-08-25T14:59:59.937 に答える