Sử dụng TinyMCE, iBrowser với CakePHP
TinyMCE
- Cài đặt
+ Download TinyMCE http://tinymce.moxiecode.com/download.php
+ Sau khi download giải nén ra thư mục TinyMCE, và copy nguyên thư mục /tiny_mce vào /webroot/js trong cakephp.
- Cấu hình
+ Đưa đoạn mã vào layout (hoặc vào view nếu không muốn sử dụng mặc định cho tất cả các layout) :
<?php
if(isset($javascript)):
echo $javascript->link('tiny_mce/tiny_mce.js');
endif;
?>
+ Khai báo sử dụng javascript helper trong Controller :
var $helpers = array(‘Javascript’ );
+ Sử dụng tinyMCE trong view :
<script type="text/javascript">
tinyMCE.init({
theme : "advanced",
mode : "textareas",
convert_urls : false
});
</script>
* mode : "textareas" Tất cả các textarea sẽ biến thành tinyMCE editor
iBrowser
- Cài đặt
+ Download the ibrowser plugin from http://j-cons.com/downloads/
+ Copy into folder /tiny_mce/plugins/
- Cấu hình
+ Cấu hình file config.inc.php trong folder config dòng 96 :
$cfg['ilibs'] = array (
array (
'value' => '/bitcms/app/webroot/img/uploads/,
'text' => 'Site Pictures',
),...
);
* 'value' => '/bitcms/app/webroot/img/uploads/ Đường dẫn tới folder chứa ảnh.
+ Copy file tinyMCE.editor_plugin.js từ folder interface trong folder ibrowser tới folder chính ibrowser và đổi tên thành editor_plugin.js
+ Khai báo plugin ibrowser và include ibrowser button.
<script type="text/javascript">
tinyMCE.init({
plugins : "ibrowser",
theme : "advanced",
theme_advanced_buttons3_add : "ibrowser",
mode : "textareas",
convert_urls : false
});
</script>
* Error: ib is undefined
khai báo biến ib trong file editor_plugin.js :
var ib = null;
* Thay đổi trang index trong ibrowser thành trang Insert .
Sửa file ibrowser.php thêm code sau dưới dòng 129 ( btnStage(); )
/*
imDiv that contain adv content
call changeClass(0,’imDiv’,'hideit’); to hide adv content
*/
changeClass(0,’imDiv’,'hideit’);/*
inDiv that contain insert form
call changeClass(0,’inDiv’,’showit’); to showit
*/
changeClass(0,’inDiv’,’showit’);
Comments