{"id":14322,"date":"2017-09-28T08:27:07","date_gmt":"2017-09-28T08:27:07","guid":{"rendered":"http:\/\/rnbtheme.com\/documentation\/?p=14322"},"modified":"2023-07-31T10:22:00","modified_gmt":"2023-07-31T10:22:00","slug":"pricing-block-and-pricing-labels","status":"publish","type":"post","link":"https:\/\/rnbtheme.com\/documentation\/wpbackery\/pricing-block-and-pricing-labels","title":{"rendered":"Pricing Block and Pricing Labels"},"content":{"rendered":"<section class=\"wpb-content-wrapper\"><p>[vc_row][vc_column css=&#8221;.vc_custom_1485963458300{padding-right: 35px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]Create convenient services presentation with prices and features displayed at a time.<\/p>\n<p>You may check the customization example on the <a href=\"https:\/\/rnbtheme.com\/elements\/pricing-tables\/\" target=\"_blank\" rel=\"noopener\">Pricing Tables page<\/a>.[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][dfd_tta_tabs border_radius=&#8221;4&#8243; alignment=&#8221;left&#8221; active_section=&#8221;1&#8243; active_tab_background=&#8221;#3b55e6&#8243; tab_hover_text_color=&#8221;#3b55e6&#8243; tab_active_color_text=&#8221;#ffffff&#8221; border_color_active=&#8221;#3b55e6&#8243;][vc_tta_section title=&#8221;General settings&#8221; tab_id=&#8221;1486545572585-2437c7e1-5371&#8243;][vc_column_text]<\/p>\n<h3>General settings<\/h3>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-14324\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/pricing-block-general.png\" alt=\"\" width=\"978\" height=\"715\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/pricing-block-general.png 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/pricing-block-general-300x219.png 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/pricing-block-general-768x561.png 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Style<\/strong> &#8211; select one of the pre-defined styles.<\/li>\n<li><strong>Slim style<\/strong> &#8211; set it to <strong>Enable<\/strong> to display pricing tables without the unnecessary paddings and make its content fit the container nicely into 4-column row. You may see the bottom example on the shortcode presentation page.<\/li>\n<li><strong>Title<\/strong> &#8211; type the title of the pricing block.<\/li>\n<li><strong>Subtitle<\/strong> &#8211; type the subtitle for more explanations on the module.<\/li>\n<li><strong>Currency symbol<\/strong> &#8211; specify the used currency.<\/li>\n<li><strong>Price<\/strong> &#8211; set the money payed for the certain service or product.<\/li>\n<li><strong>Recurring fee<\/strong> &#8211; specify the time period for the service\/product payment.<\/li>\n<li><strong>Icon to header<\/strong> &#8211; switch it to <strong>Enable<\/strong> to set the icon, if needed. It&#8217;ll add extra tab with icon settings.<\/li>\n<li><strong>Animation<\/strong> \u2013 choose between 14 preset animation effects.<\/li>\n<li><strong>Custom CSS class<\/strong> \u2013\u00a0enter our\u00a0own unique class name for the item \u2013 this is a useful option for those who want to create a specific style. E.g.: you can type <strong>custom-style<\/strong> class and then go to <del class=\"support-arrow-right\">Theme options<\/del>\u00a0<del class=\"support-arrow-right\">General options<\/del> <del>Custom CSS<\/del> field and write your own CSS code with this class to get your own style.<\/li>\n<\/ul>\n<p>[\/vc_column_text][\/vc_tta_section][vc_tta_section title=&#8221;Icon settings&#8221; tab_id=&#8221;1486545572829-e1c1304c-ee12&#8243;][vc_column_text]<\/p>\n<h3>Icon settings<\/h3>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-14327\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/icon-settings.png\" alt=\"\" width=\"978\" height=\"625\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/icon-settings.png 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/icon-settings-300x192.png 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/icon-settings-768x491.png 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Icon to display<\/strong>\u00a0\u2013 select the element to be displayed in the module.\n<ul>\n<li><strong>Icon<\/strong>\u00a0\u2013 select this variant to display the\u00a0icon in the module.\n<ul>\n<li><strong>Icon library<\/strong>\u00a0\u2013\u00a0choose the icon library for the module.<\/li>\n<li><strong>Select icon<\/strong>\u00a0\u2013 select the icon to be displayed in the module.<\/li>\n<li><strong>Size<\/strong>\u00a0\u2013 set the size for the icon.<\/li>\n<li><strong>Opacity (0-100) %<\/strong>\u00a0\u2013 specify the transparency of the icon.<\/li>\n<li><strong>Color<\/strong>\u00a0\u2013 choose the icon color.<\/li>\n<\/ul>\n<\/li>\n<li><strong>Custom Image<\/strong>\u00a0<strong>Icon<\/strong>\u00a0\u2013 select this variant to display custom image\u00a0on the left side from the text.\n<ul>\n<li><strong>Upload image<\/strong>\u00a0\u2013 select the image from media library for the module.<\/li>\n<li><strong>Size<\/strong>\u00a0\u2013 set the size for the image.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p>[\/vc_column_text][\/vc_tta_section][vc_tta_section title=&#8221;Content settings&#8221; tab_id=&#8221;1506587256643-54a22f1f-3514&#8243;][vc_column_text]<\/p>\n<h3>Content settings<\/h3>\n<h6>In this section, you can customize the list items of the module.<\/h6>\n<h6>By clicking on the\u00a0arrow down icon you can reveal the whole section to adjust it to your needs. Here you are also able to duplicate the list items, change\u00a0their order (simply drag-n-drop the blocks) and delete the unnecessary ones as well.<\/h6>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-14330\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/CONTENTsettings.png\" alt=\"\" width=\"978\" height=\"731\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/CONTENTsettings.png 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/CONTENTsettings-300x224.png 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/CONTENTsettings-768x574.png 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Content<\/strong> &#8211; type the extra information above the available features in the pack.<\/li>\n<li><strong>Type<\/strong> &#8211; select the type of the feature.\n<ul>\n<li><strong>Text with icon<\/strong> &#8211; to make list with various icons.<\/li>\n<li><strong> Only text<\/strong> &#8211; to add simple text.<\/li>\n<li><strong> Only icon<\/strong> &#8211; to display only icons.<\/li>\n<li><strong> Dot enabled<\/strong> &#8211; to display available feature in the pack, it&#8217;ll inherit the main site color.<\/li>\n<li><strong> Dot disabled<\/strong> &#8211; to show that the feature is excluded from the pack, the dot has transparent black color.<\/li>\n<li><strong> Dot custom<\/strong> &#8211; allows to style the dot color.<\/li>\n<\/ul>\n<\/li>\n<li><strong>Label<\/strong> &#8211; add the text for feature description, for<strong> Text with icon<\/strong> and <strong>Only text<\/strong> styles.<\/li>\n<li><strong>Icon library<\/strong> &#8211; select the icon pack, for <strong>Text with icon<\/strong> and <strong>Only icon<\/strong> styles.<\/li>\n<li><strong>Icon<\/strong> &#8211; select the icon.<\/li>\n<li><strong>Color<\/strong> &#8211; specify the color for the dot, for <strong>Dot custom<\/strong> style.<\/li>\n<\/ul>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-14332\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/CONTENTsettings-2.png\" alt=\"\" width=\"978\" height=\"220\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/CONTENTsettings-2.png 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/CONTENTsettings-2-300x67.png 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/CONTENTsettings-2-768x173.png 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Button text<\/strong> &#8211; type the text for the button to display it, if needed.<\/li>\n<li><strong>Button link<\/strong> &#8211; set the link to the button.<\/li>\n<\/ul>\n<p>[\/vc_column_text][\/vc_tta_section][vc_tta_section title=&#8221;Style settings&#8221; tab_id=&#8221;1486545573068-02c117a6-3d50&#8243;][vc_column_text]<\/p>\n<h3>Style settings<\/h3>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-14334\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/style-1.png\" alt=\"\" width=\"978\" height=\"518\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/style-1.png 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/style-1-300x159.png 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/style-1-768x407.png 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Block border style<\/strong> &#8211; select the style of the module border.\n<ul>\n<li><strong>Border color<\/strong> &#8211; specify the color of the border.<\/li>\n<li><strong>Border width<\/strong> &#8211; select the width of the module border.<\/li>\n<\/ul>\n<\/li>\n<li><strong>Heading background color<\/strong> &#8211; set the color for the header background of the module.<\/li>\n<li><strong>Description background color<\/strong> &#8211; set the color of the content background.<\/li>\n<li><strong>Label<\/strong> &#8211; set it to <strong>Enable<\/strong> to display the\u00a0label mark on the top of the pricing table.\n<ul>\n<li><strong>Label text<\/strong> &#8211; type the text of the mark at the top of the mark.<\/li>\n<li><strong>Label<\/strong> <strong>style<\/strong> &#8211; select the style of the mark: \u00a0<strong>Square<\/strong> and <strong>Rounded<\/strong> styles are available.<\/li>\n<li><strong>Label text color<\/strong> &#8211; select the text color of the mark.<\/li>\n<li><strong>Label background<\/strong> &#8211; specify the background mark color.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-14335\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/style-2.png\" alt=\"\" width=\"978\" height=\"458\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/style-2.png 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/style-2-300x140.png 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/style-2-768x360.png 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Price delimiter<\/strong> &#8211; set it to <strong>Enable<\/strong> to display the separator between title and price.\n<ul>\n<li><strong>Color<\/strong> &#8211; select the color of the divider.<\/li>\n<li><strong>Width<\/strong> &#8211; type its width \u00a0to customize shape.<\/li>\n<li><strong>Height<\/strong> &#8211; type its height to customize shape.<\/li>\n<\/ul>\n<\/li>\n<li><strong>Currency, price &amp; recurring fee color<\/strong> &#8211; set the color for the currency symbol, price amount and recurring fee.<\/li>\n<\/ul>\n<h5>Content settings<\/h5>\n<ul>\n<li><strong>Content color<\/strong> &#8211; set\u00a0the text color for the content.<\/li>\n<\/ul>\n<h5>Button settings<\/h5>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-14336\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/style-3.png\" alt=\"\" width=\"978\" height=\"455\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/style-3.png 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/style-3-300x140.png 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/style-3-768x357.png 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Custom styles<\/strong> &#8211; set it to <strong>Enable<\/strong> to use\u00a0the custom styles for the pricing block button\u044e\n<ul>\n<li><strong>Block border style<\/strong> &#8211; select the style of the button border.\n<ul>\n<li><strong>Border width<\/strong> &#8211; select the width of the button border.<\/li>\n<li><strong>Border color<\/strong> &#8211; specify the color of the border.<\/li>\n<li><strong>Border hover color<\/strong> &#8211; specify the color of the border on hover.<\/li>\n<\/ul>\n<\/li>\n<li><strong>Background color<\/strong> &#8211;\u00a0set the background color for the button.It is inherited from\u00a0<del class=\"support-arrow-right\">Theme options<\/del>\u00a0<del class=\"support-arrow-right\">General options<\/del><del class=\"support-arrow-right\">Default button options<\/del><del>Default button background color<\/del>.\u00a0The default background color for the style Main is #fff.<\/li>\n<li><strong>Hover background color<\/strong>\u00a0\u2013\u00a0set the hover background color for the button.It is inherited from\u00a0<del class=\"support-arrow-right\">Theme options<\/del>\u00a0<del class=\"support-arrow-right\">General options<\/del><del class=\"support-arrow-right\">Default button options<\/del><del>Default button hover background color.<\/del>\u00a0The default background hover color for the style Main is rgba(255,255,255,0.8).<\/li>\n<li><strong>Text color<\/strong> &#8211;\u00a0set the text color for the button. It is inherited from\u00a0<del class=\"support-arrow-right\">Theme options<\/del>\u00a0<del class=\"support-arrow-right\">General options<\/del><del class=\"support-arrow-right\">Default button options<\/del>\u00a0<del>Default Button Typography<\/del>section.\u00a0The default text color for the style Main is #1b1b1b.<\/li>\n<li><strong>Hover text color<\/strong> &#8211;\u00a0set the text color on hover for the button.\u00a0It is inherited from\u00a0<del class=\"support-arrow-right\">Theme options<\/del><del class=\"support-arrow-right\">General options<\/del><del class=\"support-arrow-right\">Default button options<\/del><del>Default button hover text color<\/del>.\u00a0The default text hover color for the style Main is #1b1b1b.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p>[\/vc_column_text][\/vc_tta_section][vc_tta_section title=&#8221;Typography settings&#8221; tab_id=&#8221;1486545573311-423c930f-c6e7&#8243;][vc_column_text]<\/p>\n<h3>Typography settings<\/h3>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone wp-image-1747 size-full\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2016\/12\/01.jpg\" sizes=\"(max-width: 978px) 100vw, 978px\" srcset=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2016\/12\/01.jpg 978w, http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2016\/12\/01-300x198.jpg 300w, http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2016\/12\/01-768x508.jpg 768w\" width=\"978\" height=\"647\" \/><\/p>\n<h5>Title typography<\/h5>\n<p>These settings are inherited from <del class=\"support-arrow-right\">Theme options<\/del> <del class=\"support-arrow-right\">Custom typography<\/del> <del>Features Title Typography.<\/del><\/p>\n<ul>\n<li><strong>Element tag<\/strong> \u2013 select the tag for the title.<\/li>\n<li><strong>Font size<\/strong> \u2013 set the font size you need to use in the title.<\/li>\n<li><strong>Letter spacing<\/strong> \u2013 set the needed distance between letters.<\/li>\n<li><strong>Line-height<\/strong> \u2013\u00a0set the needed distance between lines in the title text.<\/li>\n<li><strong>Text color<\/strong> \u2013 set the color of the font.<\/li>\n<li><strong>Font style<\/strong> \u2013 select the font weight and style (bold, italic) for the title.<\/li>\n<li><strong>Custom font family<\/strong> \u2013 set it to <strong>Enable<\/strong> to use custom Google font.\n<ul>\n<li><strong>Font Family<\/strong> \u2013 select the font family from the drop-down list.<\/li>\n<li><strong>Font style<\/strong> \u2013 select the font weight and style (bold, italic) for the title.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<h5>Subtitle typography<\/h5>\n<p>These settings are inherited from <del class=\"support-arrow-right\">Theme options<\/del> <del class=\"support-arrow-right\">Custom typography<\/del> <del>Subtitle Typography.<\/del><\/p>\n<ul>\n<li><strong>Element tag<\/strong> \u2013 select the tag for the subtitle.<\/li>\n<li><strong>Font size<\/strong> \u2013 set the font size you need to use in the subtitle.<\/li>\n<li><strong>Letter spacing<\/strong> \u2013 set the needed distance between letters in the\u00a0subtitle.<\/li>\n<li><strong>Line-height<\/strong> \u2013\u00a0set the needed distance between lines in the subtitle text.<\/li>\n<li><strong>Text color<\/strong> \u2013 set the color of the font.<\/li>\n<li><strong>Font style<\/strong> \u2013 select the font weight and style (bold, italic) from the title.<\/li>\n<\/ul>\n<h5>Content typography<\/h5>\n<p>The typography settings are inherited from\u00a0<del class=\"support-arrow-right\">Theme options<\/del>\u00a0<del class=\"support-arrow-right\">Custom typography<\/del>\u00a0<del>Text typography<\/del>.<\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-13678\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2016\/12\/content-typography-1.png\" sizes=\"(max-width: 978px) 100vw, 978px\" srcset=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2016\/12\/content-typography-1.png 978w, http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2016\/12\/content-typography-1-300x117.png 300w, http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2016\/12\/content-typography-1-768x299.png 768w\" alt=\"\" width=\"978\" height=\"381\" \/><\/p>\n<ul>\n<li><strong>Element tag<\/strong>\u00a0\u2013 select the tag for the text in the module.<\/li>\n<li><strong>Font size<\/strong>\u00a0\u2013 set the font size you need to use in the text in the module.<\/li>\n<li><strong>Letter spacing<\/strong>\u00a0\u2013 set the needed distance between letters.<\/li>\n<li><strong>Line-height<\/strong>\u00a0\u2013\u00a0set the needed distance between lines.<\/li>\n<li><strong>Text color<\/strong>\u00a0\u2013 set the color of the font.<\/li>\n<li><strong>Font style<\/strong>\u00a0\u2013 select the font weight and style (bold, italic).<\/li>\n<\/ul>\n<p>The price and currency symbol typography settings are inherited from\u00a0<del class=\"support-arrow-right\">Theme options<\/del>\u00a0<del class=\"support-arrow-right\">Custom typography<\/del>\u00a0<del>H1 Title typography<\/del>.<\/p>\n<p>The recurring fee settings are inherited from <del class=\"support-arrow-right\">Theme options<\/del> <del class=\"support-arrow-right\">Custom typography<\/del> <del>Subtitle Typography.<\/del>[\/vc_column_text][\/vc_tta_section][\/dfd_tta_tabs][\/vc_column][\/vc_row][vc_row][vc_column css=&#8221;.vc_custom_1485963458300{padding-right: 35px !important;padding-left: 35px !important;}&#8221; col_shadow=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221; col_shadow_hover=&#8221;box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)&#8221;][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][vc_column_text]<\/p>\n<h3>Pricing Labels Module<\/h3>\n<h4>Add extra notes for the Pricing boxes.<\/h4>\n<p>You may check the customization example on the <a href=\"https:\/\/rnbtheme.com\/elements\/pricing-tables\/\" target=\"_blank\" rel=\"noopener\">Pricing Tables page\u00a0<\/a>\u00a0(bottom example).<\/p>\n<p>Pricing labels help to add more information to the Price Block module with bullets cntent. Explain the availability of the feature in the pack with common labels.[\/vc_column_text][dfd_spacer screen_wide_spacer_size=&#8221;30&#8243; screen_normal_resolution=&#8221;1024&#8243; screen_tablet_resolution=&#8221;800&#8243; screen_mobile_resolution=&#8221;480&#8243;][dfd_tta_tabs border_radius=&#8221;4&#8243; alignment=&#8221;left&#8221; active_section=&#8221;1&#8243; active_tab_background=&#8221;#3b55e6&#8243; tab_hover_text_color=&#8221;#3b55e6&#8243; tab_active_color_text=&#8221;#ffffff&#8221; border_color_active=&#8221;#3b55e6&#8243;][vc_tta_section title=&#8221;General settings&#8221; tab_id=&#8221;1506602165120-775d7df4-fd13&#8243;][vc_column_text]<\/p>\n<h3>General settings<\/h3>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-14347\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/label-general.png\" alt=\"\" width=\"978\" height=\"306\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/label-general.png 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/label-general-300x94.png 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/label-general-768x240.png 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Content alignment<\/strong> &#8211; select where to align the labels: <strong>left<\/strong>, <strong>right<\/strong> and <strong>center<\/strong> positions are available.<\/li>\n<li><strong>Animation<\/strong> \u2013 choose between 14 preset animation effects.<\/li>\n<li><strong>Custom CSS class<\/strong> \u2013\u00a0enter our\u00a0own unique class name for the item \u2013 this is a useful option for those who want to create a specific style. E.g.: you can type <strong>custom-style<\/strong> class and then go to <del class=\"support-arrow-right\">Theme options<\/del>\u00a0<del class=\"support-arrow-right\">General options<\/del> <del>Custom CSS<\/del> field and write your own CSS code with this class to get your own style.<\/li>\n<\/ul>\n<p>[\/vc_column_text][\/vc_tta_section][vc_tta_section title=&#8221;Content settings&#8221; tab_id=&#8221;1506602165875-a8925c04-734c&#8221;][vc_column_text]<\/p>\n<h3>Content settings<\/h3>\n<h6>In this section, you can customize the list items of the module.<\/h6>\n<h6>By clicking on the\u00a0arrow down icon you can reveal the whole section to adjust it to your needs. Here you are also able to duplicate the list items, change\u00a0their order (simply drag-n-drop the blocks) and delete the unnecessary ones as well.<\/h6>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-14348\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/label-content.png\" alt=\"\" width=\"978\" height=\"402\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/label-content.png 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/label-content-300x123.png 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/label-content-768x316.png 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Label<\/strong> &#8211; type the extra information above the available features in the pack.<\/li>\n<\/ul>\n<p>The labels will be automatically aligned with the content features of the Price Boxes. So you&#8217;ll be able to use bullets to indicate the presence\/absence of the feature in a pack.[\/vc_column_text][\/vc_tta_section][vc_tta_section title=&#8221;Typography settings&#8221; tab_id=&#8221;1506602166637-21ed674c-de4e&#8221;][vc_column_text]<\/p>\n<h3>Typography settings<\/h3>\n<h5>Content typography<\/h5>\n<p>The typography settings are inherited from\u00a0<del class=\"support-arrow-right\">Theme options<\/del>\u00a0<del class=\"support-arrow-right\">Custom typography<\/del>\u00a0<del>Text typography<\/del>.<\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-14349\" src=\"http:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/label-typography.png\" alt=\"\" width=\"978\" height=\"370\" srcset=\"https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/label-typography.png 978w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/label-typography-300x113.png 300w, https:\/\/rnbtheme.com\/documentation\/wp-content\/uploads\/2017\/09\/label-typography-768x291.png 768w\" sizes=\"(max-width: 978px) 100vw, 978px\" \/><\/p>\n<ul>\n<li><strong>Element tag<\/strong> \u2013 select the tag for the title.<\/li>\n<li><strong>Font size<\/strong> \u2013 set the font size you need to use in the title.<\/li>\n<li><strong>Letter spacing<\/strong> \u2013 set the needed distance between letters.<\/li>\n<li><strong>Line-height<\/strong> \u2013\u00a0set the needed distance between lines in the title text.<\/li>\n<li><strong>Text color<\/strong> \u2013 set the color of the font.<\/li>\n<li><strong>Font style<\/strong> \u2013 select the font weight and style (bold, italic) for the title.<\/li>\n<li><strong>Custom font family<\/strong> \u2013 set it to <strong>Enable<\/strong> to use custom Google font.\n<ul>\n<li><strong>Font Family<\/strong> \u2013 select the font family from the drop-down list.<\/li>\n<li><strong>Font style<\/strong> \u2013 select the font weight and style (bold, italic) for the title.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p>[\/vc_column_text][\/vc_tta_section][\/dfd_tta_tabs][\/vc_column][\/vc_row]<\/p>\n<\/section>","protected":false},"excerpt":{"rendered":"<p>Present the list of features &#038; services in a nice looking block<\/p>\n","protected":false},"author":29,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[5],"tags":[29,23,22,16,33],"_links":{"self":[{"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/posts\/14322"}],"collection":[{"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/users\/29"}],"replies":[{"embeddable":true,"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/comments?post=14322"}],"version-history":[{"count":17,"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/posts\/14322\/revisions"}],"predecessor-version":[{"id":15573,"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/posts\/14322\/revisions\/15573"}],"wp:attachment":[{"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/media?parent=14322"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/categories?post=14322"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rnbtheme.com\/documentation\/wp-json\/wp\/v2\/tags?post=14322"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}