by WebSurfer
2011年10月23日 19:03
BlogEngine.NET バージョン 2.0 に使用されている新しいページャーを、バージョン 1.6.1 のこのブログに移植しました。
上の画像では、比較のため、旧ページャー(上の <<前のブログ 次のブログ>> と表示されているもの)と新ページャー(下のページ番号が表示されているもの)を一緒に表示してあります。
具体的な移植方法は以下の通りです。
-
バージョン 2.0 のページャー(カスタムコントロール App_Code/Controls/PostPager.cs)をコピーしてきます。その際、W3C 検証にパスしない と APML フィルターの問題 は処置しておきましょう。また、バージョン 2.0 では名前空間が App_Code.Controls となっているので、バージョン 1.6.1 に合わせて Controls に変更しておきます。
-
User Control/PostList.ascx.cs にバージョン 2.0 のページャーを追加します。さらに、バージョン 1.6.1 のページャーを style="display: none" を追加して消去します。下のサンプルを参考にしてください。
-
User Control/PostList.ascx.cs の Posts プロパティに、ページャーに Post のコレクションへの参照を設定するためのコードを一行追加します。下のサンプルを参考にしてください。
-
最後に、css を移植します。バージョン 2.0 の Style/Global.css の最後の方にページャー関係のスタイル定義があるので、それをバージョン 1.6.1 の css ファイルにコピーします。バージョン 1.6.1 には Style/Global.css というファイルはないので、自分は、当該テーマの style.css にコピーしました。
User Control/PostList.ascx
<%@ Control Language="C#"
AutoEventWireup="true"
CodeFile="PostList.ascx.cs"
EnableViewState="false"
Inherits="User_controls_PostList" %>
<div runat="server" id="posts" class="posts" />
<div id="postPaging" style="display: none">
<a runat="server"
ID="hlPrev"
style="float:left">
<< <%=Resources.labels.previousPosts %>
</a>
<a runat="server"
ID="hlNext"
style="float:right">
<%=Resources.labels.nextPosts %> >>
</a>
</div>
<%--2011/10/23 BlogEngine.NET 2.0 のページャー
(App_Code/Controls/PostPager.cs) を移植。
旧ページャーは div id="postPaging" に
style="display: none" として消去。--%>
<div style="clear:both; display:block">
<blog:PostPager ID="pager1"
runat="server">
</blog:PostPager>
</div>
User Control/PostList.ascx.cs
// ・・・前略・・・
public partial class User_controls_PostList : UserControl
{
// ・・・中略・・・
private List<IPublishable> _Posts;
/// <summary>
/// The list of posts to display.
/// </summary>
public List<IPublishable> Posts
{
get
{
return _Posts;
}
set
{
_Posts = value;
// 2011/10/23 BlogEngine.NET 2.0 のページャー
// (App_Code/Controls/PostPager.cs) を移植した
// ので以下のコードを追加。
this.pager1.Posts = value;
}
// ・・・中略・・・
}