2017-08-01 31 views
1

テキストを右揃えまたは左揃えまたは中央揃えにするための正当化プラグインを追加しようとしました。しかし、ドキュメント(http://apostrophecms.org/docs/tutorials/howtos/ckeditor.html)の指示に従った後、私はプラグインが特定のフォルダ(私はpublic/modules/apostrophe-areas/js/ckeditorPlugins/justify /にあります)がサイトがロードされますが、私がpublic/plugins/justifyのような他のフォルダに含めると、まだ動作しません。Ckeditorプラグインの設定が正しく動作しません。

これは念のために私のコードです:(LIB /モジュール/アポストロフィ-エリア/公共/のJS/user.jsのであります)

apos.define('apostrophe-areas', { 
    construct: function(self, options) { 
    // Use the super pattern - don't forget to call the original method 
    var superEnableCkeditor = self.enableCkeditor; 
    self.enableCkeditor = function() { 
     superEnableCkeditor(); 
     // Now do as we please 
     CKEDITOR.plugins.addExternal('justify', '/modules/apostrophe-areas/js/ckeditorPlugins/justify/', 'plugin.js'); 
    }; 
    } 
}); 

また、どのようにプラグインがすべき知っていいだろう編集可能なウィジェットのツールバー設定で呼び出すことができます。 ありがとう!

答えて

1

の中にCKEDITOR.plugins.addExternalと呼ぶだけでは不十分であることが判明しました。また、apostrophe-rich-text-widgets-editorモジュールのself.beforeCkeditorInlineをオーバーライドし、明示的にself.config.extraPlugins = 'your_plugin_name';を呼び出す必要があります。 in lib/modules/apostrophe-rich-text-widgets/public/js/editor.jsで、その後

apos.define('apostrophe-areas', { 
    construct: function(self, options) { 
    // Use the super pattern - don't forget to call the original method 
    var superEnableCkeditor = self.enableCkeditor; 
    self.enableCkeditor = function() { 
     superEnableCkeditor(); 
     // Now do as we please 
     CKEDITOR.plugins.addExternal('justify', '/modules/my-apostrophe-areas/js/ckeditorPlugins/justify/', 'plugin.js'); 
    }; 
    } 
}); 

lib/modules/apostrophe-areas/public/js/user.jsで:ここで

は私がなってしまったものだ

apos.define('apostrophe-rich-text-widgets-editor', { 
    construct: function(self, options) { 
    self.beforeCkeditorInline = function() { 
     self.config.extraPlugins = 'justify'; 
    }; 
    } 
}); 

apostrophe-areas内部CKEDITOR.config.extraPlugins = 'justify'は動作しませんやっていくつかの理由について、おそらくにCKEDITORの初期化方法

もう1つ:この特定のプラグイン(正当化、つまり)は、ボタン定義ロジックに従っていないようです。 Apostrophe CMS 2.3で使用されているCKEditor 4.6はアイコンを表示するのにfont-awesomeを使用していますが、ボタンアイコンはイメージとして定義されています。これは、正当化モジュールと共に出荷されるアイコンが表示されず、各ボタンごとに独自のCSSを個別に記述する必要があることを意味します。

最後に正当化ボタンを有効にすると、おそらく直面する別の問題があります。組み込みのHTMLサニタイザーは、コンテンツを整列させるための追加を正当化するスタイルを取り除きます。

アポストロフィCMSは入力をサニタイズするためにsanitize-htmlを使用しているようですので、CKEditor設定を変更しても効果はありません。この問題を解決するには、次のアプリをapp.jsに追加してください。

'apostrophe-rich-text-widgets': { 
    // The standard list copied from the module, plus sup and sub 
    sanitizeHtml: { 
    allowedAttributes: { 
     a: ['href', 'name', 'target'], 
     img: ['src'], 
     '*': ['style'] //this will make sure the style attribute is not stripped off 
    } 
    } 
} 
2

必要なURLは次のとおりです。元apostrophe-areasモジュールおよびそれのあなたのプロジェクトレベルの拡張の両方のpublicフォルダが別々のURLを持つことができるように

/modules/my-apostrophe-areas/js/ckeditorPlugins/justify/

my-接頭辞を自動的に付加されます。そうしないと、例えば、両方ともuser.jsにアクセスする方法がありません。

このノートを問題のHOWTOに追加します。このHOWTOは、現在、作成されたURLでスタブして問題をハンドブックしています。

プラグインをどのように呼び出すべきかについては、そのプラグインによってエクスポートされたツールバーのコントロール名を使用してください。その部分は実際にはアポストロフィーではなく、ckeditorの質問です。しかし、そのプラグインのソースコードはおそらくJustifyLeftJustifyCenterJustifyRightJustifyBlockです。

0

ありがとうございました。 フォルダにプラグインを配置し、apostrophe-rich-textウィジェットでeditor.jsを編集する(sanitize.htmlファイルで既にその設定を使用していた)の両方のアプローチを行った後、プラグインが動作しています。しかし、私はまだアイコンの問題を抱えていました。

Iはpublic/modules/apostrophe-areas/js/vendor/ckeditor/skins/apostrophe/editor.less

の終わりに align-justify, align-right, align-leftalign-centerに対応するフォント恐ろしいアイコンを追加すること固定
関連する問題