مرجع پارسی MyBB
آموزش جامع قرار دادن دکمه بانک برای ادیتور Ckeditor - نسخه‌ی قابل چاپ

+- مرجع پارسی MyBB (https://community.mybbiran.com)
+-- انجمن: آرشیو (https://community.mybbiran.com/forum-128.html)
+--- انجمن: آرشیو انجمن های قدیمی (https://community.mybbiran.com/forum-129.html)
+---- انجمن: مای بی بی نسخه 1.6 (https://community.mybbiran.com/forum-83.html)
+----- انجمن: آموزش ها (https://community.mybbiran.com/forum-84.html)
+------ انجمن: آموزش تغییرات (https://community.mybbiran.com/forum-113.html)
+------ موضوع: آموزش جامع قرار دادن دکمه بانک برای ادیتور Ckeditor (/thread-16173.html)



آموزش جامع قرار دادن دکمه بانک برای ادیتور Ckeditor - salehkhan - ۱۳۹۳/۲/۳۱

آموزش نحوه ی گذاشتن دکمه ی بانک در ادیتور Ckeditor

برای اضافه کردن دکمه طبق آموزش زیر پیش بروید .
یک پوشه به نام payment در مسیر ckeditor/plugins ایجاد کرده و فایل جاوا اسکریپت به نام plugin.js ایجاد کرده و کدهای زیر را در آن قرار بدهید .





کد:
CKEDITOR.plugins.add( 'payment', {
icons: 'payment',
init: function( editor ) {
editor.addCommand( 'payment', new CKEDITOR.dialogCommand( 'paymentDialog' ));
editor.ui.addButton( 'payment', {
label: 'افزودن محصول',
command: 'payment',
toolbar: 'insert'
});

CKEDITOR.dialog.add( 'paymentDialog', this.path + 'dialogs/payment.js' );
}

});

یک پوشه دیگر با نام dialogs در مسیر ckeditor/plugins ایجاد کنید و فایل جاوا اسکریپت به نام payment.js ایجاد کرده و کدهای زیر را در آن قرار بدهید .




کد:
CKEDITOR.dialog.add( 'paymentDialog', function ( editor ) {
return {
title: 'افزودن محصول',
minWidth: 500,
minHeight: 140,

contents: [
{
id: 'tab-basic',
label: 'افزودن',
elements: [
// UI elements of the first tab will be defined here
{
type: 'html',
html: '<p>قیمت محصول به تومان :</p>'
},
{
type: 'text',
id: 'price',
style: 'width:95px'
},
{
type: 'html',
html: '<p>توضیحاتی در مورد محصول بنویسید</p>'
},
{
type: 'textarea',
id: 'comment',
'default': ' متنهایی را که می خواهید قیمت گذاری کنید در این قسمت بنویسید . ارزش مطلب قیمت گذاری شده شما نباید کمتر از 500 تومان باشد . می توانید متنها را بعدا با ادیتور ویرایش کنید .'
},
{
type: 'html',
html: '<p> </p>'
}
]
}
],
onOk: function() {
var dialog = this;
editor.insertText( '[payment='+dialog.getValueOf( 'tab-basic', 'price' )+']'+dialog.getValueOf( 'tab-basic', 'comment' )+'[/payment]' );
}
};
});


یک پوشه دیگر با نام icons در مسیر ckeditor/plugins ایجاد کنید و تصویر 16 در 16 به نام payment.png [تصویر:  payment.png] را در آن قرار بدهید .

حالا در مسیر MYBBRooT/inc/plugins فایلmybbirckeditor.php رو باز کرده.

و کد زیر رو پیدا کنید:

کد:
$codebuttons .= "magicline,code,videos',

به کد زیر تبدیل کنید:

کد:
$codebuttons .= "payment,magicline,code,videos',

و کد زیر رو بیابید:

کد:
[ 'Link', 'Unlink', '-', 'Image', 'Smiley'],

و به کد زیر تبدیل کنید:


کد:
[ 'Link', 'Unlink', '-', 'Image', 'Smiley', '-', 'payment'],
سپس فایل را ذخیره کرده و وارد کنترل پنل انجمن خودتان بشوید

و بعد بر روی پیکربندی کلید کنید . عبارت زیر را بیابید :

تنظیمات پلاگین CKEditor (25 تنظیم)

روی آن کلیک کنید . در کادر کد تولبار ویرایشگر کامل کد زیر رو بیابید:


کد:
[ 'Link', 'Unlink', '-', 'Image', 'Smiley'],

و به کد زیر تبدیل کنید:


کد:
[ 'Link', 'Unlink', '-', 'Image', 'Smiley', '-', 'payment'],

و در آخر ذخیره تنظیمات را بزنید .

یک بار کل صفحه انجمن را رفرش کنید یا کش مرورگرتان را پاک کنید تا دکمه بانک افزوده شود .


منبع : http://www.sepna.com/thread-631.html


RE: آموزش جامع قرار دادن دکمه بانک برای ادیتور Ckeditor - amir1 - ۱۳۹۳/۲/۳۱

سلام
خیلی وقته به دنبال راهی برای اضافه کردن دکمه به این ادیتور هستم. مشابه این آموزش هم در سایت دیگری از mybb که وطنی هست دیدم.
پلاگین :
http://community.mybbiran.com/thread-13122.html

با پلاگینی که تو اون سایت mybb وطنی هست ، تفاوت داره.

این آموزشی هم که شما قرار دادید مربوط به اون پلاگین هست.(مشابه این آموزش در همون سایت هست)

به دنبال آموزش برای اضافه کردن دکمه به این ادیتور هستم:
http://community.mybbiran.com/thread-13122.html


RE: آموزش جامع قرار دادن دکمه بانک برای ادیتور Ckeditor - salehkhan - ۱۳۹۳/۳/۱

من زیاد با این ادیتور کار نکردم . لینکهای زیر را مطالعه کنید

کد:
$.sceditor.command.set("payment", {
    exec: function() {
    this.insert("payment");
    },
    txtExec: function() {
    this.insert("payment");
    },
    tooltip: "افزودن محصول"
    });

و افزودن تصویر دکمه در css

کد:
.sceditor-button-[name] div { background: url('/images/payment.png'); }

http://www.sceditor.com/documentation/custom-commands/
http://www.sceditor.com/documentation/custom-bbcodes/
http://community.mybb.com/thread-140420.html
http://www.sceditor.com/posts/how-to-add-custom-commands/


RE: آموزش جامع قرار دادن دکمه بانک برای ادیتور Ckeditor - amir1 - ۱۳۹۳/۳/۱

بیشتر این لینک ها را قبلا دیدم و در سایت مرجع هم توضیحاتی هست اما خیلی پیچیده هست و یه اشتباه کوچک در تغییرات ممکنه ادیتور مختل کنه.
ادیتور دیگه ای هم فعلا در دسترس نیست. احتمالا باید منتظر باشیم تا در نسخه های بعدی mybb یه ادیتور کامل را ببینیم.