اضافه کردن دکمه به ادیتور SCEditor مای بی بی 1.8.4

[میدوری]

با درود خدمت دوستان و شادباش برای سال نو و جشن نوروز سال 1394
برای اضافه کردن دکمه به اديتور جديد مای بی بی  هرجایی روشی داده شده ولی در آزمایش های من چیزی دست کاربران را نگرفته و به همین خاطر در صدد راهی برای آن برآمدم که نتیجه ی خوبی هم داشت و به هدف رسیدم . برای اضافه کردن دکمه به ادیتور جدید (1.8.4) مای بی بی نخست تصویر و فیلم های زیر را ببینید و در صورت نیاز و علاقه مند شدن , گام های مربوطه را انجام دهید .

برای استفاده در نگارش 1.8.7 به اینجا بروید.

تصویر نمونه :

   

فیلم های نمونه :

  movies.zip (اندازه: 220.45 KB / تعداد دفعات دریافت: 34)


توجه:
این روش در مای بی بی 1.8.4 انجام شده و درست کار میکند . توجه داشته باشید که پس از ایجاد دکمه , مای کد لازم را هم باید درست کنید .

گام نخست: در روت سایتتان بروید و فایل jscripts/bbcodes_sceditor.js را باز کنید و کدهای زیر پیدا کنید :

کد php:

$.sceditor.command.set('video', 


سپس کدهای زیر را پیش از کدهای بالا قرار دهید:

کد php:

/* + Midori + */ $.sceditor.command.set('midori', {
/* + Midori + */ _dropDown: function (editor, caller) {
/* + Midori + */ var $content;
/* + Midori + */ $content = $(
/* + Midori + */ '<div>' +
/* + Midori + */ '<label for="midori">' + editor._('midori') + '</label> ' +
/* + Midori + */ '<input type="text" id="midori" />' +
/* + Midori + */ '</div>' +
/* + Midori + */ '<div><input type="button" value="' + editor._('Insert') + '" /></div>'
/* + Midori + */ );
/* + Midori + */ $content.find('.button').click(function (e) {
/* + Midori + */ var    val = $content.find('#midori').val();
/* + Midori + */ if(val) {
/* + Midori + */ editor.focus();
/* + Midori + */ editor.insert('[midori]'+val+'[/midori]');
/* + Midori + */ editor.closeDropDown(true);
/* + Midori + */ e.preventDefault();
/* + Midori + */ }
/* + Midori + */ });
/* + Midori + */ editor.createDropDown(caller, 'midori', $content);
/* + Midori + */ },
/* + Midori + */ exec: function (caller) {
/* + Midori + */ $.sceditor.command.get('midori')._dropDown(this, caller);
/* + Midori + */ },
/* + Midori + */ txtExec: function (caller) {
/* + Midori + */ $.sceditor.command.get('midori')._dropDown(this, caller);
/* + Midori + */ },
/* + Midori + */ tooltip: 'Midori'
/* + Midori + */ }); 


توجه:
در تمام کدهای بالا بجای midori از نام مورد نیاز خودتان استفاده کنید و خط 28 , که عنوان کلید است را با نام خودتان به پارسی نوشته و فایل را با فرمت UTF-8 ذخیره کنید .

نتیجه ی کدهای بالا می شود:   [midori]http://www.midorinco.ir/[/midori]
برای حالت دوم که میتواند وارد کردن مقداری هم باشد خط  15  را با کدهای زیر جایگزین کنید:

کد php:

/* + Midori + */ editor.insert('[midori='+val+']', '[/midori]'); 


که نتیجه میشود:   [midori=200x500]http://www.midorinco.ir/[/midori] و یا [midori=20]http://www.midorinco.ir/[/midori]

گام دوم: به مسیر jscripts/sceditor/editor_themes/mybb.css  بروید و فایل mybb.css را باز کنید و کدهای زیر را پیدا کنید :

کد php:

/* Additional buttons (for MyBB) */
.sceditor-button-video div  {
  background-image: url(video.png);
} 


و پس از کدهای بالا کدهای زیر را اضافه کنید:

کد php:

/* + Midori + */ .sceditor-button-midori div  {
/* + Midori + */ background-image: url(midori.png);
/* + Midori + */ } 


گام سوم: به مسیر زیر بروید و متغیر زیر را پیدا کنید:
کنترل پنل مدیریت > قالب ها و پوسته > قالب ها > قالب مورد نظر > قالب های گروه بندی نشده > بخش codebuttons

کد php:

{$code}quote| 


و سپس با کدهای زیر جایگزین کنید:

کد php:

{$code}quote|midori| 


توجه:
اگر میخواهید دکمه ها بهم وصل شوند از تایپ "|" خودداری کنید و اگر می خواهید جدا از دیگر دکمه ها قرار بگیرد تایپ کنید.

گام چهارم: تصویر مورد نظر خودتان را در مسیر زیر:

کد php:

jscripts/sceditor/editor_themes 


آپلود کنید . (برای نمونه تصویری پیوست کرده ام) ==> 
  midori.png (اندازه: 808 bytes / تعداد دفعات دریافت: 141)
کار تمام است . امید که بکار بیاید .

منبع :  تالار میدوری