CKEditor 对齐图像而不是浮动
总之，
我在我的应用程序中非常成功地使用了 CKEditor，它允许客户构建和发送 HTML 电子邮件。只有一个问题 - CK 对图像使用 style="float:left"，而 Outlook 拒绝接受这一有效方式（Microsoft..）FCKEditor 过去使用对齐而不是浮动来定位图像。有没有办法让 CKEditor 在图像对齐方面表现得像 FCK 一样？
CK 论坛上的帖子都是徒劳的。任何帮助表示感谢！
All,
I'm very successfully using CKEditor in my app that allows clients to build and send HTML Emails. There's just one hitch--CK uses style="float:left" for images, while Outlook refuses to accept that as valid (way to go, Microsoft..) FCKEditor used to use aligns instead of floats to position images. Is there a way to hack CKEditor to behave as FCK used to with regards to image alignment?
Posts to CK's forums have been futile. Any assistance is appreciated!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（5）
这是另一种选择...我发现宽度/高度是否也发生了变化以添加对齐。
Here is an alternative... I found that did the width/height just changed to add the align as well.
由于没有任何真正准确的答案，我做了自己的研究。解决此问题的唯一正确方法是使用以下代码更新 plugins/image/dialogs/image.js 文件，该代码优先考虑 html 实体而不是 CSS 实体。该解决方案使所见即所得编辑器对于电子邮件编辑器应用程序来说几乎是完美的，也是我发现的唯一可以 100% 消除 Microsoft 拖放操作创建可怕的额外标记的问题的解决方案。
Absent any really spot-on answers, I did my own research. The only correct way to solve this issue is to update the plugins/image/dialogs/image.js file with the following code that prioritizes html entities over that of CSS. The solution makes a WYSIWYG editor that's near perfect for Email editor applications, and also the only solution I've found that 100% eliminates the issue of drag-and-drop from Microsoft creating HORRIBLE extra markup.
我没有编辑 ckeditor 代码，而是添加了一个自定义插件来覆盖默认行为。在这种情况下，它将通过更改对齐选择框上的提交功能来修改 ckeditor 图像对话框定义。
如需编写自定义插件的帮助：http://www.voofie.com/content /2/ckeditor-plugin-development/
这是来自我的自定义“ckoverride”插件的plugin.js。
Rather than edit the ckeditor code, I add a custom plugin to override default behaviours. In this case it will modify the ckeditor image dialog definition by changing the commit function on the align select box.
For help writing a custom plugin: http://www.voofie.com/content/2/ckeditor-plugin-development/
This is from my plugin.js for a custom 'ckoverride' plugin.
我帮不上什么忙，但我想为你指出一条路。您可以轻松地向 CKEditors 添加新按钮和操作，并可以配置其工具栏菜单。
这是一个示例，展示了如何为 CKEditor 实现您自己的工具。
(function(){ b='syrinxImage'; CKEDITOR.plugins.add(b,{ init:function(c){ c.addCommand(b,a); c.ui.addButton('SyrinxImage',{ label:'Insert Image', icon: this.path + 'toolBarButton.png', command: b }); } })();当您使用自己的工具完成后，您可以像这样设置或修改 CKEditor 的工具栏，
[ ['Source','-','Templates'], ['Cut','Copy','Paste','PasteText','PasteFromWord','-','Print', 'SpellChecker', 'Scayt'], ['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'], ['Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton', 'HiddenField'], '/', ['Bold','Italic','Underline','Strike','-','Subscript','Superscript'], ['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'], ['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'], ['Link','Unlink','Anchor'], ['SyrinxImage','SyrinxCode','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak'], '/', ['Styles','Format','Font','FontSize'], ['TextColor','BGColor'], ['Maximize', 'ShowBlocks','-','About'] ]请检查以下链接以获取更多详细信息。
第一个代码
CKEditor JavaScript API
CKEditor 文档主页
我希望我能对这些有所帮助。
I cannot be helpful but I want to point a way for you. You can easily add new buttons and actions to CKEditors and can configure it's toolbars menu.
here is an example that shows how to implement your own tool for CKEditor.
(function(){ b='syrinxImage'; CKEDITOR.plugins.add(b,{ init:function(c){ c.addCommand(b,a); c.ui.addButton('SyrinxImage',{ label:'Insert Image', icon: this.path + 'toolBarButton.png', command: b }); } })();when you done with your own tool you can set or modify CKEditor's toolbar like this
[ ['Source','-','Templates'], ['Cut','Copy','Paste','PasteText','PasteFromWord','-','Print', 'SpellChecker', 'Scayt'], ['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'], ['Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton', 'HiddenField'], '/', ['Bold','Italic','Underline','Strike','-','Subscript','Superscript'], ['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'], ['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'], ['Link','Unlink','Anchor'], ['SyrinxImage','SyrinxCode','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak'], '/', ['Styles','Format','Font','FontSize'], ['TextColor','BGColor'], ['Maximize', 'ShowBlocks','-','About'] ]please check the following link for more detailed information.
first code
CKEditor JavaScript API
Main page of Documentation for CKEditor
I hope, I can be helpful with these.
我在保存内容之前使用小的 jquery 代码来解决这个问题：
I am using small jquery code to fix this before saving content: