{"id":150,"date":"2016-01-29T07:38:51","date_gmt":"2016-01-29T07:38:51","guid":{"rendered":"http:\/\/loftocean.com\/curious-doc\/?page_id=150"},"modified":"2016-03-13T15:23:59","modified_gmt":"2016-03-13T15:23:59","slug":"how-to-style-a-column","status":"publish","type":"page","link":"https:\/\/loftocean.com\/doc\/loftbuilder\/layouts\/columns\/how-to-style-a-column\/","title":{"rendered":"How to Style a Column"},"content":{"rendered":"

Click Column Settings<\/strong> button in the column toolbar to open the settings panel. Here are 2 tabs:
\n Basic<\/strong> & Background<\/strong>.<\/p>\n

Basic settings include:<\/h5>\n
    \n
  • Color Scheme<\/strong> – Allows you to select color scheme for this column. It inherits the color scheme selected for the parent section by default.<\/li>\n
  • Content Horizontal Alignment<\/strong> – It decides the horizontal position of the content inside the column.<\/li>\n
  • Content Vertical Alignment<\/strong> – It decides the vertical position of the content inside the column.<\/li>\n
  • Column Height<\/strong> – There are 3 options:\n
      \n
    • Auto<\/strong> – The height is decided by how much content inside of the column.<\/li>\n
    • Screen Height<\/strong> – It makes the column at least 100% height of browser window.<\/li>\n
    • Custom Height<\/strong> – Allows you to enter a custom height value.<\/li>\n<\/ul>\n<\/li>\n
    • Content Area<\/strong> – It decides if the content takes 100% width and height of the column, or leave paddings around.<\/li>\n
    • Content Paddings<\/strong> – You can enter custom padding values for the column (depending on Content Area option).<\/li>\n<\/ul>\n
      Background settings include:<\/h5>\n
        \n
      • Transparent Background<\/strong> – Enable to set the column’s background to transparent. Disable it then you can style the column’s background.<\/li>\n
      • Background Color<\/strong> – Allows you to pick a background color for the column with a color picker.<\/li>\n
      • Background Opacity<\/strong> – You can change the background color’s opacity.<\/li>\n
      • Background Image<\/strong> – Allows you to add a background image by uploading a new image or selecting one from Media Library.<\/li>\n
      • Color Overlay<\/strong> – You can add a color overlay on top of the background with any color picked in a color picker, and tweak its opacity.<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"

        Click Column Settings button in the column toolbar to open the settings panel. Here are 2 tabs: Basic & Background. Basic settings include: Color Scheme – Allows you to select color scheme for this column. It inherits the color scheme selected for the parent section by default. Content Horizontal Alignment – It decides the horizontal […]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":144,"menu_order":30,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-150","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/loftocean.com\/doc\/loftbuilder\/wp-json\/wp\/v2\/pages\/150","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/loftocean.com\/doc\/loftbuilder\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/loftocean.com\/doc\/loftbuilder\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/loftocean.com\/doc\/loftbuilder\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/loftocean.com\/doc\/loftbuilder\/wp-json\/wp\/v2\/comments?post=150"}],"version-history":[{"count":1,"href":"https:\/\/loftocean.com\/doc\/loftbuilder\/wp-json\/wp\/v2\/pages\/150\/revisions"}],"predecessor-version":[{"id":893,"href":"https:\/\/loftocean.com\/doc\/loftbuilder\/wp-json\/wp\/v2\/pages\/150\/revisions\/893"}],"up":[{"embeddable":true,"href":"https:\/\/loftocean.com\/doc\/loftbuilder\/wp-json\/wp\/v2\/pages\/144"}],"wp:attachment":[{"href":"https:\/\/loftocean.com\/doc\/loftbuilder\/wp-json\/wp\/v2\/media?parent=150"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}