it-swarm.asia

هل هناك طريقة للحصول على N عدد من المحررين WYSIWYG في نوع منشور مخصص؟

هل هناك طريقة للحصول على برامج تحرير WYSIWYG متعددة لنوع منشور مخصص؟ على سبيل المثال ، إذا كان لدي تخطيط مكون من عمودين ، فقد أردت أن يكون لدي محرر واحد لعمود ومحرر آخر للآخر.

27
Paul Sheldrake

لنفترض أن نوع المنشور المخصص الخاص بك يسمى Properties ، يمكنك إضافة المربع للاحتفاظ بمحرر tinyMCE الإضافي الخاص بك باستخدام رمز مشابه لهذا:

function register_meta_boxen() {
    add_meta_box("wysiwyg-editor-2", "Second Column", "second_column_box",
    "properties", "normal", "high");    
}
add_action('admin_menu', 'register_meta_boxen');

wysiwyg-editor-2 هو المعرف الذي سيتم تطبيقه على مربع meta ، Second Column هو العنوان الذي سيحصل عليه مربع meta ، second_column_box هي الوظيفة التي ستطبع HTML في مربع meta ، properties هو نوع نشرنا المخصص ، normal هو يحدد موقع مربع meta ، و high أنه يجب أن يظهر أعلى مستوى ممكن في الصفحة. (عادة ما يكون أقل من محرر tinyMCE الافتراضي).

بعد ذلك ، مع أخذ هذا المثال الأساسي ، يجب إرفاق محرر tinyMCE بنصوص. لا يزال يتعين علينا تحديد وظيفة second_column_box الخاصة بنا والتي ستقوم بطباعة HTML لمربع التعريف حتى يكون هذا مكانًا جيدًا مثل أي مكان للقيام بذلك:

function second_column_box() {
    echo <<<EOT
    <script type="text/javascript">
jQuery(document).ready(function() {
    jQuery("#tinymce").addClass("mceEditor");
    if ( typeof( tinyMCE ) == "object" &&
         typeof( tinyMCE.execCommand ) == "function" ) {
        tinyMCE.execCommand("mceAddControl", false, "tinymce");
    }
});
</script>
    <textarea id="tinymce" name="tinymce"></textarea>
EOT;
}

هناك بعض المسائل التي لست متأكدًا من كيفية التغلب عليها. سيتم دمج محرر tinyMCE داخل قاعدة التعريف ، والتي قد لا تكون مثالية ، ولن تتميز بالقدرة على التبديل بين أوضاع التحرير HTML و Visual ، وكذلك أوامر إدراج الوسائط التي يحتوي عليها محرر النشر العادي. يبدو أن تبديل الأوضاع يتم تعريفه كدالة من أول وسيطة هي المعرف ، ولكن يبدو أيضًا أنه تم ترميزه في البرنامج النصي wp-tinymce. من الممكن استخدام وظائف tinyMCE المضمنة للقيام بذلك ، لكن هذا يغير النص بين tinyMCE الكامل والنص الأساسي ، بدون أي من أزرار إدراج HTMLWP.

20
nobody

أولاً: الشكر الكبير إلى @ Thomas McDonald لـ إجابته ؛ كنت بحاجة لمعرفة السؤال نفسه بالضبط الذي طرحه {Paul Sheldrake وكود توماس بدأني في الاتجاه الصحيح.

لسوء الحظ ، تعثرت بسبب كنت بحاجة إلى تغيير التنسيق من الافتراضي إلى تخطيط أبسط وأصغر منذ أن كنت بحاجة إلى استخدام TinyMCE في وحدة استقلاب جانبية. لقد بحثت عن {عمليًا في كل مكان بحثًا عن حل ولا سيما في MoxieCode TinyMCE Wiki و TinyMCE Tips & How To Forum ولم أجد شيئًا! 1 شرح كل شيء وجدته كيفية تعيين theme ، width ، height ، وما إلى ذلك باستخدام tinyMCE.init({...}) ولكن يبدو أنه لا يمكنك استخدام ذلك عند استخدام tinyMCE.execCommand("mceAddControl").

كنت على وشك الحيرة عندما ركضت عبر المقالة حالات TinyMCE متعددة متعددة على صفحة واحدة by Hamilton Chua ، وأطلق عليها مسمرًا! كان حله هو تعيين tinyMCE.settings قبل الاتصال tinyMCE.execCommand("mceAddControl") ، على سبيل المثال:

<?php 
$id = "sidebar-content";
$script = <<<EOT
<script type="text/javascript">
jQuery(document).ready(function($) {
    $("#{$id}").addClass("mceEditor");
    if ( typeof( tinyMCE ) == "object" &&
         typeof( tinyMCE.execCommand ) == "function" ) {
      tinyMCE.settings = {
        theme : "advanced",
        mode : "none",
        language : "en",
        height:"200",
        width:"100%",
        theme_advanced_layout_manager : "SimpleLayout",
        theme_advanced_toolbar_location : "top",
        theme_advanced_toolbar_align : "left",
        theme_advanced_buttons1 : "bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull",
        theme_advanced_buttons2 : "",
        theme_advanced_buttons3 : ""
      };
      tinyMCE.execCommand("mceAddControl", true, "{$id}");
    }
});
</script>
<textarea id="sidebar-content" name="sidebar-content"></textarea>
EOT;

الجزء المحزن هو أن هذا لم يكن صعبًا ، ولكنه لم يتم توثيقه في أي مكان آخر يمكن أن أجده. إنه لأمر مدهش أن يكتشف أي شخص آخر تقريبا هذه المشكلة.

على أي حال ، فإن الكود أعلاه قد أنشأ TinyMCE الثاني التالي بالتنسيق/التنسيق الذي يحتاجه عميلي بالضبط:

 Multiple TinyMCE TextAreas in the WordPress 3.0 Admin Editor 
(المصدر: mikeschinkel.com )

لذلك إذا كنت تستخدم كود {@ Thomas McDonald أعلاه ، فستجد أنك بحاجة إلى تعديل التصميم ، تأكد من مراجعة مقال Hamilton Chua الرائع (شكرًا Ham!):

P.S.إذا ارتكبت شيئًا خاطئًا ، فقد لا تظهر TinyMCE على الإطلاق. على سبيل المثال ، في حالتي ، استخدم theme: "simple" في البداية ولم أحصل على شيء واستغرق الأمر أكثر من ساعة لأدرك أنني بحاجة فقط لاستخدام theme: "advanced". لذلك إذا وجدت أن TinyMCE لا يعمل من أجلك ، فتأكد من تجربة تغيير الأشياء ، فقد تواجه مشكلة مماثلة. (راجع للشغل ، لم أجرب أي سمات أخرى ولم أستكشف ما هو متاح ؛ إذا وجدت مظاهر أخرى تعمل ، فيرجى ترك تعليق أدناه.)

حاشية

1 : محبط جدًا! بعد أكثر من شهر بقليل باستخدام WordPress Answer ، أتوقع الآن العثور على إجابات لجميع أسئلتي بنفس المستوى من الجودة كما هو الحال هنا ، وفي أماكن أخرى عادةً ما أكون العثور على خيبة أمل!

18
MikeSchinkel

منذ أن وجدت هذه المقالة كأول نتيجة في Google ، أردت فقط أن أعلق على أن <WP تقدم الآن وظيفة للتعامل مع هذا النوع من المهام.

ضمن وظيفة add_meta_box ، أضف الكود التالي ->

wp_editor( $content, $editor_id, $settings = array() );

أينما تريد إضافة محرر TinyMCE

المرجع: wp_editor

1
ejhost

حصلت عليه فقط عن طريق إضافة "theEditor" كسمة صفية إلى textarea:

<div style="background: #FFF; border: 1px solid #CCC;"><textarea id="my_details_field" name="my_details" class="theEditor" rows="20" style="width: 100%;"><?=get_post_meta($post->ID, 'my_details', TRUE)?></textarea></div>
0
Markus René Einicher

يتم تحميل المحرر الافتراضي ، tinymce ، بواسطة دالة في wp-admin/include/post.php تسمى wp_tiny_mce ()؛ ابحث في المصدر في السطر 1350. هناك مجموعة من الإعدادات في السطر 1478. أحد الخيارات على ما يبدو يعيّن محدد النص textarea لتطبيق محرر جافا سكريبت. كنت أقرأ هذا المنشور من قبل Keighl على مدونته التي وجهت لي نحو ذلك. اقرأ المقال ، وربما توجد طريقة للاتصال بـ wp_tiny_mce () في مكون إضافي لقسم المسؤول وتطبيقه على منطقة نصية ثانية تنشئها.

0
kevtrout