مقدمه
یکی از نقاط ضعف دروپال ۷ این است که بطور پیشفرض هیچ ویرایشگر (ادیتور متن) پیشرفته‌ای در دل خود ندارد. این ضعف قرار است در نسخه‌ی ۸ دروپال، با اضافه شدن ویرایشگر CKEditor به دروپال ۸ برطرف شود.
یکی دیگر از نقاط ضعف دروپال ۷ این است که در ادیتور خود مرورگر فایل (File Browser) ندارد، و مثلا شما نمی‌توانید زمان نوشتن یک متن، عکسی را از کامپیوتر انتخاب کنید، همانجا آپلود و وارد متن کنید.
عکس ۱ – ادیتور پیشفرض دروپال ۷ که زمان ویرایش متن یک textarea نمایش داده می‌شود
در این مطلب یاد می‌گیریم که چطور با اضافه کردن CKEditor و IMCE به سایت دروپالی خود، یک ویرایشگر پیشرفته‌ی اچ‌تی‌ام‌ال بصری از نوع WYSIWYG داشته باشیم (مانند اولین عکسی که بالای مطلب مشاهده می‌کنید) و از دست ویرایشگر زیادی-ساده‌ی دروپال (عکس ۱) خلاص شویم!
CKEditor ها!
در واقع ما با دو CKEdiitor سر و کار خواهیم داشت:
۱- پلاگین CKEditor، که در واقع اصل ماجراست. CKEditor مخصوص دروپال نیست، بلکه یک ادیتور رایگان است که همه می‌توانند از آن در سایت‌های خود استفاده کنند. می‌توانید ویژگی‌های ادیتور CKEditor را در صفحه‌ی Features | CKEditor و دموی لایوی از این ادیتور را در صفحه‌ی CKEditor demo مشاهده نمایید.
۲- ماژول CKEditor، که در واقع رابط میان پلاگین CKEditor و دروپال است، و از طریق آن می‌توانیم ادیتور رایگان CKEditor را به سایت دروپالی خود اضافه کنیم.
نصب و تنظیم CKEditor
نصب ماژول Libraries
یکی از پیش‌نیاز‌های نصب ماژول CKEditor، نصب ماژول Libraries API است، ماژول Libraries API تعامل میان ماژول و پلاگین CKEditor را ممکن می‌سازد.
نکته: نصب CKEditor بدون نصب Libraries هم امکان‌پذیر است، اما بهتر است از ماژول Libraries استفاده شود. برای مثال، یکی از مزیت‌های استفاده از Libraries این است که پلاگین و ماژول CKEditor بطور جداگانه در سرور قرار می‌گیرند، و اگر فردا روزی شما ماژول CKEditor را آپدیت نمایید، باعث پاک شدن پلاگین CKEditor نمی‌شود.
ماژول Libraries API را دانلود نمایید، سپس آن را در مسیر sites/all/modules از حالت فشرده خارج کنید. حالا به صفحه‌ی ماژول‌ها (Modules) از سایت خود رفته، ماژول Libraries را فعال نمایید. این ماژول تنظیم خاصی ندارد.
نصب پلاگین CKEditor
بسته‌ی «Full Package» پلاگین CKEditor را از صفحه‌ی دانلود CKEditor دانلود نمایید (عکس ۲)
عکس ۲ – بسته‌ی «Full Package» پلاگین CKEditor را دانلود نمایید
فایل فشرده‌‌ای از ckeditor را که دریافت کردید در مسیر sites/all/libraries از حالت فشرده خارج نمایید. (نکته: اگر اولین بار است که از Libraries استفاده می‌کنید، پوشه‌ی libraries در مسیر sites/all وجود نخواهد داشت، پس آن را خودتان بسازید).
اگر مراحل را درست طی کرده باشید، فایل‌ها و پوشه‌های مربوط به پلاگین CKEditor (برای مثال: ckeditor.js و styles.js) باید در مسیر sites\all\libraries\ckeditor قرار داشته باشند.
نکته: برای کمتر شدن حجم فایل‌های ckeditor، اگر مایل بودید، می‌توانید پوشه‌ی samples و فایل‌های زبان بدون استفاده‌ی داخل پوشه‌ی lang را پاک نمایید (en.js و fa.js را پاک نکنید). با اینکار تقریبا حجم فایل‌ها نصف می‌شود.
نصب ماژول CKEditor
بالاخره نوبت به نصب ماژول CKEditor رسید!
آخرین نسخه‌ی پایدار ماژول CKEditor را دانلود کنید و در مسیر sites/all/modules از حالت فشرده خارج کنید. سپس به صفحه‌ی ماژول‌ها (Modules) از سایت خود رفته، ماژول CKEditor را فعال نمایید.
اگر تمامی مراحل را تابحال درست طی کرده باشید، در این مرحله CKEditor به سایت شما اضافه شده است. برای تست اینکه آیا مراحل را درست طی کرده‌اید، به یک صفحه‌ی افزودن محتوا، برای مثال صفحه‌ی افزودن یک صفحه (Basic page) بروید (محتوا > افزودن محتوا > صفحه) (Content > Add content > Basic page).
اگر CKEditor بدون مشکل نصب شده باشد، بخش «متن» (Body) باید به شکل CKEditor در آمده باشد (مشابه عکس ۳):
عکس ۳ – CKEditor به بخش Body اپلای شده است
توجه کنید که تعداد دکمه‌های داخل CKEditor بستگی به «فرمت متنی» (Text format)ی که انتخاب کرده‌اید و تنظیمات CKEditor دارد.
بطور پیشفرض زمانی که فرمت متنی بر روی Full HTML قرار گیرد، تمامی دکمه‌های موجود در اخیار شما قرار می‌گیرد، زمانی که بر روی Filtered HTML باشد تعداد دکمه‌ها محدود می‌شود، و زمانی که Plain text باشد CKEditor غیرفعال شده و همان ادیتور ساده‌ی دروپال فعال می‌شود.
تنظیمات ماژول CKEditor
تنظیمات ماژول CKEditor را می‌توانید در مسیر admin/config/content/ckeditor پیدا کنید (یا به صفحه‌ی Modules رفته، بر روی Configure روبروی CKEditor کلیک نمایید).
تنظیمات CKEditor از دو قسمت پروفایل ها (Profiles) و تنظیمات سراسری (Globar settings) تشکیل شده است.
بخش تنظیمات سراسری یک سری تنظیمات کلی را در بر می‌گیرد، که نیازی به تغییر آنها نیست.
بخش پروفایل‌ها اهمیت بیشتری دارد. هر پروفایل لینک است به یک یا چند فرمت متنی (Input format). برای مثال، بطور پیشفرض پروفایل Full لینک است به فرمت Full HTML، به این معنی که پروفایل Full مشخص می‌کند زمانی که فرمت متنی یک فیلد متنی بر روی Full HTML گذاشته شده است، CKEditor به چه صورت باشد.
برای مثال، دکمه‌ی ویرایش (edit) مربوط به پروفایل Full را بزنید تا وارد تنظیمات این پروفایل شوید. همانطور که مشاهده می‌کنید، در این صفحه می‌توانید مشخص کنید زمانی که فرمت متنی Full HTML انتخاب شد، چه دکمه‌هایی نمایش داده شوند، زبان ادیتور چه باشد، و ده‌ها مورد دیگر.
نصب و تنظیم IMCE
زمانی که از CKEditor استفاده می‌کنیم، برای اینکه بتوانیم همانجا فایلی را از کامپیوتر انتخاب کرده، آپلود و استفاده نماییم، باید IMCE را نصب کرده و به CKEditor اضافه کنیم.
نصب IMCE
ماژول IMCE را دانلود کرده، در مسیر sites/all/modules از حالت فشرده خارج نمایید. سپس به صفحه‌ی ماژول‌ها (Modules) از سایت خود رفته، ماژول IMCE را فعال نمایید.
تنظیمات ماژول IMCE
تنظیمات ماژول IMCE را می‌توانید در مسیر admin/config/media/imce پیدا کنید (یا به صفحه‌ی Modules رفته، بر روی Configure روبروی IMCE کلیک نمایید).
صفحه‌ی تنظیمات IMCE از سه بخش اصلی تشکیل شده است: بخش Configuration profiles، بخش Role-profile assignments، و بخش Common settings.
در بخش Common settings یک سری تنظیمات کلی قرار دارد.
در بخش Configuration profiles پروفایل‌هایی برای IMCE تعریف می‌شود، که هر یک از پروفایل‌ها اختیارات و تنظیماتی دارد. برای مثال اینکه کاربران آن پروفایل فایل‌هایی تا حداکثر چه حجمی بتوانند آپلود کنند، حداکثر اندازه‌ی عکس‌هایی که می‌توانند آپلود کنند چقدر باشد، مسیر ذخیره شده فایل‌هایی که آپلود می‌کنند چه باشد، و مواردی از این دست.
و بالاخره در بخش Role-profile assignments مشخص می‌کنیم که هر نقش کاربر (User role) که در سایت تعریف شده، اختیارات و تنظیمات کدام پروفایل را داشته باشد. بطور پیشفرض فقط User-1 یعنی admin سایت است که اجازه‌ی استفاده از IMCE را دارد، اگر مایلید کاربران نقش دیگری اجازه‌ی استفاده از IMCE را داشته باشند، ابتدا پروفایل مناسب آن را بسازید، سپس آن نقش را به پروفایل اختصاص دهید.
حالا زمان آن رسیده که IMCE را به CKEditor متصل کنیم:
به صفحه‌ی تنظیمات CKEditor بروید. تنظیمات CKEditor را می‌توانید در مسیر admin/config/content/ckeditor پیدا کنید (یا به صفحه‌ی Modules رفته، بر روی Configure روبروی CKEditor کلیک نمایید).
برای تک‌تک پروفایل‌های CKEditor که مایلید در IMCE به آنها اضافه شود، مراحل زیر را طی کنید. برای مثال، پروفایل Full را در نظر بگیرید:
بر روی edit در ردیف Full کلیک نمایید، تا به صفحه‌ی تنظیمات این پروفایل هدایت شوید.
در صفحه‌ی تنظیمات، بخش File browser settings را باز کنید. سپس، برای هر سه موردی که با File browser type شروع می‌شوند، IMCE را انتخاب کنید، و تنظیمات را ذخیره نمایید.
حالا اگر به همان صفحه‌ی افزودن صفحه (Content > Add content > Basic page) برگردید و فرمت متنی را بر روی Full HTML قرار دهید، با کلیک کردن بر روی دکمه‌ی اضافه کردن عکس، مشاهده می‌کنید که دکمه‌ی Browser Server روبروی فیلد URL اضافه شده است، که با کلیک کردن بر روی آن پنجره‌ی IMCE باز می‌شود و امکاناتی مانند آپلود مستقیم سایت در هاست، پاک کردن فایل‌ها و … را در اختیار شما می‌گذارد:
عکس ۳ – برای انتخاب و آپلود عکس می‌توانیم از IMCE استفاده نماییم
فراموش نکنید، اگر مایلید زمانی که فرمت متنی بر روی Filtered HTML قرار داده می‌شود هم IMCE را داشته باشید، مشابه مراحل بالا را که برای پروفایل Full طی کردیم، برای پروفایل Advanced هم طی نمایید.
موفق باشید
بر گرفته از: لینک
