{"id":2497,"date":"2021-12-13T10:25:52","date_gmt":"2021-12-13T10:25:52","guid":{"rendered":"https:\/\/helptest.mainbrainer.com\/knowledge-base\/landing-page-text-widget\/"},"modified":"2022-06-09T10:09:56","modified_gmt":"2022-06-09T10:09:56","slug":"landing-page-text-widget","status":"publish","type":"ht_kb","link":"https:\/\/www.mainbrainer.com\/hc\/landing-pages\/builder\/text\/","title":{"rendered":"Landing Page Text Widget"},"content":{"rendered":"<div class=\"aricle_container\">\n<p>The <strong>text widget<\/strong> helps you add text <em>(including special characters and emoticons)<\/em> to your landing page and format it as per your design needs.<\/p>\n<div style=\"padding: 14px 0;\"><\/div>\n<h2>How to Use a Text Widget in a Landing Page?<\/h2>\n<div style=\"padding: 14px 0;\"><\/div>\n<h3>Step 1 &#8211;&nbsp;Navigate to the Landing Page Builder<\/h3>\n<p>Use the <strong>Main Menu<\/strong> on the left to create a <strong>landing page<\/strong> and subsequently <a href=\"\/hc\/landing-pages\/builder\/create\/\" target=\"_blank\" rel=\"noopener noreferrer\">navigate to the Landing Page Builder<\/a>.<\/p>\n<div style=\"padding: 14px 0;\"><\/div>\n<h3>Step 2 &#8211;&nbsp;Add a Text Widget to Your Landing Page<\/h3>\n<p>The blank area on the left is the <strong>work area<\/strong> where you design your landing page, and the area on the right is the tools area where all the available design elements are displayed as <a href=\"\/hc\/landing-pages\/builder\/widgets\/\" target=\"_blank\" rel=\"noopener noreferrer\">widgets<\/a>.<\/p>\n<p>In order to add text to your landing page, drag and drop the <strong>text widget<\/strong> to the work area <em>(as highlighted in the screenshot below)<\/em>.<\/p>\n<div style=\"padding: 14px 0;\"><\/div>\n<p><img decoding=\"async\" class=\"alignnone wp-image-1840\" title=\"Landing page text widget\" src=\"https:\/\/www.mainbrainer.com\/hc\/wp-content\/uploads\/2021\/11\/landing-page-text-widget.png\" alt=\"Landing page builder drag and drop text widget\" width=\"640\"><\/p>\n<div style=\"padding: 24px 0;\"><\/div>\n<h3>Step 3 &#8211;&nbsp;Type in the Relevant Text<\/h3>\n<p>As you drop the widget into the work area, the widget <strong>S<\/strong><strong>ettings&nbsp;<\/strong>are displayed on the right <em>(as highlighted in the screenshot below)<\/em>.<\/p>\n<div style=\"padding: 14px 0;\"><\/div>\n<p><img decoding=\"async\" class=\"alignnone wp-image-1842\" title=\"Landing page text settings\" src=\"https:\/\/www.mainbrainer.com\/hc\/wp-content\/uploads\/2021\/11\/landing-page-text-editor.png\" alt=\"Landing page text widget settings highlighted\" width=\"640\"><\/p>\n<div style=\"padding: 20px 0;\"><\/div>\n<p>As highlighted in the screenshot above, type in the text in the typing area. All the formatting options that you might need, for example, text color, size, style, background color, alignment, etc., are available as different text editor tools.<\/p>\n<h4>Here\u2019s a closer look at our text editor tools:<\/h4>\n<div style=\"padding: 14px 0;\"><\/div>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-1843 size-full\" title=\"Landing page text editor\" src=\"https:\/\/www.mainbrainer.com\/hc\/wp-content\/uploads\/2021\/11\/landing-page-text-editor-menus.png\" alt=\"Landing page text widget. Text editor settings\" width=\"506\" height=\"122\"><\/p>\n<div style=\"padding: 24px 0;\"><\/div>\n<p><strong>3.1 Tools in the first row:<\/strong><\/p>\n<ul style=\"list-style-type: circle;\">\n<li>Source (to toggle the text editor view from visual to code and vice-a-versa)<\/li>\n<li>Bold<\/li>\n<li>Italic<\/li>\n<li>Underline<\/li>\n<li>Numeric Bullets<\/li>\n<li>Symbol Bullets<\/li>\n<li>Left, Center, Right, and Justified aligning<\/li>\n<li>Text direction from left-to-right and right-to-left<\/li>\n<\/ul>\n<div style=\"padding: 14px 0;\"><\/div>\n<p><strong>3.2 Tools in the second row<\/strong><\/p>\n<ul style=\"list-style-type: circle;\">\n<li>Link (hyperlink options) and Unlink<\/li>\n<li>Anchor<\/li>\n<li>Inserting Image<\/li>\n<li>Text formatting styles dropdown<\/li>\n<li>Personalize tags (like First Name, Last Name, Email, etc)<\/li>\n<li>Normal, Paragraph, Heading &amp; more formatting styles<\/li>\n<\/ul>\n<div style=\"padding: 14px 0;\"><\/div>\n<p><strong>3.3 Tools in the third row<\/strong><\/p>\n<ul style=\"list-style-type: circle;\">\n<li>Font<\/li>\n<li>Font-size<\/li>\n<li>Font color<\/li>\n<li>Font background color<\/li>\n<\/ul>\n<div style=\"padding: 14px 0;\"><\/div>\n<h3>Step 4 &#8211;&nbsp;Style your Text widget<\/h3>\n<p>If you wish to change the color of the entire text added in the widget, you can do so by using the <strong>Widget Background Color<\/strong> field under the <strong>Style tab<\/strong>.<\/p>\n<div style=\"padding: 14px 0;\"><\/div>\n<p><img decoding=\"async\" class=\"alignnone wp-image-1844\" title=\"Landing page text style\" src=\"https:\/\/www.mainbrainer.com\/hc\/wp-content\/uploads\/2021\/11\/landing-page-text-styling.png\" alt=\"Landing page text widget. The style tab is highlighted\" width=\"640\"><\/p>\n<div style=\"padding: 20px 0;\"><\/div>\n<p>Click <strong>Save&nbsp;<\/strong>and that\u2019s it!<\/p>\n<p>You have successfully added a text block to your landing page!<\/p>\n<p>Let&#8217;s proceed, and have a look at how to add images to a landing page using the <a href=\"\/hc\/landing-pages\/builder\/image\/\" target=\"_blank\" rel=\"noopener\">image widget<\/a>!<\/p>\n<\/div>\n<style>\n  .aricle_container p,.aricle_container li{color: rgba(0,0,0,.8)!important}  .aricle_container span{color:#0070ba!important}.aricle_container li,.aricle_container blockquote{font-size:18px!important;    font-weight: 400;<br \/>\n  }<br \/>\n<\/style>\n","protected":false},"excerpt":{"rendered":"<p>The text widget helps you add text (including special characters and emoticons) to your landing page.<\/p>\n","protected":false},"author":1,"comment_status":"open","ping_status":"open","template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"footnotes":""},"ht-kb-category":[214],"ht-kb-tag":[],"class_list":["post-2497","ht_kb","type-ht_kb","status-publish","format-standard","hentry","ht_kb_category-landing-page-builder"],"_links":{"self":[{"href":"https:\/\/www.mainbrainer.com\/hc\/wp-json\/wp\/v2\/ht-kb\/2497","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.mainbrainer.com\/hc\/wp-json\/wp\/v2\/ht-kb"}],"about":[{"href":"https:\/\/www.mainbrainer.com\/hc\/wp-json\/wp\/v2\/types\/ht_kb"}],"author":[{"embeddable":true,"href":"https:\/\/www.mainbrainer.com\/hc\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.mainbrainer.com\/hc\/wp-json\/wp\/v2\/comments?post=2497"}],"version-history":[{"count":9,"href":"https:\/\/www.mainbrainer.com\/hc\/wp-json\/wp\/v2\/ht-kb\/2497\/revisions"}],"predecessor-version":[{"id":9290,"href":"https:\/\/www.mainbrainer.com\/hc\/wp-json\/wp\/v2\/ht-kb\/2497\/revisions\/9290"}],"wp:attachment":[{"href":"https:\/\/www.mainbrainer.com\/hc\/wp-json\/wp\/v2\/media?parent=2497"}],"wp:term":[{"taxonomy":"ht_kb_category","embeddable":true,"href":"https:\/\/www.mainbrainer.com\/hc\/wp-json\/wp\/v2\/ht-kb-category?post=2497"},{"taxonomy":"ht_kb_tag","embeddable":true,"href":"https:\/\/www.mainbrainer.com\/hc\/wp-json\/wp\/v2\/ht-kb-tag?post=2497"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}