{"id":17392,"date":"2019-04-29T07:35:01","date_gmt":"2019-04-29T07:35:01","guid":{"rendered":"https:\/\/www.hostinger.com\/tutorials\/?p=17392"},"modified":"2025-12-02T15:35:30","modified_gmt":"2025-12-02T15:35:30","slug":"wordpress-text-editor","status":"publish","type":"post","link":"\/ca\/tutorials\/wordpress-text-editor\/","title":{"rendered":"A beginner\u2019s guide to WordPress text editor"},"content":{"rendered":"<p><span style=\"font-weight: 400\">If you&rsquo;re new to WordPress, you might be wondering what the WordPress text editor is for and how it&rsquo;s different from its visual counterpart.<\/span><\/p><p><span style=\"font-weight: 400\">The text editor displays the content in <\/span><a href=\"\/ca\/tutorials\/what-is-html\/\" target=\"_blank\" rel=\"noreferrer noopener\"><span style=\"font-weight: 400\">HTML<\/span><\/a><span style=\"font-weight: 400\">, which allows for extra customization options to those familiar with the language. It also offers features for faster <a href=\"\/ca\/tutorials\/edit-html-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">HTML editing<\/a>, such as buttons to insert frequently used formatting code.<\/span><\/p><p><span style=\"font-weight: 400\">This article will explain how to use the WordPress text editor and suggest alternative text editor plugins if you&rsquo;re not satisfied with the default option.<\/span><\/p><p class=\"has-text-align-center\"><a href=\"https:\/\/assets.hostinger.com\/content\/tutorials\/pdf\/Mega-WordPress-Cheat-EN.pdf\" target=\"_blank\" rel=\"noopener\">Download all-in-one WordPress cheat sheet<\/a><\/p><h2 class=\"wp-block-heading\" id=\"h-wordpress-text-editor-vs-visual-editor\"><span style=\"font-weight: 400\">WordPress Text Editor vs. Visual Editor<\/span><\/h2><p><span style=\"font-weight: 400\">The WordPress text editor, also known as the HTML editor, generates and displays the HTML code of a post or page, which is very useful for plain text formatting.<\/span><\/p><p><span style=\"font-weight: 400\">When customizing with the text editor, users can also fix unwanted styling and formatting changes that WordPress might automatically apply.&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">However, it&rsquo;s crucial to note that if you want to customize your WordPress website using the text editor, HTML knowledge is essential.&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">In comparison, the visual editor is based on the <a href=\"\/ca\/tutorials\/wysiwyg-web-builders\/\">What You See Is What You Get (WYSIWYG)<\/a> principle. This means that the content&rsquo;s design and styling are displayed in the exact way it will look when published.<\/span><\/p><p><span style=\"font-weight: 400\">The newest version of WordPress uses <\/span><a href=\"\/ca\/tutorials\/gutenberg-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\"><span style=\"font-weight: 400\">Gutenberg<\/span><\/a><span style=\"font-weight: 400\"> as its visual editor. It implements the drag-and-drop function, comes with a defined layout, and offers a content block system with an intuitive toolbar.&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">These features mean it&rsquo;s very easy to use, making it an excellent choice for the average user.&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">While it&rsquo;s possible to only use one type of editor, both the visual and text WordPress editors can create a much more neat and professional blog post when used side by side.&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">To access the Gutenberg text editor, click the <\/span><b>three dots (Options) <\/b><span style=\"font-weight: 400\">at the top right corner of the screen, then select <\/span><b>Code editor<\/b><span style=\"font-weight: 400\">.<\/span><\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"\/ca\/tutorials\/wp-content\/uploads\/sites\/2\/2019\/04\/code-editor-selection-gutenberg.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1338\" height=\"654\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/2\/2019\/04\/code-editor-selection-gutenberg.png\/public\" alt=\"The Code editor button in the WordPress Gutenberg editor\" class=\"wp-image-30463\"  sizes=\"auto, (max-width: 1338px) 100vw, 1338px\" \/><\/a><\/figure><\/div><p><span style=\"font-weight: 400\">If you&rsquo;re using the <a href=\"\/ca\/tutorials\/wordpress-classic-editor\/\">WordPress classic editor<\/a>, simply click the <\/span><b>Text <\/b><span style=\"font-weight: 400\">tab at the toolbar to open the text editor.<\/span><\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"\/ca\/tutorials\/wp-content\/uploads\/sites\/2\/2019\/04\/classic-editor-text-tab.png\"><img loading=\"lazy\" decoding=\"async\" width=\"838\" height=\"297\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/2\/2019\/04\/classic-editor-text-tab.png\/public\" alt=\"The Text tab in the WordPress classic editor\" class=\"wp-image-30464\"  sizes=\"auto, (max-width: 838px) 100vw, 838px\" \/><\/a><\/figure><\/div><h2 class=\"wp-block-heading\" id=\"h-wordpress-text-editor-and-html-tags-nbsp-nbsp\"><span style=\"font-weight: 400\">WordPress Text Editor and HTML Tags&nbsp;&nbsp;<\/span><\/h2><p><span style=\"font-weight: 400\">As mentioned before, to edit a post or page using the text editor, some basic knowledge of HTML is required.<\/span><\/p><p><span style=\"font-weight: 400\">An HTML document is made up of a set of HTML elements or tags when in text mode. Take note that an HTML tag consists of an opening and closing tag with the following syntax:<\/span><\/p><pre class=\"wp-block-preformatted\"><span style=\"font-weight: 400\">&lt;tag&gt;&lt;\/tag&gt;<\/span><\/pre><p><span style=\"font-weight: 400\">The content is added in between the tags. As an example:<\/span><\/p><pre class=\"wp-block-preformatted\"><span style=\"font-weight: 400\">&lt;tag&gt;write sentence here&lt;\/tag&gt;<\/span><\/pre><p><span style=\"font-weight: 400\">Furthermore, there are two types of HTML tags in text mode &ndash; block-level and inline.<\/span><\/p><p><span style=\"font-weight: 400\">Block-level elements start at a new line and occupy the full horizontal space of the page. The vertical space is equal to the height of the content.&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">The three block-level tags that every HTML documents should contain are:<\/span><\/p><ul class=\"wp-block-list\">\n<li><strong>HTML <\/strong>&ndash; &lt;html&gt;&lt;\/html&gt;, encloses an HTML page<\/li>\n\n\n\n<li><strong>Head <\/strong>&ndash; &lt;head&gt;&lt;\/head&gt;, holds meta information<\/li>\n\n\n\n<li><strong>Body<\/strong> &ndash; &lt;body&gt;&lt;\/body&gt;, wraps all content within the page<\/li>\n<\/ul><p><span style=\"font-weight: 400\">Here are some other examples of block-level tags:<\/span><\/p><ul class=\"wp-block-list\">\n<li><strong>Headings<\/strong> &ndash; &lt;h1&gt;&lt;\/h1&gt;, &lt;h2&gt;\/&lt;h2&gt;, &lt;h3&gt;&lt;\/h3&gt;, and so on<\/li>\n\n\n\n<li><strong>Paragraph<\/strong> &ndash; &lt;p&gt;&lt;\/p&gt;<\/li>\n\n\n\n<li><strong>Table<\/strong> &ndash; &lt;table&gt;&lt;\/table&gt;<\/li>\n\n\n\n<li><strong>Footer<\/strong> &ndash; &lt;footer&gt;&lt;\/footer&gt;<\/li>\n\n\n\n<li><strong>Ordered list<\/strong> &ndash; &lt;ol&gt;&lt;\/ol&gt;<\/li>\n<\/ul><p><span style=\"font-weight: 400\">An inline tag doesn&rsquo;t start a new line and takes only as much space as necessary. It formats the content inside the block-level elements.&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">Several of the common ones are:<\/span><\/p><ul class=\"wp-block-list\">\n<li><strong>Bold <\/strong>&ndash; &lt;strong&gt;&lt;\/strong&gt;<\/li>\n\n\n\n<li><strong>Emphasis <\/strong>&ndash; &lt;em&gt;&lt;\/em&gt;<\/li>\n\n\n\n<li><strong>Anchor <\/strong>&ndash; &lt;a&gt;&lt;\/a&gt;<\/li>\n\n\n\n<li><strong>Inline frame<\/strong> &ndash; &lt;iframe&gt;&lt;\/iframe&gt;<\/li>\n\n\n\n<li><strong>Code text<\/strong> &ndash; &lt;code&gt;&lt;\/code&gt;<\/li>\n<\/ul><p><span style=\"font-weight: 400\">Here&rsquo;s a simple example of an HTML document using both the block-level and inline tags:<\/span><\/p><pre class=\"wp-block-preformatted\"><span style=\"font-weight: 400\">&lt;html&gt;<\/span>\n\n<span style=\"font-weight: 400\">&nbsp;&nbsp;&nbsp;&lt;head&gt;<\/span>\n\n<span style=\"font-weight: 400\">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;h1&gt;My first HTML document&lt;\/h1&gt;<\/span>\n\n<span style=\"font-weight: 400\">&nbsp;&nbsp;&nbsp;&lt;\/head&gt;<\/span>\n\n<span style=\"font-weight: 400\">&nbsp;&nbsp;&nbsp;&lt;body&gt;<\/span>\n\n<span style=\"font-weight: 400\">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;p&gt;&lt;strong&gt;Hello world!&lt;\/strong&gt;&lt;\/p&gt;<\/span>\n\n<span style=\"font-weight: 400\">&nbsp;&nbsp;&nbsp;&lt;\/body&gt;<\/span>\n\n<span style=\"font-weight: 400\">&lt;\/html&gt;<\/span><\/pre><p><span style=\"font-weight: 400\">When editing your WordPress website using the HTML text editor, make sure to format the tags and code correctly. You might end up with messy pages and posts if you do this step wrong.&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">Feel free to download our <\/span><a href=\"\/ca\/tutorials\/html-cheat-sheet\/\" target=\"_blank\" rel=\"noreferrer noopener\"><b>HTML Cheat Sheet<\/b><\/a><span style=\"font-weight: 400\"> file for reference.&nbsp;<\/span><\/p><p>        <div class=\"protip\">\n            <div class=\"protip__heading\">\n                <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                    <path d=\"M1.49234 23.5024C1.23229 23.5024 0.972242 23.4024 0.782206 23.2123C0.562165 22.9923 0.452144 22.6822 0.502153 22.3722C0.562165 21.9221 1.14227 17.9113 3.00262 16.351C3.63274 15.8209 4.43289 15.5509 5.26305 15.5609C6.09321 15.5909 6.87335 15.9109 7.47347 16.4911C8.6937 17.6913 8.76371 19.6717 7.6435 20.9919C6.0832 22.8523 2.08245 23.4324 1.63237 23.4924C1.59236 23.4924 1.54235 23.4924 1.50234 23.4924L1.49234 23.5024ZM5.16303 17.5613C4.84297 17.5613 4.53291 17.6713 4.29287 17.8813C3.60274 18.4614 3.07264 19.9317 2.75258 21.242C4.06282 20.9219 5.5331 20.3918 6.11321 19.7017C6.55329 19.1716 6.54329 18.3814 6.0832 17.9213C5.85316 17.7013 5.5431 17.5713 5.20304 17.5613C5.19304 17.5613 5.17303 17.5613 5.16303 17.5613ZM11.7243 21.8821C11.4942 21.8821 11.2642 21.8021 11.0841 21.652C10.8541 21.462 10.7241 21.1819 10.7241 20.8819V15.9109L8.08358 13.2705H3.11264C2.81259 13.2705 2.53254 13.1404 2.3425 12.9104C2.15246 12.6803 2.07245 12.3803 2.12246 12.0902C2.19247 11.7102 2.84259 8.36953 4.70294 7.12929C6.33325 6.04909 8.96375 6.49918 10.244 6.80923C11.5442 4.96889 13.2546 3.4286 15.2349 2.33839C17.4553 1.11816 19.9858 0.518051 22.4963 0.498047C23.0464 0.498047 23.4865 0.948132 23.4865 1.49824C23.4865 5.0389 22.3763 9.97983 17.1753 13.7605C17.4853 15.0408 17.9354 17.6613 16.8552 19.2816C15.615 21.1419 12.2744 21.7921 11.8943 21.8621C11.8343 21.8721 11.7743 21.8821 11.7143 21.8821H11.7243ZM12.7245 16.181V19.6016C13.7146 19.2916 14.7948 18.7915 15.2049 18.1814C15.675 17.4812 15.605 16.091 15.385 14.9008C14.5248 15.3808 13.6346 15.8109 12.7245 16.181ZM9.66388 12.0302L11.9643 14.3307C13.1845 13.8306 14.3648 13.2204 15.485 12.5103C19.9358 9.51974 21.2361 5.60901 21.4561 2.53843C19.6157 2.67846 17.8254 3.20856 16.2051 4.09872C14.2847 5.14892 12.6544 6.68921 11.4942 8.54956C10.7841 9.65977 10.174 10.82 9.66388 12.0302ZM4.39289 11.2701H7.81353C8.1936 10.3599 8.63368 9.46974 9.11377 8.60957C7.92355 8.38953 6.51329 8.31952 5.81315 8.78961C5.19304 9.19968 4.70294 10.3099 4.39289 11.2701Z\" fill=\"#673DE6\"\/>\n                <\/svg>\n                <p class=\"protip__title\">\n                    Pro Tip                <\/p>\n            <\/div>\n            <p class=\"protip__content\">Check out our tutorial about <a href=\"\/ca\/tutorials\/wordpress-vs-html\/\">WordPress vs HTML<\/a> to understand the difference between them and which one to choose when creating your website.<\/p>\n                    <\/div>\n        \n\n\n\n<\/p><h2 class=\"wp-block-heading\" id=\"h-using-quicktags-in-wordpress-text-editor\"><span style=\"font-weight: 400\">Using Quicktags In WordPress Text Editor<\/span><\/h2><p><span style=\"font-weight: 400\">A quicktag is a button that adds HTML tags to your post, meaning you don&rsquo;t have to manually type them in the text mode every time. For example, the <\/span><b>b<\/b><span style=\"font-weight: 400\"> button<\/span> <span style=\"font-weight: 400\">adds the bold opening and closing tags. These can be utilized in the Classic text editor.<\/span><\/p><p><span style=\"font-weight: 400\">By default, the WordPress text editor provides 12 quicktags, which include the bold, emphasized text, unordered\/ordered list, and blockquote.<\/span><\/p><p><span style=\"font-weight: 400\">Since you might need quicktags for other elements, <\/span>consider using a quicktag plugin for added functionality. <\/p><p><span style=\"font-weight: 400\">Keep in mind that the Gutenberg code editor doesn&rsquo;t use quicktags at all.&nbsp;&nbsp;&nbsp;&nbsp;<\/span><\/p><h2 class=\"wp-block-heading\" id=\"h-wordpress-text-editor-alternatives-and-tools\"><span style=\"font-weight: 400\">WordPress Text Editor Alternatives and Tools<\/span><\/h2><p><span style=\"font-weight: 400\">WordPress text editors can be complicated to understand and use, while the Gutenberg editor can seem limited when it comes to customization options.&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">If neither of these editor choices provides you with the look you&rsquo;re after, it can be a good idea to look into other alternatives.<\/span><\/p><p><span style=\"font-weight: 400\">Here is a list of <a href=\"\/ca\/tutorials\/best-wordpress-plugins\/\" target=\"_blank\" rel=\"noreferrer noopener\">our recommended plugins<\/a> that can help you extend the WordPress editors&rsquo; functionality.&nbsp;<\/span><\/p><h3 class=\"wp-block-heading\" id=\"h-1-ultimate-blocks\"><span style=\"font-weight: 400\">1. <\/span><a href=\"https:\/\/wordpress.org\/plugins\/ultimate-blocks\/\" target=\"_blank\" rel=\"noreferrer noopener\"><span style=\"font-weight: 400\">Ultimate Blocks<\/span><\/a><\/h3><div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"\/ca\/tutorials\/wp-content\/uploads\/sites\/2\/2019\/04\/ultimate-blocks-plugin-banner.png\"><img loading=\"lazy\" decoding=\"async\" width=\"772\" height=\"244\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/2\/2019\/04\/ultimate-blocks-plugin-banner.png\/public\" alt=\"Ultimate Blocks plugin banner\" class=\"wp-image-30468\"  sizes=\"auto, (max-width: 772px) 100vw, 772px\" \/><\/a><\/figure><\/div><p><b>Plugin Stats:<\/b><\/p><ul class=\"wp-block-list\">\n<li><strong>Downloads<\/strong>: Over 20,000<\/li>\n\n\n\n<li><strong>Rating<\/strong>: 4.9\/5<\/li>\n\n\n\n<li><strong>Notable Features<\/strong>: Provides extra content blocks for Gutenberg<\/li>\n\n\n\n<li><strong>Best Suited For<\/strong>: Blogging projects or content-based website owners<\/li>\n\n\n\n<li><strong>Price<\/strong>: Free<\/li>\n<\/ul><p><span style=\"font-weight: 400\">Ultimate Blocks is one of the simplest plugins to get started with. It comes with 20 additional blogging and content-related settings that you can add to the Gutenberg editor.&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">For example, <\/span><b>Table of Contents<\/b><span style=\"font-weight: 400\">, <\/span><b>Countdown<\/b><span style=\"font-weight: 400\">, <\/span><b>Content Filter<\/b><span style=\"font-weight: 400\">, and <\/span><b>Testimonial <\/b><span style=\"font-weight: 400\">are some of the unique elements that can be used for your projects. These elements are also compatible with most WordPress themes and other WordPress plugins.<\/span><\/p><p><span style=\"font-weight: 400\">The advanced blocks provided by Gutenberg receive new customization options as well. The Button block gets more size, style, and button icons, and the Social Share block will have icons for LinkedIn, Pinterest, and Reddit.<\/span><\/p><p><span style=\"font-weight: 400\">If you ever need help with using the Ultimate Blocks plugin, feel free to visit the <\/span><a href=\"https:\/\/community.ultimateblocks.com\/\" target=\"_blank\" rel=\"noreferrer noopener\"><span style=\"font-weight: 400\">support forum<\/span><\/a><span style=\"font-weight: 400\"> or their <\/span><a href=\"https:\/\/www.facebook.com\/groups\/ultimateblocks\/\" target=\"_blank\" rel=\"noreferrer noopener\"><span style=\"font-weight: 400\">Facebook group<\/span><\/a><span style=\"font-weight: 400\">.<\/span><\/p><h3 class=\"wp-block-heading\" id=\"h-2-wp-table-builder\"><span style=\"font-weight: 400\">2. <\/span><a href=\"https:\/\/wordpress.org\/plugins\/wp-table-builder\/\" target=\"_blank\" rel=\"noreferrer noopener\"><span style=\"font-weight: 400\">WP Table Builder<\/span><\/a><\/h3><div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"\/ca\/tutorials\/wp-content\/uploads\/sites\/2\/2019\/04\/wp-table-builder-plugin-banner.png\"><img loading=\"lazy\" decoding=\"async\" width=\"772\" height=\"250\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/2\/2019\/04\/wp-table-builder-plugin-banner.png\/public\" alt=\"WP Table Builder plugin banner\" class=\"wp-image-30469\"  sizes=\"auto, (max-width: 772px) 100vw, 772px\" \/><\/a><\/figure><\/div><p><b>Plugin Stats:<\/b><\/p><ul class=\"wp-block-list\">\n<li><strong>Downloads<\/strong>: 30,000+<\/li>\n\n\n\n<li><strong>Rating<\/strong>:&nbsp; 4.9\/5<\/li>\n\n\n\n<li><strong>Notable Features<\/strong>: User-friendly editor and responsiveness settings<\/li>\n\n\n\n<li><strong>Best Suited For<\/strong>: People-managing, review, and business websites<\/li>\n\n\n\n<li><strong>Price<\/strong>: Freemium<\/li>\n<\/ul><p><span style=\"font-weight: 400\">WP Table Builder is one of the best plugins for creating tables for your WordPress website. It introduces drag-and-drop functionality and a more intuitive interface. With these features, creating various tables for prices, multiple comparisons, and other lists will be quick and easy.&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">There are seven ways users can add to a table &ndash; by using <\/span><b>Text<\/b><span style=\"font-weight: 400\">,<\/span><b> Image<\/b><span style=\"font-weight: 400\">, <\/span><b>List, Button<\/b><span style=\"font-weight: 400\">, <\/span><b>Star Rating<\/b><span style=\"font-weight: 400\">, <\/span><b>Custom HTML<\/b><span style=\"font-weight: 400\">, and <\/span><b>Shortcode<\/b><span style=\"font-weight: 400\">. Each element has its own customization options that can further improve your posts.<\/span><\/p><p><span style=\"font-weight: 400\">The common settings of cell management let you add new rows\/columns and merge\/split cells. Furthermore, you can import premade tables from <\/span><b>.CSV<\/b><span style=\"font-weight: 400\"> and <\/span><b>.XML<\/b><span style=\"font-weight: 400\"> files or export those you created with the plugin.<\/span><\/p><p><span style=\"font-weight: 400\">When it comes to responsiveness, WP Table Builder has the option to edit how a table will look on mobile, tablet, and desktop screens. Not only does this feature allow you to cater to a larger audience, but it also allows you to adapt your website to a variety of different purposes.<\/span><\/p><p><span style=\"font-weight: 400\">To get additional features, such as table templates, full column\/row duplication, and border colors, you will need to upgrade. WP Table Builder&rsquo;s <\/span><a href=\"https:\/\/wptablebuilder.com\/\" target=\"_blank\" rel=\"noreferrer noopener\"><span style=\"font-weight: 400\">premium version<\/span><\/a><span style=\"font-weight: 400\"> starts at <\/span><b>$39.99\/year<\/b><span style=\"font-weight: 400\">, including plugin updates and priority support from the developer team.<\/span><\/p><p><span style=\"font-weight: 400\">The plugin also has a <\/span><a href=\"https:\/\/wptablebuilder.com\/community\/\" target=\"_blank\" rel=\"noreferrer noopener\"><span style=\"font-weight: 400\">support forum<\/span><\/a><span style=\"font-weight: 400\"> if you&rsquo;d rather find the solution to your problem yourself.<\/span><\/p><h3 class=\"wp-block-heading\" id=\"h-3-content-manager-for-wordpress\"><span style=\"font-weight: 400\">3. <\/span><a href=\"https:\/\/codecanyon.net\/item\/content-manager-for-wordpress\/7431829\" target=\"_blank\" rel=\"noreferrer noopener\"><span style=\"font-weight: 400\">Content Manager for WordPress<\/span><\/a><\/h3><div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"\/ca\/tutorials\/wp-content\/uploads\/sites\/2\/2019\/04\/content-manager-for-wordpress-plugin-banner.png\"><img loading=\"lazy\" decoding=\"async\" width=\"590\" height=\"300\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/2\/2019\/04\/content-manager-for-wordpress-plugin-banner.png\/public\" alt=\"Content manager for WordPress plugin banner\" class=\"wp-image-30471\"  sizes=\"auto, (max-width: 590px) 100vw, 590px\" \/><\/a><\/figure><\/div><p><b>Plugin Stats:<\/b><\/p><ul class=\"wp-block-list\">\n<li><strong>Downloads<\/strong>: 800+<\/li>\n\n\n\n<li><strong>Rating<\/strong>: 4.6\/5<\/li>\n\n\n\n<li><strong>Notable Features<\/strong>: Front-end grid editor<\/li>\n\n\n\n<li><strong>Best Suited For<\/strong>: People who want complex functionality without using HTML<\/li>\n\n\n\n<li><strong>Price<\/strong>: <strong>$34\/regular license<\/strong> (<strong>$130\/extended license<\/strong>)<\/li>\n<\/ul><p><span style=\"font-weight: 400\">Content Manager for WordPress simplifies the creation of complex pages and posts. It lets you edit and arrange page layouts from the front-end of your WordPress site.&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">With its drag-and-drop system and a grid manager, you can have a beautifully designed page in no time. The layouts will be responsive as well, so visitors can enjoy your site on their mobile devices.&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">Content Manager for WordPress comes with over 50 ready-to-use element shortcodes. Each shortcode has its own user-friendly interface and customization options.&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">Therefore, adding buttons, social icons, and galleries anywhere on your website won&rsquo;t be a hassle. Furthermore, animated shortcodes for flip boxes, progress bars, and sliders are also available.&nbsp;&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">On top of that, this plugin comes with blog and portfolio templates. It&rsquo;s also translatable to any language using <\/span><b>.PO<\/b><span style=\"font-weight: 400\"> and <\/span><b>.MO<\/b><span style=\"font-weight: 400\"> files.&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">The plugin integrates well with WordPress and uses <\/span><a href=\"\/ca\/tutorials\/what-is-ajax\/\" target=\"_blank\" rel=\"noreferrer noopener\"><span style=\"font-weight: 400\">AJAX<\/span><\/a><span style=\"font-weight: 400\">. Once it&rsquo;s installed for a one-off payment of <\/span><b>$39\/regular license<\/b><span style=\"font-weight: 400\">, you will find a button on the WordPress editor to add the shortcodes.&nbsp;&nbsp;<\/span><\/p><figure class=\"wp-block-image size-large\"><a class=\"hgr-tutorials-cta hgr-tutorials-cta-wordpress-hosting\" href=\"\/ca\/wordpress-hosting\" target=\"_blank\" rel=\"noreferrer noopener\"><img loading=\"lazy\" decoding=\"async\" width=\"2048\" height=\"600\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/2\/2024\/06\/New-WP_in-text-banner.png\/w=1024,h=1024,fit=scale-down\" alt=\"\" class=\"wp-image-111781\"  sizes=\"auto, (max-width: 2048px) 100vw, 2048px\" \/><\/a><\/figure><h2 class=\"wp-block-heading\" id=\"h-conclusion\"><span style=\"font-weight: 400\">Conclusion<\/span><\/h2><p><span style=\"font-weight: 400\">To summarize, the WordPress text editor is used for editing the HTML code of posts and pages. It&rsquo;s handy for adding extra styling changes and fixing various formatting issues.&nbsp;&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">While using the WordPress text editor provides you with more customization options, HTML code knowledge is a must.&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">A visual editor, on the other hand, lets you make changes to your website themes and posts without any code. It&rsquo;s effortless to use, as all changes are displayed right as you make them.&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">While this method is beginner-friendly, it&rsquo;s a lot more limited. Meaning, there will not be as many customization options available compared to text editors.<\/span><\/p><p><span style=\"font-weight: 400\">If you&rsquo;re able to use the visual and text editor interchangeably, customizing posts and pages to fit your website style and theme should be easy.&nbsp;<\/span><\/p><p><span style=\"font-weight: 400\">Luckily, there are many different text editors, visual editors, and plugins you can choose from, paid and free. It all comes down to finding the combination that will suit your needs.<\/span><\/p><p>        <div class=\"protip\">\n            <div class=\"protip__heading\">\n                <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                    <path d=\"M1.49234 23.5024C1.23229 23.5024 0.972242 23.4024 0.782206 23.2123C0.562165 22.9923 0.452144 22.6822 0.502153 22.3722C0.562165 21.9221 1.14227 17.9113 3.00262 16.351C3.63274 15.8209 4.43289 15.5509 5.26305 15.5609C6.09321 15.5909 6.87335 15.9109 7.47347 16.4911C8.6937 17.6913 8.76371 19.6717 7.6435 20.9919C6.0832 22.8523 2.08245 23.4324 1.63237 23.4924C1.59236 23.4924 1.54235 23.4924 1.50234 23.4924L1.49234 23.5024ZM5.16303 17.5613C4.84297 17.5613 4.53291 17.6713 4.29287 17.8813C3.60274 18.4614 3.07264 19.9317 2.75258 21.242C4.06282 20.9219 5.5331 20.3918 6.11321 19.7017C6.55329 19.1716 6.54329 18.3814 6.0832 17.9213C5.85316 17.7013 5.5431 17.5713 5.20304 17.5613C5.19304 17.5613 5.17303 17.5613 5.16303 17.5613ZM11.7243 21.8821C11.4942 21.8821 11.2642 21.8021 11.0841 21.652C10.8541 21.462 10.7241 21.1819 10.7241 20.8819V15.9109L8.08358 13.2705H3.11264C2.81259 13.2705 2.53254 13.1404 2.3425 12.9104C2.15246 12.6803 2.07245 12.3803 2.12246 12.0902C2.19247 11.7102 2.84259 8.36953 4.70294 7.12929C6.33325 6.04909 8.96375 6.49918 10.244 6.80923C11.5442 4.96889 13.2546 3.4286 15.2349 2.33839C17.4553 1.11816 19.9858 0.518051 22.4963 0.498047C23.0464 0.498047 23.4865 0.948132 23.4865 1.49824C23.4865 5.0389 22.3763 9.97983 17.1753 13.7605C17.4853 15.0408 17.9354 17.6613 16.8552 19.2816C15.615 21.1419 12.2744 21.7921 11.8943 21.8621C11.8343 21.8721 11.7743 21.8821 11.7143 21.8821H11.7243ZM12.7245 16.181V19.6016C13.7146 19.2916 14.7948 18.7915 15.2049 18.1814C15.675 17.4812 15.605 16.091 15.385 14.9008C14.5248 15.3808 13.6346 15.8109 12.7245 16.181ZM9.66388 12.0302L11.9643 14.3307C13.1845 13.8306 14.3648 13.2204 15.485 12.5103C19.9358 9.51974 21.2361 5.60901 21.4561 2.53843C19.6157 2.67846 17.8254 3.20856 16.2051 4.09872C14.2847 5.14892 12.6544 6.68921 11.4942 8.54956C10.7841 9.65977 10.174 10.82 9.66388 12.0302ZM4.39289 11.2701H7.81353C8.1936 10.3599 8.63368 9.46974 9.11377 8.60957C7.92355 8.38953 6.51329 8.31952 5.81315 8.78961C5.19304 9.19968 4.70294 10.3099 4.39289 11.2701Z\" fill=\"#673DE6\"\/>\n                <\/svg>\n                <p class=\"protip__title\">\n                    Discover Other WordPress Guides                <\/p>\n            <\/div>\n            <p class=\"protip__content\"><a href=\"\/ca\/tutorials\/wordpress\/how-to-add-php-code-to-wordpress-post-or-page\/\">Adding PHP Code to WordPress Post or Page<\/a><br>\n<a href=\"\/ca\/tutorials\/wordpress\/\">WordPress Tutorial<\/a><br>\n<a href=\"\/ca\/tutorials\/what-are-wordpress-hooks\/\">All About WordPress Hooks<\/a><br>\n<a href=\"\/ca\/tutorials\/wordpress-custom-css\/\">How to Add Custom CSS to WordPress<\/a><br>\n<a href=\"\/ca\/tutorials\/wordpress-custom-post-types\/\">How to Create a WordPress Custom Post Type<\/a><br>\n<a href=\"\/ca\/tutorials\/how-to-create-custom-widget-in-wordpress\/\">How to Create WordPress Custom Widgets<\/a><\/p>\n                    <\/div>\n        \n<\/p>\n","protected":false},"excerpt":{"rendered":"<p>If you&rsquo;re new to WordPress, you might be wondering what the WordPress text editor is for and how it&rsquo;s different from its visual counterpart. The text editor displays the content in HTML, which allows for extra customization options to those familiar with the language. It also offers features for faster HTML editing, such as buttons [&#8230;]<\/p>\n<p><a class=\"btn btn-secondary understrap-read-more-link\" href=\"\/ca\/tutorials\/wordpress-text-editor\/\">Read More&#8230;<\/a><\/p>\n","protected":false},"author":113,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"rank_math_title":"A Beginner\u2019s Guide to the WordPress Text Editor","rank_math_description":"Read this article to learn about the WordPress Text Editor, how to access it, and recommended plugins to enhance its functionality","rank_math_focus_keyword":"wordpress text editor","footnotes":""},"categories":[22697,22692],"tags":[],"class_list":["post-17392","post","type-post","status-publish","format-standard","hentry","category-content-creation","category-wordpress"],"hreflangs":[{"locale":"en-US","link":"https:\/\/www.hostinger.com\/tutorials\/wordpress-text-editor","default":0},{"locale":"pt-BR","link":"https:\/\/www.hostinger.com\/br\/tutoriais\/editor-de-texto-wordpress","default":0},{"locale":"en-GB","link":"https:\/\/www.hostinger.com\/uk\/tutorials\/wordpress-text-editor","default":0},{"locale":"en-MY","link":"https:\/\/www.hostinger.com\/my\/tutorials\/wordpress-text-editor","default":0},{"locale":"en-PH","link":"https:\/\/www.hostinger.com\/ph\/tutorials\/wordpress-text-editor","default":0},{"locale":"pt-PT","link":"https:\/\/www.hostinger.com\/pt\/tutoriais\/editor-de-texto-wordpress","default":0},{"locale":"en-IN","link":"https:\/\/www.hostinger.com\/in\/tutorials\/wordpress-text-editor","default":0},{"locale":"en-CA","link":"https:\/\/www.hostinger.com\/ca\/tutorials\/wordpress-text-editor","default":0},{"locale":"en-AU","link":"https:\/\/www.hostinger.com\/au\/tutorials\/wordpress-text-editor","default":0},{"locale":"en-NG","link":"https:\/\/www.hostinger.com\/ng\/tutorials\/wordpress-text-editor","default":0}],"_links":{"self":[{"href":"https:\/\/www.hostinger.com\/ca\/tutorials\/wp-json\/wp\/v2\/posts\/17392","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hostinger.com\/ca\/tutorials\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hostinger.com\/ca\/tutorials\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/ca\/tutorials\/wp-json\/wp\/v2\/users\/113"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/ca\/tutorials\/wp-json\/wp\/v2\/comments?post=17392"}],"version-history":[{"count":37,"href":"https:\/\/www.hostinger.com\/ca\/tutorials\/wp-json\/wp\/v2\/posts\/17392\/revisions"}],"predecessor-version":[{"id":138912,"href":"https:\/\/www.hostinger.com\/ca\/tutorials\/wp-json\/wp\/v2\/posts\/17392\/revisions\/138912"}],"wp:attachment":[{"href":"https:\/\/www.hostinger.com\/ca\/tutorials\/wp-json\/wp\/v2\/media?parent=17392"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hostinger.com\/ca\/tutorials\/wp-json\/wp\/v2\/categories?post=17392"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hostinger.com\/ca\/tutorials\/wp-json\/wp\/v2\/tags?post=17392"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}