Details

    • Fix Priority:
      4
    • Similar Issues:
      Show 5 results 

      Description

      When creating a web content and using the source mode of the default web content editor, it changes html structure.

      to reproduce please:

      • create web content, give it a name
      • switch editor to "source" mode
      • paste html below
      • save
      • go back to edit the same web content and switch to "source" mode
      • see changes in html structure (span tags)

      html (copied from welcome theme for convenience):
      <footer id="footer" role="contentinfo">
      <div class="column-1" id="getting-started">
      <div class="footer-column-content">
      <span class="footer-logo"></span>
      <div class="footer-box">
      <h3>Change User Data</h3>
      <a href="/group/control_panel/manage?p_p_id=2&p_p_lifecycle=0&p_p_state=maximized&p_p_mode=view">Go to MyAccount ?</a>
      </div>
      </div>
      </div>
      <div class="column-2" id="ide">
      <div class="footer-column-content">
      <span class="footer-logo"></span>
      <div class="footer-box">
      <h3>Need Help Getting Started?</h3>
      <a href="//www.liferay.com/start?wh=15">Click here ?</a>
      </div>
      </div>
      </div>
      <div class="column-3" id="social-office">
      <div class="footer-column-content">
      <span class="footer-logo"></span>
      <div class="footer-box">
      <h3>Develop Faster.</h3>
      <a href="//www.liferay.com/ide?wh=16">Click here ?</a>
      </div>
      </div>
      </div>
      </footer>

        Issue Links

          Activity

          Hide
          Mika Koivisto added a comment -

          Thanks for checking this Ethan. We have portal-web/docroot/html/js/editor/ckeditor_diffs/ckeditor.jsp which I believe is used instead of config.js or is used in addition to it to change the editor config. I think it could be configured there.

          Show
          Mika Koivisto added a comment - Thanks for checking this Ethan. We have portal-web/docroot/html/js/editor/ckeditor_diffs/ckeditor.jsp which I believe is used instead of config.js or is used in addition to it to change the editor config. I think it could be configured there.
          Hide
          Jonathan Mak added a comment -

          The ticket for removing the <p> tags around the CKEditor in WYSIWYG mode can be found at http://issues.liferay.com/browse/LPS-33501

          Show
          Jonathan Mak added a comment - The ticket for removing the <p> tags around the CKEditor in WYSIWYG mode can be found at http://issues.liferay.com/browse/LPS-33501
          Hide
          Mika Koivisto added a comment -

          Thanks Jon. I'm going to close this ticket as won't fix because that is what CKEditor does. If CKEditor at some point introduces an option to modify that behavior then this can be reevaluated.

          Show
          Mika Koivisto added a comment - Thanks Jon. I'm going to close this ticket as won't fix because that is what CKEditor does. If CKEditor at some point introduces an option to modify that behavior then this can be reevaluated.
          Hide
          Jonathan Mak added a comment -

          Thank you for contacting Liferay! We appreciate your help in making our product better. After some analysis and review of the issue of removing tags without content:

          <span class="footer-logo"></span>

          we have discovered that this is a CKEditor bug and they have marked these issues as "Won't Fix" tickets. We are going to proceed and resolve this Liferay ticket as well. If you still feel this issue is a bug, please feel free to reopen the issue and we can revisit it. If you feel that this issue is a limitation with the CKEditor, you can set your Liferay instance to use TinyMCE or FCKEditor as your WYSIWYG editor via portal.properties.

          ##
          ## Editors
          ##
          
              #
              # You can configure individual JSP pages to use a specific implementation of
              # the available WYSIWYG editors: bbcode, ckeditor, ckeditor_bbcode,
              # ckeditor_creole, fckeditor, simple, tinymce, or tinymce_simple.
              #
              editor.wysiwyg.default=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.announcements.edit_entry.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.asset_publisher.configuration.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.blogs.configuration.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.blogs.edit_entry.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.bookmarks.configuration.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.calendar.configuration.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.calendar.edit_event.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.document_library.configuration.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.invitation.configuration.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.journal.configuration.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.journal.edit_article_content.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.journal.edit_article_content_xsd_el.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.login.configuration.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.mail.edit.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.mail.edit_message.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.message_boards.configuration.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.message_boards.edit_message.bb_code.jsp=ckeditor_bbcode
              editor.wysiwyg.portal-web.docroot.html.portlet.message_boards.edit_message.html.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.portal_settings.email_notifications.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.shopping.configuration.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.wiki.edit.creole.jsp=ckeditor_creole
              editor.wysiwyg.portal-web.docroot.html.portlet.wiki.edit.html.jsp=ckeditor
              editor.wysiwyg.portal-web.docroot.html.portlet.wiki.edit.mediawiki.jsp=simple
          

          Thank you for your support!

          Show
          Jonathan Mak added a comment - Thank you for contacting Liferay! We appreciate your help in making our product better. After some analysis and review of the issue of removing tags without content: <span class="footer-logo"></span> we have discovered that this is a CKEditor bug and they have marked these issues as "Won't Fix" tickets. We are going to proceed and resolve this Liferay ticket as well. If you still feel this issue is a bug, please feel free to reopen the issue and we can revisit it. If you feel that this issue is a limitation with the CKEditor, you can set your Liferay instance to use TinyMCE or FCKEditor as your WYSIWYG editor via portal.properties. ## ## Editors ## # # You can configure individual JSP pages to use a specific implementation of # the available WYSIWYG editors: bbcode, ckeditor, ckeditor_bbcode, # ckeditor_creole, fckeditor, simple, tinymce, or tinymce_simple. # editor.wysiwyg.default=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.announcements.edit_entry.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.asset_publisher.configuration.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.blogs.configuration.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.blogs.edit_entry.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.bookmarks.configuration.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.calendar.configuration.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.calendar.edit_event.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.document_library.configuration.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.invitation.configuration.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.journal.configuration.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.journal.edit_article_content.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.journal.edit_article_content_xsd_el.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.login.configuration.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.mail.edit.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.mail.edit_message.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.message_boards.configuration.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.message_boards.edit_message.bb_code.jsp=ckeditor_bbcode editor.wysiwyg.portal-web.docroot.html.portlet.message_boards.edit_message.html.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.portal_settings.email_notifications.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.shopping.configuration.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.wiki.edit.creole.jsp=ckeditor_creole editor.wysiwyg.portal-web.docroot.html.portlet.wiki.edit.html.jsp=ckeditor editor.wysiwyg.portal-web.docroot.html.portlet.wiki.edit.mediawiki.jsp=simple Thank you for your support!
          Hide
          Peter Borkuti added a comment - - edited

          workaround for CKEditor removing empty span and i tags

          A hook can be created for html\js\editor\ckeditor\ckconfig.jsp file. It's content should be modified in this way:

          ;window['<%= HtmlUtil.escapeJS(name) %>Config'] = function() {
          	var ckEditor = CKEDITOR.instances['<%= HtmlUtil.escapeJS(name) %>'];
          
                  // -----------------------------------------
                  // CODE TO BE INSERTED HERE
                  // -----------------------------------------
                  // allow span tags to be empty
          	CKEDITOR.dtd.$removeEmpty.span = 0;
          	// allow i tags to be empty
          	CKEDITOR.dtd.$removeEmpty['i'] = false
                  // -----------------------------------------
                  // INSERTED CODE END
                  // -----------------------------------------
          
          	if (!CKEDITOR.stylesSet.get('liferayStyles')) {
          		CKEDITOR.addStylesSet(
          

          master

          On master, we have a modules\frontend\frontend-editors-web\src\META-INF\resources\html\editors\ckeditor_diffs\ckconfig-ext.jsp file, with which the modification is far more easier than on 6.2.x.

          resources

          http://ckeditor.com/forums/Support/Prevent-removal-of-empty-span-tags
          http://stackoverflow.com/questions/18250404/ckeditor-strips-i-tag

          Show
          Peter Borkuti added a comment - - edited workaround for CKEditor removing empty span and i tags A hook can be created for html\js\editor\ckeditor\ckconfig.jsp file. It's content should be modified in this way: ;window['<%= HtmlUtil.escapeJS(name) %>Config'] = function() { var ckEditor = CKEDITOR.instances['<%= HtmlUtil.escapeJS(name) %>']; // ----------------------------------------- // CODE TO BE INSERTED HERE // ----------------------------------------- // allow span tags to be empty CKEDITOR.dtd.$removeEmpty.span = 0; // allow i tags to be empty CKEDITOR.dtd.$removeEmpty['i'] = false // ----------------------------------------- // INSERTED CODE END // ----------------------------------------- if (!CKEDITOR.stylesSet.get('liferayStyles')) { CKEDITOR.addStylesSet( master On master, we have a modules\frontend\frontend-editors-web\src\META-INF\resources\html\editors\ckeditor_diffs\ckconfig-ext.jsp file, with which the modification is far more easier than on 6.2.x. resources http://ckeditor.com/forums/Support/Prevent-removal-of-empty-span-tags http://stackoverflow.com/questions/18250404/ckeditor-strips-i-tag

            People

            • Votes:
              1 Vote for this issue
              Watchers:
              4 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved:
                Days since last comment:
                8 weeks, 6 days ago

                Development

                  Structure Helper Panel