2013-04-14 4 views
2

Как я понимаю, CKEditor автоматически удаляет пустые анкеры. Проблема в том, что многие HTML-аддоны используют пустые привязки и сохраняют их в JavaScript после загрузки страницы.CKEditor - Автоматическое удаление пустых якорей

например. Если я хотел бы использовать AddThis они позволяют мне добавить следующий код:

<div class="addthis_toolbox addthis_default_style "> 
    <a class="addthis_button_facebook_like" fb:like:layout="button_count"></a> 
    <a class="addthis_button_tweet"></a> 
    <a class="addthis_button_pinterest_pinit"></a> 
    <a class="addthis_counter addthis_pill_style"></a> 
</div> 

И после того, как я изменить дисплей от источника к Разработайте CKEditor является удаление всех анкеров.

Я знаю, что если я добавлю   к якорям, CKEditor не удалит их, но в моем случае я не смогу это использовать.

Я нашел строку, удаляя ссылки в файле: /ckeditor/ckeditor_4.0.1_full_source/core/htmldataprocessor.js Lines: 536-540

Они добавляющие правило htmlFilter, что удаление любой пустой якорь. Теперь я знаю, что могу редактировать исходный файл CKEditor и изменять это, но мне не нравится сделать это, потому что в любое время, когда я обновляю версию, мне нужно будет использовать одно и то же исправление, поэтому мне нравится исправить его с помощью CKEditor API.

Я нашел, как добавить правило в следующем виде:

CKEDITOR.instances['instanceName'].dataProcessor.dataFilter.addRules(
      { 
       elements : 
       { 
        a : function(element) 
        { 
         //Do what i like to do 
        } 
       } 
      }); 

Проблема заключается в том, что даже когда я добавить правило для тега его до сих пор не перезаписывать правила, которые сделали CKEditor.

Есть ли способ переписать это правило или решить эту проблему по-другому?

+0

Можете ли вы попробовать его с помощью CKEditor 4.1, а затем включить автоматическую фильтрацию содержимого «истина»?Это просто позволяет все и может решить проблему. – Nenotlep

+1

Я уже пробовал это решение и его не помогло. Он оставляет «скрипт», но он все равно удаляет теги «a». Спасибо, в любом случае. –

ответ

0

Я понял, решение для этого. Вам нужно будет использовать анализатор жидких кодов от shopify (gem liquid), и его очень легко сделать. После того, как вы установили камень вы можете сделать:

<%= Liquid::Template.parse(your_ckeditor_content).render({ 
    code_you_want_untouched => %Q{ html code here } 
}) %> 

Заменить текущий код выхода CKEditor с этой линией.

Затем у вас теперь есть «code_you_want_untouched» в качестве переменной, которую вы можете использовать в CKEditor.

Вы называете это, как это в содержание CKEditor:

{{ code_you_want_untouched }} 

Поскольку HTML-код не приходит из CKEditor больше, оно не раздеться ничего. Охлаждающая часть о жидкости - вы можете использовать столько переменных, сколько хотите, и вы можете выполнить Ruby внутри кода переменной.

0

Попробуйте использовать случайное имя на тегах:

<div class="addthis_toolbox addthis_default_style "> 
    <a class="addthis_button_facebook_like" fb:like:layout="button_count" name="at_r"></a> 
    <a class="addthis_button_tweet" name="at_t"></a> 
    <a class="addthis_button_pinterest_pinit" name="at_p"></a> 
    <a class="addthis_counter addthis_pill_style" name="at_c"></a> 
</div> 
+0

Проблема заключается в том, как добавить код без изменения/редактирования кода. Я знаю, как добавить его, но клиенты, которые используют систему, не будут знать, чтобы это сделать :). –

+0

Возможно, вы могли бы добавить систему, в которой ваши клиенты могут нажать «добавить виджет AddThis», и вы введете отредактированный код для них? –

+1

Не только о виджетах AddThis о любом виджетах или внешнем HTML, которые пользователь хотел бы вставить на свой сайт. Это не статично, и теперь я могу узнать код ведьмы, который пользователь вставляет. Иногда его пустые теги и в другое время - неподдерживаемые теги. Мне нравится то, что CKEdtior прекратит удаление любой пустой TAG, даже если не распознает тег, например.

0

Я была такая же проблема, единственный способ, которым я получил его, чтобы остановить удаление пустой тег добавляет это к config.js

config.protectedSource.push(/<a[^>]*><\/a>/g); 
enterCKEDITOR.dtd.$removeEmpty.a = 0; 

Примечание. Однако в моем документе фоновые изображения НЕ отображаются в редакторе. Они отлично работают, они просто не появляются. Я надеюсь, что это будет просто ошибка, которая будет исправлена.

Смежные вопросы