{"id":585,"date":"2015-10-23T12:39:39","date_gmt":"2015-10-23T07:09:39","guid":{"rendered":"http:\/\/www.idslogic.com\/blog\/?p=585"},"modified":"2024-06-19T17:07:33","modified_gmt":"2024-06-19T11:37:33","slug":"tips-to-fix-some-issues-in-magento-wysiwyg-editor","status":"publish","type":"post","link":"https:\/\/www.idslogic.com\/blog\/tips-to-fix-some-issues-in-magento-wysiwyg-editor","title":{"rendered":"Tips To Fix Some Issues in Magento WYSIWYG Editor"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_72 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.idslogic.com\/blog\/tips-to-fix-some-issues-in-magento-wysiwyg-editor\/#The_Way_Magento_Handles_Thumbnails\" title=\"The Way Magento Handles Thumbnails:\">The Way Magento Handles Thumbnails:<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.idslogic.com\/blog\/tips-to-fix-some-issues-in-magento-wysiwyg-editor\/#WYSIWYG_Editor_Removes_Indentations\" title=\"WYSIWYG Editor Removes Indentations:\">WYSIWYG Editor Removes Indentations:<\/a><\/li><\/ul><\/nav><\/div>\n<p><span style=\"color: #ff0000;\"><a style=\"color: #ff0000;\" href=\"http:\/\/www.idslogic.com\/magento-ecommerce-development\/\">Magento is the most popular ecommerce development platform<\/a><\/span> of today and is used by many business organizations and enterprises to create their business website. It is because of its numerous features and functionalities that the platform is the first choice of even the developers.<\/p>\n<p>Magento WYSIWYG editor is a great tool that offers the clients to have full control over their web content, allowing them to create and edit pages very easily in a visual way. The tool helps to format the text or HTML code accordingly. However, this is not a simple task as it needs inserting some CSS and Javascript to make the editor function.<\/p>\n<p>I recently came across some issues with the Magento Code Editor that\u00a0magento wysiwyg editor insert image\u00a0 was not working while inserting images by using the WYSIWYG editor .<\/p>\n<p>I hope this post may be a good resource for the developers, so continue reading and learn more about some of the issues with the editor and how you can solve it.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"The_Way_Magento_Handles_Thumbnails\"><\/span><span style=\"color: #ff0000;\"><strong>The Way Magento Handles Thumbnails:<\/strong><\/span><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>There is a bug in the process Magento handles the thumbnails that are displayed when one chooses to insert an image on the page. With clients having 1000s of images, the performance is unacceptable.<\/p>\n<p>The process should be that, once a thumbnail is generated, it should be cached for further use. But the code for this has a problem and Magento re-generates each thumbnail every time they are displayed in the browser. So, the best practice is to create a new module in the local code directory rather than editing the existing Magento code. With this done, you should be able to notice the difference in the performance of the functionality of the module.<\/p>\n<hr \/>\n<h3><span class=\"ez-toc-section\" id=\"WYSIWYG_Editor_Removes_Indentations\"><\/span><span style=\"color: #ff0000;\"><strong>WYSIWYG Editor Removes Indentations:<\/strong><\/span><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>At times, it becomes important to use advanced HTML markup to style a page, but Magento editor removes the indentations every time you save. This makes it difficult to keep a track of the closing tags and it takes a lot of time to look for the correct tags and find the specific spot to place the new code.<\/p>\n<p>To save your time, it is best to plan the page\u2019s layout and build the HTML structure. The advantage of this is that you can have a clear view of what is going and it forces you to choose names carefully for your classes and identifiers. Though you may need to spend some extra time to think about the class and identifiers names, but it saves a lot of your time when other developers work on the code and they can easily identify and locate classes. This makes the workflow faster than before.<\/p>\n<p><span style=\"color: #003366;\"><strong><em>While concluding, I would say that if you spend some time to make some small changes initially, then the performance of the editor will be high and you will not face any annoying problems later.<\/em><\/strong><\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Magento is the most popular ecommerce development platform of today and is used by many business organizations and enterprises to create their business website. It is because of its numerous features and functionalities that the platform is the first choice&#8230;<\/p>\n","protected":false},"author":1,"featured_media":9241,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"gallery","meta":{"footnotes":""},"categories":[171,550],"tags":[691,692,693],"class_list":["post-585","post","type-post","status-publish","format-gallery","has-post-thumbnail","hentry","category-ecommerce-website-development","category-magento","tag-magento-code-editor","tag-magento-wysiwyg","tag-magento-wysiwyg-editor","post_format-post-format-gallery"],"post_mailing_queue_ids":[],"_links":{"self":[{"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/posts\/585","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/comments?post=585"}],"version-history":[{"count":9,"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/posts\/585\/revisions"}],"predecessor-version":[{"id":9242,"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/posts\/585\/revisions\/9242"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/media\/9241"}],"wp:attachment":[{"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/media?parent=585"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/categories?post=585"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/tags?post=585"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}