讓 phpBB3 使用 FCKeditor 編輯器

Posted by htwang on 下午4:43

套件名稱 / 本篇文章實作版本

系統環境: Fedora 12

Step 1. 安置相關檔案

#phpBB 程式主體
cd /var/www/html/
tar jxf /path/to/phpBB-3.0.7-PL1.tar.bz2
cd phpBB3
chmod 666 config.php
#正體中文語言包
tar zxf /path/to/lang_zh_cmn_hant.tar.gz -C language/
tar zxf /path/to/prosilver_zh_cmn_hant.tar.gz -C styles/
tar zxf /path/to/subsilver2_zh_cmn_hant.tar.gz -C styles/
#FCKeditor
tar zxf /path/to/FCKeditor_2.6.6.tar.gz
find ./fckeditor -type d -exec chmod 755 {} \;
find ./fckeditor -type f -exec chmod 644 {} \;
#Enable HTML
unzip /path/to/Enable\ HTML\ 1.2.3.zip
cp -r Enable\ HTML/root/* ./
rm -rf Enable\ HTML
unzip /path/to/UMIL_1.0.2.zip
cp -r UMIL\ 1.0.2/root/umil ./
rm -rf UMIL\ 1.0.2
cp language/en/mods/enable_html.php language/zh_cmn_hant/mods/

Step 2. 建立資料庫

echo "create database phpBB3; \
grant all privileges on phpBB3.* to root@localhost; \
flush privileges;" | mysql -u root -proot's_password #-p 與密碼之間不能有空格

Step 3. 瀏覽器連入 http://your.host/phpBB3/ 完成安裝程序, 然後:

rm -rf install
chmod 644 config.php

Step 4. 設定 FCKeditor

vi fckeditor/fckeditor.js

#調整編輯器高度 (預設: 200)
This.Height = height || '400';
vi fckeditor/fckconfig.js

#調整可使用的按鈕
#找到:
FCKConfig.ToolbarSets["Default"] = [
['Source','DocProps',...
#整列刪除 ['Source','DocProps',... 以及 ['Form','Checkbox',...
#若有其他不想讓 user 使用的按鈕亦可一並刪除
#取消 "Browse Server" 功能
FCKConfig.LinkBrowser = false;
FCKConfig.ImageBrowser = false;
FCKConfig.FlashBrowser = false;
vi fckeditor/editor/filemanager/connectors/php/config.php

#允許上傳檔案
$Config['Enabled'] = true ;
$Config['UserFilesPath'] = '/phpBB3/files/' ;

Step 5. 讓 prosilver 風格使用 FCKeditor

vi styles/prosilver/template/posting_editor.html
#刪除底下這行:

<!-- INCLUDE posting_buttons.html -->

#找到

<div id="message-box">
<textarea <!-- IF S_UCP_ACTION and not S_PRIVMSGS and not S_EDIT_DRAFT -->name="signature" id="signature" style="height: 9em;"<!-- ELSE -->name="message" id="message"<!-- ENDIF --> rows="15" cols="76" tabindex="4" onselect="storeCaret(this);" onclick="storeCaret(this);" onkeyup="storeCaret(this);" onfocus="initInsertions();" class="inputbox">{MESSAGE}{DRAFT_MESSAGE}{SIGNATURE}</textarea>
</div>

#改成

<div id="message-box">

<!-- Start FCKeditor -->
<script type="text/javascript" src="/phpBB3/fckeditor/fckeditor.js"></script>
<!-- End FCKeditor -->

<textarea <!-- IF S_UCP_ACTION and not S_PRIVMSGS and not S_EDIT_DRAFT -->name="signature" id="signature" style="height: 9em;"<!-- ELSE -->name="message" id="message"<!-- ENDIF --> rows="15" cols="76" tabindex="4" onselect="storeCaret(this);" onclick="storeCaret(this);" onkeyup="storeCaret(this);" onfocus="initInsertions();" class="inputbox">{MESSAGE}{DRAFT_MESSAGE}{SIGNATURE}</textarea>

<!-- Start FCKeditor -->
<script type="text/javascript">
 var fckeditor=new FCKeditor('message');
 fckeditor.BasePath="/phpBB3/fckeditor/";
 fckeditor.ToolbarSet="Default";
 fckeditor.Width="100%";
 fckeditor.ReplaceTextarea();
</script>
<!-- End FCKeditor -->

</div>

vi styles/prosilver/template/posting_layout.html
#刪除底下這行

<!-- IF S_DISPLAY_REVIEW --><!-- INCLUDE posting_topic_review.html --><!-- ENDIF -->

Step 6. 讓 subsilver2 風格使用 FCKeditor

vi styles/subsilver2/template/posting_body.html
#刪除底下這行:

<!-- INCLUDE posting_buttons.html -->

#刪除底下這行:

<!-- IF S_DISPLAY_REVIEW --><!-- INCLUDE posting_topic_review.html --><!-- ENDIF -->

#找到

<td valign="top" style="width: 100%;"><textarea name="message" rows="15" cols="76" tabindex="3" onselect="storeCaret(this);" onclick="storeCaret(this);" onkeyup="storeCaret(this);" onfocus="initInsertions();" style="width: 98%;">{MESSAGE}</textarea></td>

#改成

<td valign="top" style="width: 100%;">

<!-- Start FCKeditor -->
<script type="text/javascript" src="/phpBB3/fckeditor/fckeditor.js"></script>
<!-- End FCKeditor -->

<textarea name="message" rows="15" cols="76" tabindex="3" onselect="storeCaret(this);" onclick="storeCaret(this);" onkeyup="storeCaret(this);" onfocus="initInsertions();" style="width: 98%;">{MESSAGE}</textarea>

<!-- Start FCKeditor -->
<script type="text/javascript">
 var fckeditor=new FCKeditor('message');
 fckeditor.BasePath="/phpBB3/fckeditor/";
 fckeditor.ToolbarSet="Default";
 fckeditor.Width="100%";
 fckeditor.ReplaceTextarea();
</script>
<!-- End FCKeditor -->

</td>

Step 7. 安裝 Enable HTML 外掛

vi includes/mods/enable_html.php
#找到

function enable_html($text, $uid)
{
        if (strpos($text, '[html') === false)
        {
                return $text;
        }

        $text = str_replace(array('[html:' . $uid . ']', '[/html:' . $uid . ']'), array('[html]', '[/html]'), $text);

#改成

function enable_html($text, $uid)
{
/*
        if (strpos($text, '[html') === false)
        {
                return $text;
        }
*/

        $text = '[html]' . $text . '[/html]';

        $text = str_replace(array('[html:' . $uid . ']', '[/html:' . $uid . ']'), array('[html]', '[/html]'), $text);

vi memberlist.php
#找到

if ($member['user_sig'])
  {

#改成

if ($member['user_sig'])
  {
   // START Enable HTML
   include($phpbb_root_path . 'includes/mods/enable_html.' . $phpEx);
   $member['user_sig'] = enable_html($member['user_sig'], $member['user_sig_bbcode_uid']);
   // END Enable HTML

vi posting.php
#找到

$preview_message = $message_parser->format_display($post_data['enable_bbcode'], $post_data['enable_urls'], $post_data['enable_smilies'], false);

 $preview_signature = ($mode == 'edit') ? $post_data['user_sig'] : $user->data['user_sig'];
 $preview_signature_uid = ($mode == 'edit') ? $post_data['user_sig_bbcode_uid'] : $user->data['user_sig_bbcode_uid'];
 $preview_signature_bitfield = ($mode == 'edit') ? $post_data['user_sig_bbcode_bitfield'] : $user->data['user_sig_bbcode_bitfield'];

#改成

// START Enable HTML
 include($phpbb_root_path . 'includes/mods/enable_html.' . $phpEx);
 $temp_message = $message_parser->message;
 $message_parser->message = enable_html($message_parser->message, $message_parser->bbcode_uid);
 // END Enable HTML

 $preview_message = $message_parser->format_display($post_data['enable_bbcode'], $post_data['enable_urls'], $post_data['enable_smilies'], false);

 $preview_signature = ($mode == 'edit') ? $post_data['user_sig'] : $user->data['user_sig'];
 $preview_signature_uid = ($mode == 'edit') ? $post_data['user_sig_bbcode_uid'] : $user->data['user_sig_bbcode_uid'];
 $preview_signature_bitfield = ($mode == 'edit') ? $post_data['user_sig_bbcode_bitfield'] : $user->data['user_sig_bbcode_bitfield'];

 // START Enable HTML
 $message_parser->message = $temp_message; // reset this otherwise the html code will not show in the message box again
 unset($temp_message);
 $preview_signature = enable_html($preview_signature, $preview_signature_uid);
 // END Enable HTML

vi viewtopic.php
#找到

'search'                => ($auth->acl_get('u_search')) ? append_sid("{$phpbb_root_path}search.$phpEx", "author_id=$poster_id&amp;sr=posts") : '',

#改成

'search'  => ($auth->acl_get('u_search')) ? append_sid("{$phpbb_root_path}search.$phpEx",
    // START Enable HTML
    'user_type'   => $row['user_type'],
    'user_permissions' => $row['user_permissions'],
    // END Enable HTML

#找到

// End signature parsing, only if needed

#改成

// START Enable HTML
 if (!function_exists('enable_html'))
 {
  include($phpbb_root_path . 'includes/mods/enable_html.' . $phpEx);
 }
 $row['post_text'] = enable_html($row['post_text'], $row['bbcode_uid']);

 if ($user_cache[$poster_id]['sig'] && $row['enable_sig'] && empty($user_cache[$poster_id]['sig_parsed']))
 {
  $user_cache[$poster_id]['sig'] = enable_html($user_cache[$poster_id]['sig'], $user_cache[$poster_id]['sig_bbcode_uid']);
 }
 // END Enable HTML
// End signature parsing, only if needed

改完後連入 http://your.site/phpBB3/enable_html.php 以管理員帳號登入, 完成 Enable HTML 最後的安裝程序

Step 8. 解決 "引言" 失效問題

原因: fckeditor 把 [quote="someone"] 變成 [quote="someone"]
解決辦法: 去除相關程式內的 " 字眼, 把 [quote="someone"] 改成 [quote=someone]
sed -i 's/&quot;//g' posting.php
sed -i 's/&quot;//g' includes/message_parser.php
sed -i 's/&quot;//g' includes/bbcode.php

-
以上修改動作均已做成 patch 檔, 完成 Step 1. 之後, 依序操作以下指令就能一次搞定所有修改動作:
wget http://cha.homeip.net/share/phpbb3-fckeditor-patches.tar.bz2
tar jxf phpbb3-fckeditor-patches.tar.bz2
cat patches/* | patch -p0
rm -rf patches
-
附錄: RedSilver 風格安裝備忘

1. RedSilver 嵌入 FCKeditor 的修改方式如同前述 subsilver2
2. RedSilver 沒有正體中文圖形, 可以從 prosilver 複製過來使用:

cd styles/RedSilver/imageset/
cp -r ../../prosilver/imageset/zh_cmn_hant ./
cd zh_cmn_hant
cp ../en/*o*line* ./
vi imageset.cfg

img_icon_user_online = icon_user_online.gif*20*72
img_icon_user_offline = icon_user_offline.gif*20*72
3. 由於 prosilver 圖片上下兩部份做成動態效果, RedSilver 須將圖片高度砍一半才能正常使用:

for i in $(\ls *.gif | grep -v online); do convert -crop x50%+0+0! $i $i; done

htwang

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus facilisis nulla at odio vestibulum, ut accumsan mauris venenatis. Fusce metus nisl, lacinia at elit eget,

Facebook →

Like us on Facebook?

讓 phpBB3 使用 FCKeditor 編輯器

htwang

Popular Posts

Categories

Like Us On Facebook

Poll

Followers

Labels