{"id":3062,"date":"2025-03-23T14:00:21","date_gmt":"2025-03-23T14:00:21","guid":{"rendered":"https:\/\/wptablebuilder.com\/?post_type=docs&#038;p=3062"},"modified":"2025-03-23T14:00:26","modified_gmt":"2025-03-23T14:00:26","password":"","slug":"ribbon-pro","status":"publish","type":"docs","link":"https:\/\/wptablebuilder.com\/es\/docs\/ribbon-pro\/","title":{"rendered":"Ribbon (Pro)"},"content":{"rendered":"<figure class=\"wp-block-image aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2020\/12\/Ribbon_WPTB_Docs-1024x576.png\" alt=\"\" class=\"wp-image-3445\" srcset=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2020\/12\/Ribbon_WPTB_Docs-1024x576.png 1024w, https:\/\/wptablebuilder.com\/wp-content\/uploads\/2020\/12\/Ribbon_WPTB_Docs-300x169.png 300w, https:\/\/wptablebuilder.com\/wp-content\/uploads\/2020\/12\/Ribbon_WPTB_Docs-768x432.png 768w, https:\/\/wptablebuilder.com\/wp-content\/uploads\/2020\/12\/Ribbon_WPTB_Docs.png 1280w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Do you want to highlight a product, service, or anything in a table?<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Then, use ribbons. A <strong>ribbon<\/strong> lets you <strong>highlight a row\/column<\/strong> in a table.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1196\" height=\"686\" src=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-17-37.gif\" alt=\"\" class=\"wp-image-20857\" style=\"border-width:1px;border-radius:3px\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">WP Table Builder has 5 types of ribbons &#8211; Rectangle, Bookmark, Corner, Icon, and Side. <\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1200\" height=\"708\" src=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-19-12.gif\" alt=\"\" class=\"wp-image-20858\" style=\"border-width:1px;border-radius:3px\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Let&#8217;s see how to add a ribbon in WP Table Builder. <\/p>\n\n\n\n<h2 class=\"wp-block-heading\">RIBBON GENERAL<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">In the General tab, you can select the &#8216;Ribbon Type&#8217; and change the &#8216;Side&#8217; of the ribbon. Now, let&#8217;s discuss ribbon types.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Rectangle<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">The very first ribbon type is &#8216;<strong>Rectangle<\/strong>&#8216;. <strong>You can position the ribbon by changing the X and Y Offset values<\/strong>. <\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"912\" height=\"674\" src=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-22-01.gif\" alt=\"\" class=\"wp-image-20859\" style=\"border-width:1px;border-radius:3px\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Side<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">The next ribbon type is &#8216;<strong>Side<\/strong>&#8216;. Here, you can <strong>change the side<\/strong> and <strong>Y offset of the ribbon.<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"922\" height=\"684\" src=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-25-13.gif\" alt=\"\" class=\"wp-image-20860\" style=\"border-width:1px;border-radius:3px\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Icon<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">The third ribbon is &#8216;<strong>Icon<\/strong>&#8216;. It lets you add an <strong>icon with text<\/strong>. Here, <strong>you can change the icon, side of the ribbon, icon animation, and Y offset.<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"918\" height=\"656\" src=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-27-46.png\" alt=\"\" class=\"wp-image-20861\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-27-46.png 918w, https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-27-46-300x214.png 300w, https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-27-46-768x549.png 768w\" sizes=\"auto, (max-width: 918px) 100vw, 918px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Here is a preview of the ribbon when added with animation. <\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"920\" height=\"668\" src=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-30-34.gif\" alt=\"\" class=\"wp-image-20862\" style=\"border-width:1px;border-radius:3px\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Bookmark<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">The fourth ribbon type is &#8216;<strong>Bookmark&#8217;. Here,<\/strong> you can change the ribbon&#8217;s <strong>width, X offset, and Y offset<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"918\" height=\"682\" src=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-33-14.gif\" alt=\"\" class=\"wp-image-20863\" style=\"border-width:1px;border-radius:3px\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Corner<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">The last ribbon is &#8216;Corner&#8217;. Here, you can change the side of the ribbon.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"908\" height=\"672\" src=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-35-40.gif\" alt=\"\" class=\"wp-image-20864\" style=\"border-width:1px;border-radius:3px\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">RIBBON STYLE<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">RIBBON STYLE consists of other general settings for the ribbon. It includes Font Size, Text Color, Background Color, and Border Color. <\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"920\" height=\"670\" src=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-59-09.png\" alt=\"\" class=\"wp-image-20870\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-59-09.png 920w, https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-59-09-300x218.png 300w, https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-59-09-768x559.png 768w\" sizes=\"auto, (max-width: 920px) 100vw, 920px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Font Size<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">You can change the font size from here. The font size is changeable based on pixel. <\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"912\" height=\"654\" src=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-39-53.png\" alt=\"\" class=\"wp-image-20865\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-39-53.png 912w, https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-39-53-300x215.png 300w, https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-39-53-768x551.png 768w\" sizes=\"auto, (max-width: 912px) 100vw, 912px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Text Color<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">You can easily change the text color of the Ribbon&#8217;s text. <\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"922\" height=\"738\" src=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-44-18-1.png\" alt=\"\" class=\"wp-image-20867\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-44-18-1.png 922w, https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-44-18-1-300x240.png 300w, https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-44-18-1-768x615.png 768w\" sizes=\"auto, (max-width: 922px) 100vw, 922px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Background Color<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">You can also change the background color and border color of the ribbon. <\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"918\" height=\"796\" src=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-50-02.png\" alt=\"\" class=\"wp-image-20868\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-50-02.png 918w, https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-50-02-300x260.png 300w, https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-50-02-768x666.png 768w\" sizes=\"auto, (max-width: 918px) 100vw, 918px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Border Color<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">The Border Color lets you add color around your ribbon&#8217;s border. <\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"902\" height=\"662\" src=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-56-09.png\" alt=\"\" class=\"wp-image-20869\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-56-09.png 902w, https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-56-09-300x220.png 300w, https:\/\/wptablebuilder.com\/wp-content\/uploads\/2023\/07\/2025-03-23_19-56-09-768x564.png 768w\" sizes=\"auto, (max-width: 902px) 100vw, 902px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">We hope this documentation has helped you. Let us know if you have any questions regarding the Ribbon element of WP Table Builder.&nbsp;<\/p>","protected":false},"excerpt":{"rendered":"<p>Do you want to highlight a product, service, or anything in a table? Then, use ribbons. A ribbon lets you highlight a row\/column in a table. WP Table Builder has 5 types of ribbons &#8211; Rectangle, Bookmark, Corner, Icon, and Side. Let&#8217;s see how to add a ribbon in WP Table Builder. RIBBON GENERAL In [&hellip;]<\/p>\n","protected":false},"author":6,"featured_media":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"footnotes":""},"doc_category":[15],"doc_tag":[],"class_list":["post-3062","docs","type-docs","status-publish","hentry","doc_category-elements"],"year_month":"2026-08","word_count":296,"total_views":0,"reactions":{"happy":0,"normal":0,"sad":0},"author_info":{"name":"Ankur Raz Bongshi","author_nicename":"rajankur003","author_url":"https:\/\/wptablebuilder.com\/es\/author\/rajankur003\/"},"doc_category_info":[{"term_name":"Elements","term_url":"https:\/\/wptablebuilder.com\/es\/docs-category\/elements\/"}],"doc_tag_info":[],"_links":{"self":[{"href":"https:\/\/wptablebuilder.com\/es\/wp-json\/wp\/v2\/docs\/3062","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wptablebuilder.com\/es\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/wptablebuilder.com\/es\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/wptablebuilder.com\/es\/wp-json\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"https:\/\/wptablebuilder.com\/es\/wp-json\/wp\/v2\/comments?post=3062"}],"version-history":[{"count":0,"href":"https:\/\/wptablebuilder.com\/es\/wp-json\/wp\/v2\/docs\/3062\/revisions"}],"wp:attachment":[{"href":"https:\/\/wptablebuilder.com\/es\/wp-json\/wp\/v2\/media?parent=3062"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/wptablebuilder.com\/es\/wp-json\/wp\/v2\/doc_category?post=3062"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/wptablebuilder.com\/es\/wp-json\/wp\/v2\/doc_tag?post=3062"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}