Go Back   Diễn Đàn Bo-Blog Việt Nam > Bo-Blog > Plugins Bo-Blog > Developed By Member



About Me
Your Avatar

 
Trả lời Gởi Ðề Tài Mới
 
Ðiều Chỉnh Kiếm Trong Bài
  #1  
Old 18-09-2013, 10:11 AM
levis012's Avatar
levis012 is offline
Administrator
 
Tham gia ngày: Mar 2010
Bài gởi: 382
Default Hướng dẫn viêt plugin cho bo-blog phần 2 (walk plugin)

Hôm nay chúng ta tiếp tục với bài hướng dẫn viết plugin cho bo-blog.
Click the image to open in full size.
Ở bài viết này mình xin giới thiệu đến các bạn loại plugin thứ 2 đó là walk, ở bài trước mình có nhắc đến 4 loại plugin đó là Get, Walk, Run, Page.

Bài số 2 này sẽ hướng dẫn các bạn làm 1 plugin loại walk và lần này là 1 plugin có tác dụng highlight code.

Bài viết khá dài. Gồm 3 phần chính như sau

1 - Thêm tự động các thẻ cần thiết vào header
2 - Thêm tự động các nút BBCODE vào phần editor
3 - Xử lý khi lấy nội dung ra ngoài

Mình đặt tên plugin là vietbb_highlighter vì vậy mình sẽ tạo 1 thư mục bo-blog/plugin/vietbb_highlighter.

Vẫn như thường lệ chúng ta cần có các file, setup.php, install.php, uninstall.php và 1 số file khác.

File setup.php

PHP Code:
<?php
$info
['name']="vietbb_highlighter";  // Tên plugin của bạn, cũng chính là tên thư mục
$info['author']="levis012";  //  Tác giả của plugin
$info['intro']="Highlight plugin vietbb.net";  //  giới thiệu về plugin của bạn
$info['version']="1.0";  //  Phiên bản của plugin
$info['authorurl']="http://demo.vietboblog.net";  //  Đường dẫn đến web của tác giả
$info['blogversion']="2.0.1";  //  Version của bo-blog có thể sử dụng
$info['register']="";    //  Các thành phần bạn đăng ký với bo-blog để có thể tác động vào nó
?>
Mình chưa điền vào mục register bởi vì mình chưa nói qua về nó ở loại walk.

Ở plugin loại walk bo-blog cung cấp cho chúng ta 1 số thành phần sau

Firstheader - Tác động đến những thành phần ở header
Storecontent - Tác động đến việc lưu trữ bài viết
Ubbanalyse - Tác động đến việc tạo bbcode
Ubbanalyseadvance - Như Ubbanalyse nhưng được mở rộng hơn, mình cũng chưa rõ mở rộng hơn cái gì nhưng chỉ biết là thế.

Loại walk hoạt động như sau, khi bạn viết plugin loại này, bo-blog sẽ tự động include plugin của bạn sau đó sẽ chạy function

PHP Code:
plugin_ten_plugin_runtham số 


Với tham số truyền vào sẽ là phần header, nội dung bài viết, nội dung lưu trữ vv tùy vào phần các bạn đăng ký

Danh sách các tham số của những thành phần

Firstheader - tham số sẽ là các thành phần ở header như các thẻ meta javascript, style vv
Storecontent - Tham số các bạn truyền vào chính là nội dung bài viết vừa được viết
Ubbanalyse - Tham số các bạn truyền vào chính là nội dung bài viết được lấy ra từ cơ sở dữ liệu
Ubbanalyseadvance - Như Ubbanalyse nhưng được mở rộng hơn, mình cũng chưa rõ mở rộng hơn cái gì nhưng chỉ biết là thế.


Rồi quay lại với plugin, chúng ta cần phải có những thứ sau để có thể có high light code trên blog.

Mình sử dụng http://alexgorbatchev.com/SyntaxHighlighter/ để áp dụng cho blog

Xem qua hướng dẫn cài đặt thì có yêu cầu chúng ta như sau.

Đưa đoạn code này vào phần header của website


<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/>
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeRDark.css' rel='stylesheet' type='text/css'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shAutoloader.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js' type='text/javascript'></script>
Vì thế để có thể tác động nên phần header mình sẽ khai báo với bo-blog là sẽ sử dụng thành phần

Firstheader

1 - Thêm tự động các thẻ cần thiết vào header
PHP Code:
<?php$info['name']="vietbb_highlighter";  // Tên plugin của bạn, cũng chính là tên thư mục
$info['author']="levis012";  //  Tác giả của plugin
$info['intro']="Highlight plugin vietbb.net";  //  giới thiệu về plugin của bạn
$info['version']="1.0";  //  Phiên bản của plugin
$info['authorurl']="http://demo.vietboblog.net";  //  Đường dẫn đến web của tác giả
$info['blogversion']="2.0.1";  //  Version của bo-blog có thể sử dụng
$info['register']="firstheader";    //  Các thành phần bạn đăng ký với bo-blog để có thể tác động vào nó
?>
Sau khi khai báo thành phần này xong, bạn cần phải tạo file firstheader.php trong thư mục plugin

Mình đã tạo rồi

Bây giờ ta đi vào việc viết nội dung plugin.

Khi chạy plugin, bo-blog sẽ tự tìm đến các function có dạng

Plugin_tenPlugin_run($str)
hoặc
Plugin_tenPlugin_tenThanhPhan($str)

Mình khuyến khích dùng cách 2 bởi vì cách 1 mình đã làm và bị lỗi nếu như dùng nhiều thành phần, lỗi đó là trùng tên hàm.

Như vậy trong file firstheader.php ta cần có hàm
PHP Code:
function plugin_vietbb_highlighter_firstheader$str )
{


Tham số $str ở đây chính là phần header của bo-blog bao gồm các thẻ meta..

Chúng ta sẽ viết tiếp cho function. Vì cần thêm 1 đoạn code vào header nên ta sẽ nối thêm vào tham số $str đoạn cần nối rồi trả về đoạn $str đã nối hoàn chỉnh.

Nói rất khó hiểu nhưng các bạn tưởng tượng như sau.

Giả sử mình có đoạn header của bo-blog


<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://demo.vietboblog.net/inc/rsd.php" />
<script type="text/javascript" src="lang/vn/jslang.js?jsver=2.1.1.3626.3"></script>
<script type="text/javascript" src="images/js/ajax.js?jsver=2.1.1.3626.3"></script>
<script type="text/javascript" src="images/js/swfobject.js?jsver=2.1.1.3626.3"></script>
Thì khi gọi hàm


PHP Code:
plugin_vietbb_highlighter_firstheader$str ); 
Biến $str chính là đoạn code trên. Khi hàm trả về bạn cần phải trả về đầy đủ nội dung của biến đã truyền vào nếu không sẽ bị mất đoạn code của bo-blog như thế blog sẽ bị lỗi.

Mình viết function như sau
PHP Code:
function plugin_vietbb_highlighter_firstheader$str )
{
  
$str  .=  "<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/>
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeRDark.css' rel='stylesheet' type='text/css'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shAutoloader.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js' type='text/javascript'></script>"
;

  return 
$str;

Như vậy khi chạy plugin sẽ tự động thêm vào phần dưới của header đoạn mã trên.

Như vậy đã xong phần header.

2 - Thêm tự động các nút BBCODE vào phần editor

Tiếp đến phần cũng quan trọng không kém đó là thêm thẻ UBB vào trình viết bài UBB editor của bo-blog.

Để thêm 1 nút BBcode chúng ta cần khai báo thêm thành phần ubbeditor

Như vậy file setup.php sẽ như sau.

PHP Code:
<?php$info['name']="vietbb_highlighter";  // Tên plugin của bạn, cũng chính là tên thư mục
$info['author']="levis012";  //  Tác giả của plugin
$info['intro']="Highlight plugin vietbb.net";  //  giới thiệu về plugin của bạn
$info['version']="1.0";  //  Phiên bản của plugin
$info['authorurl']="http://demo.vietboblog.net";  //  Đường dẫn đến web của tác giả
$info['blogversion']="2.0.1";  //  Version của bo-blog có thể sử dụng
$info['register']="firstheader,ubbeditor";    //  Các thành phần bạn đăng ký với bo-blog để có thể tác động vào nó
?>
Khi thêm thành phần ubbeditor các bạn cần phải tạo file ubbeditor.php trong thư mục plugin

Chúng ta sử dụng 2 biến

PHP Code:
$plugin_ubbeditor_functions;  //biến này dùng để khai báo các nút bấm, trên thanh công cụ 
$plugin_ubbeditor_buttons;  // Biến này dùng để khai báo các hàm bạn sử dụng cho nút bấm trên thanh công cụ. 
Mình đã có mẫu ở đây các bạn theo dõi và sử dụng luôn file ubbeditor.php rất dễ hiểu

PHP Code:
<?php
global $plugin_ubbeditor_functions$plugin_ubbeditor_buttons;
$plugin_ubbeditor_buttons.=<<<eot
<a  href="JavaScript: void(0); "><img border="0"  onclick="vietbb_phpcode()" title=""  src="plugin/vietbb_highlighter/images/php.gif" ></a>
eot;
$plugin_ubbeditor_functions.=<<<eot
function vietbb_phpcode() {
  if (document.selection && document.selection.type == "Text") {
    var range = document.selection.createRange();
    range.text = "[vietbbphp]" + range.text + "[/vietbbphp]";
  } else if (is_firefox && noweditorid.selectionEnd) {
    txt=FxGetTxt ("[vietbbphp]", "[/vietbbphp]");
    return;
  } else {
    txt=prompt("Code php input","");
    if(txt!=null) {
      AddTxt="[vietbbphp]"+txt;
      AddText(AddTxt);
      AddTxt="[/vietbbphp]";
      AddText(AddTxt);
    }
  }
}
eot;
?>
Như vậy mình vừa thêm nút php với ảnh là php.gif. Và ở dưới có thêm function vietbb_phpcode chính là function mình gọi ở trên có tác dụng là bao quanh hoặc hiển thị hộp thoại nhập code php.


Như vậy chúng ta đã xong phần thêm bbcode. Còn 1 phần cuối là phần xử lý php code nữa là xong.

3 - Xử lý khi lấy nội dung ra ngoài
Mình sẽ khai báo sử dụng thêm 1 thành phần nữa để xử lý nội dung khi hiển thị bài viết bằng bbcode.

Thành phần ubbanalyse, và tạo luôn file ubbanalyse.php trong thư mục plugin

File setup.php sẽ có nội dung.


PHP Code:
<?php
$info
['name']="vietbb_highlighter";  // Tên plugin của bạn, cũng chính là tên thư mục
$info['author']="levis012";  //  Tác giả của plugin
$info['intro']="Highlight plugin vietbb.net";  //  giới thiệu về plugin của bạn
$info['version']="1.0";  //  Phiên bản của plugin
$info['authorurl']="http://demo.vietboblog.net";  //  Đường dẫn đến web của tác giả
$info['blogversion']="2.0.1";  //  Version của bo-blog có thể sử dụng
$info['register']="firstheader,ubbeditor,ubbanalyse";    //  Các thành phần bạn đăng ký với bo-blog để có thể tác động vào nó
?>
Nội dung file ubbanalyse.php

PHP Code:
<?php
function plugin_vietbb_highlighter_ubbanalyse($str) { 
  
$str=preg_replace("/\s*\[vietbbphp\](.*?)\[\/vietbbphp\]\s*/ise""vietbb_highlight('php', '\\1')"$str);
  return 
$str;
}


function 
vietbb_highlight($lang 'php'$content) {
  
  
$content  =  stripslashes($content);
  
$content  =  str_replace("
"
"\n"$content);
  
$res  =  '<script type="syntaxhighlighter" class="brush: '.$lang.'"><![CDATA['.( $content ). ']]></script>';
  return 
$res;
}
?>
Khi chạy plugin thành phần ubbanalyse bo-blog sẽ gọi hàm
plugin_vietbb_highlighter_ubbanalyse


Tham số truyền vào chính là data lấy từ cơ sở dữ liệu.
Code thì các bạn tự tìm hiểu nhé.

Đoạn code trên có đoạn

<script type="syntaxhighlighter" class="brush: js"><![CDATA[
.....
]]></script>
Đoạn này là hướng dẫn highlight code của http://alexgorbatchev.com/SyntaxHigh...tallation.html

Mình chỉ làm đúng như họ hướng dẫn, ko có gì đặc biệt cả.
Như vậy là đã xong giờ mình thử xem và setup lên boblog demo xem có chạy hay ko.
Trả Lời Với Trích Dẫn
  #2  
Old 18-09-2013, 12:55 PM
aboq's Avatar
aboq aboq is offline
Member
 
Tham gia ngày: Dec 2012
Bài gởi: 57
Default

K0 bỏ công đọc nhưng công viết rất mệt
Chữ ký của aboq wWw.NeuCan.Net - My Blog's
Trả Lời Với Trích Dẫn
  #3  
Old 18-09-2013, 04:49 PM
hackerkinhcan_lha's Avatar
hackerkinhcan_lha hackerkinhcan_lha is offline
Senior Member
 
Tham gia ngày: Jun 2010
Đến từ: Hà Tĩnh
Bài gởi: 301
Gửi tin nhắn qua Yahoo chát tới hackerkinhcan_lha
Default

Những chia sẻ quý báu.
Hy vọng lớp trẻ sau này sẽ có thêm nhiều nhân tài đóng góp cho cộng đồng như tác giả
Trả Lời Với Trích Dẫn
Trả lời Gởi Ðề Tài Mới

Tags
(walk, bo-blog, cho, dẫn, hướng, phần, plugin, plugin), viêt

Ðiều Chỉnh Kiếm Trong Bài
Kiếm Trong Bài:

Kiếm Chi Tiết

Chuyển đến


Múi giờ GMT. Hiện tại là 05:29 PM.
Powered by vBulletin® Version 3.8.4
Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.
vdata

Bo-Blog Việt Nam

Bo-blog
9.9 10 13259