因為工作關係，常需要寫測試軟體，偶爾會看到訪間的 Log 畫面是彩色的，也想動手將測試結果輸出彩色的

一般我都會用 ListBox 作為顯示畫面，因為 ListBox 以行為單位，很適合我的使用，但也很不幸的 .Net 並沒有辦法將 ListBox 每行用不同的顏色，不過其實還是可以讓他用 "畫" 的完成這項作業

首先先把 DrawMode 設定為 OwnerDrawVariable ，再加入 listBox1.DrawItem += new System.Windows.Forms.DrawItemEventHandler(this.listBox1_DrawItem) ，這時您就可以自己創作 ListBox 的顯示方式了

此時便可以用 e.Graphics.DrawString 畫出所要的有顏色字串

e.Graphics.DrawString((sender as ListBox).Items[e.Index].ToString(), e.Font, myBrush, e.Bounds.X, e.Bounds.Y);

Item 內有 pass fail 時要改變不同顏色，判斷後修改 myBrush 的顏色即可

if (e.Index >= 0 && (sender as ListBox).Items[e.Index].ToString().IndexOf("fail", StringComparison.CurrentCultureIgnoreCase) >= 0)
					myBrush = Brushes.Red;
				else if (e.Index >= 0 && (sender as ListBox).Items[e.Index].ToString().IndexOf("pass", StringComparison.CurrentCultureIgnoreCase) >= 0)
					myBrush = Brushes.DarkGreen;
				else
					myBrush = Brushes.Black;

選取時反白當然也要考慮進去，改用 SolidBrush

myBrush = new SolidBrush(e.ForeColor);

完整的程式碼如下

public Form1()
		{
			InitializeComponent();
			this.listBox1.DrawMode = System.Windows.Forms.DrawMode.OwnerDrawVariable;
			this.listBox1.DrawItem += new System.Windows.Forms.DrawItemEventHandler(this.listBox1_DrawItem);
		}

		private void button1_Click(object sender, EventArgs e)
		{
			listBox1.Items.Clear();
			listBox1.Items.Add("This is test!!");
			listBox1.Items.Add("Test pass!!");
			listBox1.Items.Add("Test fail!!");
		}

		private void listBox1_DrawItem(object sender, DrawItemEventArgs e)
		{
			e.DrawBackground();

			System.Drawing.Brush myBrush;
			if ((e.State & DrawItemState.Selected) != DrawItemState.Selected )
			{
				// unselected
				if (e.Index >= 0 && (sender as ListBox).Items[e.Index].ToString().IndexOf("fail", StringComparison.CurrentCultureIgnoreCase) >= 0)
					myBrush = Brushes.Red;
				else if (e.Index >= 0 && (sender as ListBox).Items[e.Index].ToString().IndexOf("pass", StringComparison.CurrentCultureIgnoreCase) >= 0)
					myBrush = Brushes.DarkGreen;
				else
					myBrush = Brushes.Black; 
			}
			else
			{
				myBrush = new SolidBrush(e.ForeColor);
			}

			if (e.Index >= 0)
				e.Graphics.DrawString((sender as ListBox).Items[e.Index].ToString(), e.Font, myBrush, e.Bounds.X, e.Bounds.Y);

			e.DrawFocusRectangle();
		}

成果：

後註：缺點是改用繪圖後，顯示的效能會下降很多，建議如需快速大量顯示資料，可以考慮完成後再切回繪圖模式，或是僅顯示少量

現在一位網站管理員，除了要管理真人的內容外，對付廣告機器人也是一件頭痛的問題，各大網站相繼淪陷於廣告機器人之後，就有網站陸續加入認證圖案，這時就造就了 CAPTCHA ( 詳細解釋請見 Wiki )

不論你網站規模大小，有沒有流量等等，總是會有一些廣告機器人滲透，CommunityServer 只要開了匿名留言，自然也會成為攻擊對象，於 .Net 2.0 中，要寫一個 CAPTCHA 並不困難，相對的網路上的免費資源也不少，這次就介紹 Subkismet ，Captcha 只是 Subkismet 專案的一部分，做出來的 Captcha 會是由點狀顯示文字 (如下圖)，對於一般(亞洲)人辨識並不至於太困難，例如 reCaptcha 這個對於亞洲人來說就太過困難

Subkismet 主要分為兩部分，HttpHandler 與 CaptchaControl ， HttpHandler 是負責產生圖形， CaptchaControl 負責編碼與驗證，在使用前請先完成設定作業

1. Web.config 加入 <add verb="*" path="*CaptchaImage.ashx" type="Subkismet.Captcha.CaptchaImageHandler, Subkismet"/>

2. 在使用的頁面開頭註冊元件 <%@ Register Assembly="Subkismet" Namespace="Subkismet.Captcha" TagPrefix="sbk" %>

完成要使用 CaptchaControl 其實很簡單，因為他是繼承 System.Web.UI.WebControls.BaseValidator ，設定好後直接放入以下程式碼到輸出表單中

<sbk:CaptchaControl id="captcha" runat="server" ErrorMessage="Oops! You must be bad at reading." Display="dynamic" CaptchaLength="4" ValidationGroup="Visible" />

CommunityServer Blog 使用方法範例 ( 以 default2 為例 )：

1. 開啟 \Themes\Blogs\default2\post.aspx

2. 於頁面最上方註冊 Subkismet.Captcha 元件 <%@ Register Assembly="Subkismet" Namespace="Subkismet.Captcha" TagPrefix="sbk" %>

3. 在留言的下方加入 Subkimet Captcha

<dt><CSControl:FormLabel LabelForId="tbComment" runat="server" ResourceName="Weblog_CommentForm_Comments" /> <em>(<CSControl:ResourceControl runat="server" ResourceName="Required" />)</em><asp:RequiredFieldValidator runat="server" ErrorMessage="*" ControlToValidate="tbComment" ValidationGroup="CreateCommentForm" /></dt>
                        <dd><asp:TextBox id="tbComment" runat="server" Rows="5" Columns="25" TextMode="MultiLine" ValidationGroup="CreateCommentForm" /></dd>
                        
                        <dt>Captcha</dt>
                        <dd><sbk:CaptchaControl id="captcha" runat="server" ErrorMessage="輸入錯誤."  LayoutStyle="CssBased" Display="dynamic" CaptchaLength="4" ValidationGroup="CreateCommentForm" /></dd>

                        <dt id="RememberWrapper" runat="server"><asp:CheckBox id="chkRemember" runat="server" Text="Remember Me?" ValidationGroup="CreateCommentForm" /></dt>

成果：

後注：

1.ASP.Net 皆可適用此元件，和 CMS 是不是 CommunityServer 並沒有關聯

2.這種點文字 Captcha 已經有國外 de-Captcha 100% 讀取破解，可能還是會有機器人可以順利解讀，如果覺得功能不夠強大可以自行修改原始碼改善

在上一篇，講解了如何在 tinymce 上使用 lightbox ，但只有 blog 才能使用 tinymce 顯示 lightbox ，在多媒體 ( media ) 便派不上用場

如果要在多媒體使用 lightbox ，只有從 Theme ( aspx 檔案 ) 下手，CommunityServer 上，主要是靠 CSMedia:MediaGalleryPostData 物件顯示與建立聯結，但很不幸的，建立聯結這個屬性 LinkTo="View" 此類，並無法擴充讓他支援 lightbox ，如果要支援，唯有修改 SDK 或是自己建立一個新的 Control ，這裡便從講解 SDK 開始

當有 SDK 環境後，開啟CS2008.5_SP2_4.1.40407.4157.sdk\Source\CommunityServer.MediaGalleries\Controls\MediaGalleryPost\MediaGalleryPostData.cs 檔案，在 104 行左右便可見到此程式碼

case MediaGalleryPostLinkTo.View:
                            link = new HyperLink();

                            if (mediaGallery.Hub == null)
                                link.NavigateUrl = MediaGalleryUrls.Instance().ViewMediaGalleryPost(mediaGallery.ApplicationKey, post.PostID);
                            else
                                link.NavigateUrl = MediaGalleryUrls.Instance().HubMediaGalleryPost(mediaGallery.Hub.ApplicationKey, post.PostID);

                            break;

我並不建議直接修改原本的 LinkTo ，建議加一個 lightbox ，在 HyperLink 要加入 Rel 與 Title 屬性很簡單

link.Attributes.Add("rel", "lightbox");

再加入考慮是否為圖片再使用 lightbox ，整個 LinkTo 程式就如下列

case MediaGalleryPostLinkTo.LightBox:
							link = new HyperLink();

							if (post.Attachment.IsImage)
							{
								link.Attributes.Add("rel", "lightbox");
								link.Attributes.Add("title", post.Subject);
								link.NavigateUrl = post.Attachment.Url;
							}
							else
							{
								if (mediaGallery.Hub == null)
									link.NavigateUrl = MediaGalleryUrls.Instance().ViewMediaGalleryPost(mediaGallery.ApplicationKey, post.PostID);
								else
									link.NavigateUrl = MediaGalleryUrls.Instance().HubMediaGalleryPost(mediaGallery.Hub.ApplicationKey, post.PostID);
							}

							break;

當完成後，重新編譯即可使用 LinkTo="lightbox" 來顯示多媒體 lightbox ，以下就是顯示的範例

<CSMedia:MediaGalleryPostList runat="server" ID="MediaInformation" ShowHeaderFooterOnNone="true">
                                        <QueryOverrides PageSize="5" SortBy="PostDate" SortOrder="Descending" IncludeCategories="false"
                                            PageIndex="0" IsAggregate="false" IsCommunityAggregatedOnly="false" />
                                        <HeaderTemplate>
                                            <ul class="CommonContentBoxList">
                                        </HeaderTemplate>
                                        <ItemTemplate>
                                            <CSMedia:MediaGalleryPostData ID="MediaGalleryPostData1" runat="server" Property="Subject"
                                                TruncateAt="50" LinkTo="LightBox" Tag="LI">
												<contenttemplate>
													<CSMedia:MediaGalleryPostViewer ID="MediaGalleryPostViewer1" runat="server" Width="1" Height="1" ViewType="Preview" />
												</contenttemplate>
                                            </CSMedia:MediaGalleryPostData>
                                        </ItemTemplate>
                                        <NoneTemplate>
                                            <li>
                                                <CSControl:ResourceControl runat="server" ResourceName="Home_NoFilesUploaded" />
                                            </li>
                                        </NoneTemplate>
                                        <FooterTemplate>
                                            </ul></FooterTemplate>
                                    </CSMedia:MediaGalleryPostList>

效果就會如本站首頁的顯示方式，按下圖片後啟用 lightbox 顯示圖片

在一般 Tinymce 上，預設並不允許使用 rel 屬性，使用前請先在 extended_valid_elements 加入 a[name|href|target|title|onclick|rel] ，在 CommunityServer 環境下，上面步驟不需要，Telligent 已經將預設值寫好了

但在一般環境下，您插入聯結後就會發現 tinymce 並沒有地方讓您輸入 rel="lightbox" ，這時候有兩種解決方法

方法1: 直接編輯 HTML

按下 tinymce 的 HTML 按鈕，自己 DIY 加進去，這方法如果文章很長，就會很辛苦去找那些圖片連結跑哪去了

方法2: 安裝 advlink plugins

advlink plugins 預設並沒有安裝在 CommunityServer 上，首先先到 TinyMCE 官網下載最新版，解開後到 plugins 目錄即可取得 advlink

再來就是把 plugins 啟動，在 CommunityServer 上即用 notepad 開啟 CommunityServer.config ，在 editorOption name="plugins" 加入 advlink ，其他環境下可以看官網的安裝步驟

完成後插入或編輯聯結，就會變成 advlink ，這時就有 rel = lightbox 可以選擇，經常使用 lightbox 用戶建議安裝此 plugins

今天 BlogEngine.NET 1.6 已經正式推出了，在這版，主要是針對 SPAM 回應做出一些改進，並且可以使用多重 Widget zone，Page Slug 也可以存在資料庫中

詳細的更新，請見官方網站 http://dotnetblogengine.net/page/BlogEngineNET-16-Release-Notes.aspx

※更新時，請務必參照更新步驟砍掉 ExtensionManager 目錄並修改 CSS