به احتمال زیاد بعد از آپدیت سیستم های MODX Evolutionویرایشگر متن TinyMCE برای شما کار نمی کند. این عکسی است که من در تمام سایت های به روز شده دارم:
1. افزونه را از اینجا دانلود کنید.
2. از حالت فشرده خارج کنید.
3. پوشه ckeditor را در پوشه پر کنید دارایی / پلاگین /
4. یک افزونه ایجاد کنید ckeditor
5. مطالب را کپی کنید ckeditor.tpl
رویدادهای سیستم «OnRichTextEditorInit»، «OnRichTextEditorRegister» و «OnInterfaceSettingsRender» را بررسی کنید.
6. CKEditor را فعال کنید
می توانید CKEditor را در آن فعال کنید Tools>Configuration>Interface and Presentation، در ستون " ویرایشگر:" انتخاب کنید CKEditor
7. وارد هر سندی می شویم و این تصویر را می بینیم
8. بیایید با CKEditor و مدیر فایل KCFinder دوست شویم
برای اینکه ویرایشگر با فایل منیجر KCFinder به درستی کار کند، این کد را در فایل جایگزین می کنیم /assets/plugins/ckeditor/functions.php:
$mcpuk_path["base"] = MODX_BASE_URL. "manager/media/browser/mcpuk/browser.php". $cke_query ; $mcpuk_path["image"] = $mcpuk_path["base"] . "&Type=images"; $mcpuk_path["flash"] = $mcpuk_path["base"] . "&Type=flash"; $mcpuk_path["link"] = $mcpuk_path["base"] . "&Type=files";$mcpuk_path["base"] = MODX_BASE_URL. "manager/media/browser/mcpuk/browse.php"؛// . $cke_query ; $mcpuk_path["image"] = $mcpuk_path["base"] . "?type=images"; $mcpuk_path["flash"] = $mcpuk_path["base"] . "?type=flash"; $mcpuk_path["link"] = $mcpuk_path["base"] . "?type=files";
9. من مجموعه دکمه های مورد نیاز خود را مونتاژ کردم
در فایل /assets/plugins/ckeditor/modx_config.js می‌توانید مکان را تغییر دهید، دکمه‌ها را حذف یا اضافه کنید. من این ترکیب را برای خودم جمع کردم.
اگر کسی علاقه مند است، می توانید خط کد را جایگزین کنید:
Config.toolbar_modx = [["منبع"]، ["پررنگ"، "مورب"، "زیر خط"، "ضربه"،"-"، "Subscript"، "Superscript"]، ["PasteText"،"PasteFromWord"] , ["لغو"، "دوباره"،"-"، "یافتن"،"-،"RemoveFormat"]، "/"، ["NumberedList"،"BulletedList"،"-"،"Outdent"، "Indent" ""Blockquote"]، ["JustifyLeft"، "JustifyCenter"، "JustifyRight"]، ["Link"، "Unlink"، "Anchor"]، "Image"، "Flash", "Table", "HorizontalRule" ""Smiley"،"SpecialChar"]، "/"، ["Format"، "Font"، "FontSize"]، ["TextColor"،"BGColor"]، ["Maximize"، "ShowBlocks"،"- "،"در باره"] ]؛
Config.toolbar_simple = [["منبع"،"-"،"بیشینه کردن"، "RemoveFormat"]، ["PasteText"، "Find"، "Replace"]، ["پیوند"،"لغو پیوند"]، ["تصویر" ""SpecialChar"]، ["Format"]، "/"، ["Bold"، "Italic"، "Underline"، "Strike"،"-"، "Subscript"، "Superscript"]، ["TextColor" """BGColor"]، ["NumberedList"،"BulletedList"،"-"،"Blockquote"]، ["JustifyLeft"،"JustifyCenter"،"JustifyRight"،"JustifyBlock"] ];
در اینجا فقط آنچه را که نیاز داشتم باقی گذاشتم: کد منبع، بزرگ‌کننده (برای آسان‌تر کردن نوشتن)، قالب‌بندی متن، فقط درج متن، جستجو و جایگزینی، پیوندها، درج تصاویر، نمادها، عنوان‌ها، ویژگی‌های متن، رنگ متن و پس‌زمینه، پاراگراف‌ها ، نقل قول و توجیه متن.
نصب افزونه های اضافی
CKeditor پلاگین های جالب زیادی دارد. می توانید آنها را در اینترنت و در وب سایت رسمی CKeditor پیدا کنید. همه پلاگین ها در پوشه /manager/assets/components/ckeditor/ckeditor/plugins/ نصب می شوند.
سپس در «تنظیمات سیستم» «ckeditor» را انتخاب کنید و در قسمت افزونه‌های اضافی ( extra_plugins) نام افزونه ای که قرار است نصب شود را وارد کنید. و در گروه های دکمه ( نوار ابزار) "نام افزونه" را در جای مناسب وارد کنید. افزونه نصب شده و آماده استفاده است.
پیشنهاد می کنم CKEditor را به عنوان یک ویرایشگر کد بصری امتحان کنید. نسخه 4.0 دارای یک تم سیاه و سفید خنثی (بسیار مناسب برای پنل مدیریت MODx) و برخی ویژگی‌های جدید است (از درج پاراگراف‌ها در مکان‌های "سخت در دسترس" استقبال می‌شود).
نمی توان به عنوان یک ویرایشگر جلویی استفاده کرد.
Ctrl+S کار می کند و همچنین پیوندها را درج می کند یا منابع (iframe) و فایل ها (IMG، صدا، ویدئو) را جاسازی می کند. فقط باید متن را انتخاب کنید و منبع/فایل مورد نیاز را در ویرایشگر رها کنید.
در تنظیمات می توانید رنگ رابط کاربری، پوسته، افزونه های خود را اضافه کنید و ترتیب و مجموعه دکمه های پنل را تغییر دهید.
لطفاً توابع از دست رفته را مشخص کنید - سعی می کنم آنها را پیاده سازی کنم.
نصب از طریق مدیر بسته.
برخلاف TinyMCE، کاملاً سازگار است
برنامه عملیاتی:
پشتیبانی از پارامترهای تلویزیون متن غنی را اضافه کنید
- دکمه روی سرور را در کادرهای محاوره ای انتخاب کنید (ادغام با مرورگر فایل MODX)
- تنظیمات: افزونه های اضافی، disableObjectResizing، کنترل فرمت پیوند، انتخاب پوسته
- منو هنگام کشیدن فایل ها و منابع: Embed object | درج لینک | نام شی را وارد کنید (اگر کشیدن از طریق هر دو دکمه سمت راست و چپ ماوس (مانند ویندوز) کار کند، جالب خواهد بود)
- حفاظت از برچسب Modx
- دکمه های جدید (درج برچسب ها، ویژگی های ویرایش و غیره)
- لیست کلاس ها از شیوه نامه بخارپز.
- برداشتن تنظیمات سیستم از زمینه ویرایش شده (در حال حاضر مشکلات مربوط به پیوندها)
- میانبرهای صفحه کلید قابل تنظیم
- پلاگین تایپوگرافی - تصحیح خودکار نقل قول، خط تیره و غیره در پرواز.
- بارگذاری شفاف تصاویر از طریق کپی/پیست و کشیدن "n" رها کردن
- جایگزینی خودکار (تجزیه و خروجی) تگ های modx، در صورت امکان و تا حد امکان (پشتیبانی از ویجت در حال توسعه توسط تیم CKSource ممکن است مفید باشد)
- ویرایش درون خطی از قسمت جلویی
این یک لیست نسبتا بزرگ است. باید توهماتمون رو کم کنیم...
دستورالعمل نصب افزونه های اضافی:
افزونه مورد نیاز را پیدا می کنیم، مثلاً آن را در پوشه قرار می دهیم /manager/assets/components/ckeditor/ckeditor/plugins/، به تنظیمات سیستم بروید، فضای نام را انتخاب کنید ckeditor، افزونه ما را در آن ثبت کنید extra_plugins(با کاما از هم جدا شده اند، اگر چند تا) سپس ویرایش کنید نوار ابزار، وارد کردن یک دکمه جدید (در صورت وجود). ما فرم ویرایش منبع را به روز می کنیم و نتیجه را بررسی می کنیم. پیشنهاد می کنم افزونه های جالب را به اشتراک بگذارید.
افزونه های اضافی (در بسته گنجانده نشده است):
oEmbed - به شما امکان می دهد محتوا (فیلم، عکس، صدا، فریم) را از سرورهای مختلف تنها با یک لینک جاسازی کنید. لیست خدمات بسیار بزرگ است که توسط YouTube، Vimeo، Flickr، Instagram، GitHub، Twitter، JSFiddle و تعداد زیادی سرویس دیگر پشتیبانی می شود.
تاریخچه تغییرات:
CKEditor 1.1.1
- رفع سازگاری با AjaxManager (یک اشکال با کشیدن و رها کردن وجود داشت)
- افزونه های اضافه شده: یوتیوب، تعداد کلمات، تصحیح خودکار
- منویی که هنگام کشیدن از درخت ظاهر می شود حذف شد. اکنون لینک به سادگی درج شده است. اگر تصویری را بکشید، تصویر درج می شود.
- پشتیبانی از IE8
CKEditor 1.1.0
====================================
- ادغام با مرورگر فایل MODx
- پشتیبانی از تلویزیون Richtext
- پشتیبانی از کلاس های منابع سفارشی (مقالات برای مثال.)
- کشیدن "n" رها کردن بهبود یافته است. اکنون می توانید به سادگی تصاویر را از درخت Files پرتاب کنید تا آنها را در محتوا قرار دهید.
- Ctrl+S ثابت شد
- گزینه extra_plugins (افزونه های اضافی)
- گزینه پوست
امروز در کانال تلگرام MODX نوشتند که ویرایشگر متن غنی TinyMCE این کار را انجام نمی دهد و آن را انجام نمی دهد. برخی از افراد موفق به پیکربندی آن نشدند، برای برخی خطاهایی ایجاد کرد و غیره. سوال انتخاب ویرایشگر به محض تغییر به MODX برای من پیش آمد (که یادآوری می کنم نه چندان دور، یعنی حدود 8 ماه پیش). تنها یک کار وجود داشت: ایجاد یک ویرایشگر محتوای ساده، راحت و چند منظوره. من با TinyMCE معمولی بازی کردم، با ckeditor بازی کردم، با TinyMCE Rich Text Editor بازی کردم و تصمیم گرفتم آخرین مورد را انتخاب کنم.
من نمی خواهم هولیوار را شروع کنم که کدام ویرایشگر بهتر است. من یک راه حل آماده برای یک ویرایشگر فعال و چند منظوره به اشتراک می گذارم. و اینکه کدام یک را انتخاب کنید البته به شما بستگی دارد.
داستان
راه اندازی زمان زیادی را صرف نکرد؛ سفارشی کردن ویرایشگر و یکپارچه سازی عملکردهای لازم زمان بسیار بیشتری را صرف کرد. اما خوشبختانه هنوز هم کمی گوگل بلد هستم و چندین موضوع مفید در بین منابع انگلیسی زبان پیدا کردم که با کمک آنها توانستم ویرایشگری را که در نهایت به دست می آوریم پیاده سازی کنم.مونتاژ بدون خطا انجام شد.
نصب و راه اندازی
1) می توانید نصب کننده خودکار را از مخزن جدید Git من دانلود کنید.2) فرآیند نصب بسیار ساده است - فایل tinymcerte-1.0.0-beta.transport.zip را در ../core/packages/ رها کنید و از طریق نصب کننده به دنبال بسته بگردید. بعد فقط آن را نصب می کنیم. نصب کننده خودکار تنظیمات را خود تنظیم می کند.
3) در پوشه /files/TinyMCERTE-settings/، می توانید یک readme.txt کوچک و پلاگین typograf را بیابید که باید در پوشه پلاگین های ویرایشگر قرار داده شود (در این مورد در readme.txt بخوانید). این همه است - ویرایشگر آماده استفاده است.
هشدارها و تجدید نظرها
1) من این نصب کننده خودکار را در یک سایت تمیز و یک سایت بدون ویرایشگر نصب شده آزمایش کردم. من نمی دانم اگر آن را در سایتی که قبلاً ویرایشگر دارد نصب کنید (Ace حساب نمی شود) چگونه و چه اتفاقی می افتد.2) خوب است که پوشه تایپوگراف را به طور خودکار در قسمت مورد نظر قرار دهیم، اما دانش من برای اجرای این ایده کافی نیست. اگه کسی بخواد کمک کنه خیلی خوبه من منابع این نصب کننده خودکار را امروز در همان مخزن قرار خواهم داد، اما بعد از ظهر.
4) برای بررسی املا، ویرایشگر از سرویس yandex.speller استفاده می کند. می توانید تنظیمات سرویس را در فایل ../assets/components/tinymcerte/tinymcerte/js/external-config.json بیابید. Spellchecker TinyMCE از تعداد زیادی زبان برای بررسی پشتیبانی می کند. در حالی که yandex.speller فقط 3 (روسی، اوکراینی، انگلیسی).
تقریباً هر وب مستر از یک ویرایشگر بصری (WYSIWYG) برای ارسال محتوا در سایت استفاده می کند. ویرایشگرهای بصری نه تنها به شما این امکان را می دهند که با HTML مانند متن ساده در یک ویرایشگر متن کار کنید، بلکه عملکردی دارند که زندگی یک وب مستر را آسان تر می کند. با این حال، دومی نه تنها می تواند زندگی را ساده کند، بلکه آن را نیز پیچیده می کند.
در MODX Revolution من عمدتا از ویرایشگر TinyMCE استفاده می کنم که به عنوان یک بسته جداگانه نصب می شود. من در مورد مزایا و معایب آن صحبت نمی کنم، اما امروز فقط به نکاتی می پردازم که برای آسان کردن کار با آن استفاده می کنم.
تنظیمات پیش فرض
بلافاصله پس از نصب بسته TinyMCE، بلوک tinymce را در تنظیمات سیستم بررسی می کنم:
Tiny.forced_root_block آن را خالی کنید tiny.path_options باید خالی باشد tiny.base_url باید خالی باشد
همچنین در تنظیمات افزونه TinyMCE گزینه convert_urls را به No تغییر می دهم. من این کار را انجام می دهم تا ویرایشگر سعی نکند پیوندهایی را که تنظیم کرده ام تغییر دهد.
اتصال فایل styles
من همیشه آن را وصل نمی‌کنم، اما گاهی اوقات مفید است و کار با محتوا را آسان‌تر می‌کند. این کار با تعیین تنظیمات سیستم editor_css_path در بلوک تنظیمات سیستم ویرایشگر متن غنی، تنظیم مسیر به فایل CSS یا.
تگ های HTML5
صادقانه بگویم، من نتوانستم تگ های HTML5 را اضافه کنم و آنها را عاقلانه پردازش کنم. بنابراین من مسیر اجازه دادن هر برچسبی را با افزودن خط به خط به فایل core/components/tinymce/templates/script.tpl رفتم.
Tiny.config =modx->toJSON($this->properties); ?>;
Tiny.config.valid_elements = "*[*]";
که اجازه عبور هر تگ را می دهد. برای کسانی که می خواهند گیج شوند، می توان به این متغیر لیستی از تمام تگ های HTML ممکن، از جمله تگ های HTML5 از فایل xconfig.js موجود در بسته اختصاص داد.
