[編輯器] CKeditor 更換 background-color and font-size

logo 相信大家在製作 Web 過程,一定會用到編輯器,然而 CKeditor 前身 FCKeditor 非常有名,FCKeditor 運行了六年之久,在去年2009年的時候,轉換成了 CKeditor,目前開發團隊也專注於此版本,現在已經推出到 CKEditor 3.2 released!,可以參考 CKEditor 3.x – Developer’s Guide,裡面也整合了 jQuery,替很多開發者想到更多管道去整合網站,然而今天設計網站,需要改變編輯器的背景顏色,預設是白色背景,但是並非所有網站都是白色呈現,所以才需要動到背景顏色,這樣好讓使用者可以融入整個背景,在 Plurk 發表了這問題,也找了官方論壇,都沒有發現正確解答,官方論壇有篇類似問題:Change the background color of the CKEditor text area,這篇自己試過是沒有用的,正確解法可以參考 CKeditor 的 API:contentsCss。 1. 首先在 CKeditor 根目錄建立新檔案:mysitestyles.css
body
{
  /* Font */
  font-family: Arial, Verdana, sans-serif;
  font-size: 12px;

  /* Text color */
  color: #f0f0f0;

  /* Remove the background color to make it transparent */
  background-color: #353c42;
}

html
{
  /* #3658: [IE6] Editor document has horizontal scrollbar on long lines
  To prevent this misbehavior, we show the scrollbar always */
  _overflow-y: scroll
}

img:-moz-broken
{
  -moz-force-broken-image-icon : 1;
  width : 24px;
  height : 24px;
}
img, input, textarea
{
  cursor: default;
}
2. 設定 config.js 檔案(Ckeditor 目錄裡面)
CKEDITOR.editorConfig = function( config )
{
	// Define changes to default configuration here. For example:
	// config.language = 'fr';
	config.uiColor = '#AADC6E';
	config.contentsCss = '/path/ckeditor/mysitestyles.css';
};
重點在於 config.contentsCss = ‘/path/ckeditor/mysitestyles.css’; 這行,在 Path 部份,請注意由根目錄開始寫起喔。 另外解法,就是用 jQuery Adapter,header 加入:

使用 Ckeditor 方式如下: html:
javascript
$('#test').ckeditor({ contentCss: '/path/ckeditor/mysitestyles.css' });
就提供這兩種解法給大家參考。

Apache 取得透過 Reverse Proxy (Varnish) 的 Client 真正 IP (mod_rpaf)

feather 之前介紹 [FreeBSD]high performance caching reverse proxy: Varnish (安裝架設篇) 來當 Web 前端 Reverse Proxy,也有 load balance 的功能,不過碰到這樣的環境,後端 Apache Server 只會抓到 Reverse Proxy IP 來當作 log 紀錄,而無法正確取得 Client 端 IP,Varnish 官網 FAQ 有提到 log 檔案得的解決方法,不過在程式方面,要大量的修改,假設今天 Apache 跑10個 Virtual Host ,不就要去改10個網站程式,背後或許是一些大型 open source 的 Project,改起來相當不容易,也很費工夫。Darkhero 提供了 reverse proxy add forward module for Apache (mod_rpaf) 模組,只要裝上這模組,Apache 就不必動到其它設定就可以正確紀錄 log 檔案,且程式都不必修改,就可以得到正確 IP 了。 FreeBSD Ports 安裝方式:
cd /usr/ports/www/mod_rpaf2/
make install clean
修改 httpd.conf (FreeBSD: /usr/local/etc/apache22/httpd.conf)
LoadModule rpaf_module        libexec/apache22/mod_rpaf.so
將上面 unmask,最後面加上:
RPAFenable On
RPAFsethostname On
RPAFproxy_ips xxx.xxx.xxx.xxx 127.0.0.1
RPAFheader X-Forwarded-For

在 IE8 FireFox Chrome CSS 置中解決方法

在 IE8 還沒出來之前,都是利用 margin: 0 auto; 的方式來解決 div 置中的問題,但是這在 IE8 並沒有發揮作用,無效了,底下在網路上發現兩種解法,分享給大家知道: 1. Width:100% 在最外層 div 加入 Width:100% 的屬性,程式碼如下:
#container {width:100%;}
#centered {width:400px; margin:0 auto;}
2. Text-Align:Center 在 div tag 裡面加入 Text-Align:Center,這樣 IE8 會偵測到此語法,就會服從 margin:0 auto; 之屬性,不過這樣內容會被全部至中,如果您有需要將其 div 內容往左邊對齊,那就必須在加上語法 Text-Align:left,底下是範例程式碼:
#container {text-align:center;}
#centered {width:400px; margin:0 auto;text-align:left;}
IE6,IE7 則是利用下面語法:
#wrap {
  margin: 0px auto; /* firefox */
  *margin: 0px auto; /* ie7 */
  _margin: 0px auto; /* ie6 */
  height:100px; 
  width:860px;
  border:5px solid red;    
}
reference: Centering a Div in IE8 Using margin:auto 【CSS 語法教學】區塊置中的三種寫法

[FreeBSD]high performance caching reverse proxy: Varnish (安裝架設篇)

varnish-logo-red-64 在上禮拜跟 DarkHero 兄聊到 How To Build a Scalable Web Site (3/6) 的上課講義,互相討論了 MySQL Load balance 以及 http reverse proxy 的方式,以前自己有用 HAProxy 當作 Web 平衡負載,順便紀錄了 HAProxy FreeBSD 安裝方式,這次要來介紹今天重點:Varnish Cache Server,在近幾年流行的 Caching 機制,大家會想到 Squid,只要您設定良好的 Squid 參數,它一定運作的非常穩定,然而它的核心依然是 forward proxy,要架設成 Reverse Proxy 還必需要設定一些參數才可以達到,是有一定的困難性,然而 Varnish Cache Server 底層就是高效能 caching reverse proxy,也因為 Squid 是 1980 年發展出來的,程式架構過於老舊,可以參考 ArchitectNotes 瞭解這部份詳情。也許您會問到 Varnish 可以架設成 forward proxy 嗎?答案是可以的,但是您也許不會這麼做,因為它需要 DNS 技術,以及需要一個非常大且複雜的 Varnish VCL(Varnish Configuration Language) file。 1. 今天要介紹如何在 FreeBSD 系統安裝,在介紹之前,系統必須先安裝好 apache,這樣才可以正確啟動,利用 ports 安裝:
cd /usr/ports/www/varnish/
make install clean
2. 修改 /etc/rc.conf
# varnishd
varnishd_enable="YES"
varnishd_listen=":80"
varnishd_admin=":81"
varnishd_backend=":5566"
varnishd_config="/usr/local/etc/varnish/default.vcl"
上面設定意思是說 Varnish listen on port 80,傳送 traffic 到後端 5566 port,管理連接埠是 81,也可以使用指令方式:
varnishd -a :80 -b localhost:8080 -T localhost:6082
Varnishd listen on port 80,and forwarding traffic to a web server listen on localhost port 8080. It also turns on the management interface on port 6082.
3. 修改 default.vcl (Varnish Configuration Language) VCL 檔案告訴 Varnishd 正確的處理每個 request processing,包含在接受到 request 之前所處理的行為 vcl_recv(),另外還有 vcl_hit()、vcl_miss() 等…,都是用來處理 cache 如果存在或者是不存在時的情境 request。FreeBSD 預設放在 /usr/local/etc/varnish/default.vcl。打開此檔案,您會看到:
backend default {
   .host = "127.0.0.1";
   .port = "80";
}
您只要把 host = “127.0.0.1” 改成你後端要連接的 ip 或者是 host,這樣 Varnish 會 forward traffic 到您的 web server。接下來只要啟動 apache 跟 Varnish 就算是初步架設完成。
/usr/local/etc/rc.d/apache22 restart
/usr/local/etc/rc.d/varnishd restart
Varnish_01 大家可以看到 61.*.*.* 連到本機 80 port,接下來 Varnish 在開啟隨機 57475 port 連接到 Web Server 5566 port。 Q:如何讓 apache 紀錄正確的 Client IP 到 log 檔案呢? 1. 打開 Vcl config 檔案,寫入 Varnish configuration:
sub vcl_recv {
  # Add a unique header containing the client address
  remove req.http.X-Forwarded-For;
  set    req.http.X-Forwarded-For = client.ip;
  # [...]
}
2. 開啟 apache httpd.conf 加入此行:
LogFormat "%{X-Forwarded-For}i %l %u %t \"%r\" %>s %b \"%{Referer}i\" \"%{User-Agent}i\"" varnishcombined
Varnish_02 Q:如何讓 PHP 程式紀錄正確的 Client IP? 可以參考底下程式碼就可以完全抓到 Proxy 後面真正使用者IP,否則您的 Web 只會抓到 Reverse Proxy 的 IP Address。
function getIP() {
  if (validip($_SERVER["HTTP_CLIENT_IP"])) {
    return $_SERVER["HTTP_CLIENT_IP"];
  }
  foreach(explode(",",$_SERVER["HTTP_X_FORWARDED_FOR"]) as $ip) {
    if (validip(trim($ip))) {return $ip;}
  }
  if (validip($_SERVER["HTTP_X_FORWARDED"])) 
  {
    return $_SERVER["HTTP_X_FORWARDED"];
  }
  else if (validip($_SERVER["HTTP_FORWARDED_FOR"])) 
  {
    return $_SERVER["HTTP_FORWARDED_FOR"];
  } 
  else if (validip($_SERVER["HTTP_FORWARDED"])) 
  {
    return $_SERVER["HTTP_FORWARDED"];
  } 
  else if (validip($_SERVER["HTTP_X_FORWARDED"])) 
  {
    return $_SERVER["HTTP_X_FORWARDED"];
  } 
  else 
  {
    return $_SERVER["REMOTE_ADDR"];
  }
}

function validip($ip) {
  if (!empty($ip) && ip2long($ip)!=-1) {
    $reserved_ips = array (
      array('10.0.0.0','10.255.255.255'),
      array('127.0.0.0','127.255.255.255'),
      array('169.254.0.0','169.254.255.255'),
      array('172.16.0.0','172.31.255.255'),
      array('192.168.0.0','192.168.255.255'),
    );
    foreach ($reserved_ips as $r) {
      $min = ip2long($r[0]);
      $max = ip2long($r[1]);
      if ((ip2long($ip) >= $min) && (ip2long($ip) <= $max)) return false;
    }
    return true;
  } 
  else 
  {
    return false;
  }
}[/code]
Q:rotate Varnish log file every day?
打開 /etc/newsyslog.conf,加入底下兩行
/var/log/varnish.log        640     7   *   @T00    JB  /var/run/varnishlog.pid
/var/log/varnishncsa.log    640     7   *   @T00    JB  /var/run/varnishncsa.pid
每天12點進行 log 備份,使用 gzip 壓縮 log 檔案。

[Vim] 想套用 *.php syntax 顏色於 *.ros

vim_header Vim 是一套強大的編輯器,它分佈於各大 UNIX systems,安裝好一套 UNIX 系統,預設就是 Vi 編輯器(FreeBSD 預設是 ee),相當好用,他也支援各種語言的 syntax,讓您在編輯檔案能夠看到各種不同顏色,在 FreeBSD 底下可以去看 /usr/local/share/vim/vim64/syntax/ 該資料夾支援各種語言,例如 PHP、Ruby、css、html、java、C/C++…等,假設今天我們想要 .ros 的副檔名需要用 php.vim syntax 來開啟,就必須做底下設定: 執行底下:
mkdri ~/.vim
vi ~/.vim/filetype.vim 
寫入 filetype.vim 資訊 if version < 600 syntax clear elseif exists("b:current_syntax") finish endif augroup filetypedetect au! BufRead,BufNewFile *.ros setfiletype php augroup END[/code] ps. on freebsd 7.1-RELEASE-p11 vim version 6.4.9 reference: Vim 套用 Markdown syntax vi 設定

[FreeBSD] DenyHosts 設定在 hosts.allow 注意事項

denyhosts DenyHosts 是一套用 Python 跟 shell script 寫出來的 open source base on Linux or FreeBSD (/var/log/secure on Redhat, /var/log/auth.log on Mandrake, FreeBSD, etc…),用來阻擋 SSH Server 被攻擊,之前寫一篇 FreeBSD 安裝設定教學,有一點沒有注意到,就是打開 /etc/hosts.allow,注意要把 ALL : ALL : allow 放到最後一行,跟 iptables 設定原理是一樣的,會從第一條規則開始比對,如果比對成功,下面的 rule 就會略過比對了,參考英文說明:
Start by allowing everything (this prevents the rest of the file from working, so remove it when you need protection). The rules here work on a “First match wins” basis.
/etc/hosts.deny 已經被 FreeBSD 棄用,所以必須把 allow 跟 deny 的 rule 都寫到 hosts.allow 檔案裡面才是正確的
#
# DenyHosts file: /etc/hosts.deniedssh
sshd : /etc/hosts.deniedssh : deny
sshd : ALL : allow

# Start by allowing everything (this prevents the rest of the file
# from working, so remove it when you need protection).
# The rules here work on a "First match wins" basis.
# move bottom by appleboy 2010.03.11
ALL : ALL : allow