{"id":197,"date":"2021-03-11T00:00:04","date_gmt":"2021-03-11T00:00:04","guid":{"rendered":"https:\/\/nexgen.codings.dev\/docs\/?p=197"},"modified":"2021-03-15T20:23:20","modified_gmt":"2021-03-15T20:23:20","slug":"building-the-footer-with-flexible-columns-and-bottom-bar","status":"publish","type":"post","link":"https:\/\/nexgen.codings.dev\/docs\/building-the-footer-with-flexible-columns-and-bottom-bar\/","title":{"rendered":"Building the footer with flexible columns and bottom bar"},"content":{"rendered":"\t\t
\n\t\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t

Overview<\/h4>\n

Ordering columns, reuse layouts, add any icon, custom links and buttons, conditional menus, and ordering as desired. Adjust spacing between items, colors and typography for absolutely everything on both the footer and the bottom bar.<\/p>\n

Footer builder<\/h4>\n

From the dashboard go to Theme Settings \u00bb Footer.<\/p>\n

\"\u26a1\"Bottom Bar<\/h5>\n

Builder<\/b><\/p>\n

Click on the \u201cAdd New\u201d button to add new elements to Bottom Bar.<\/p>\n

\u00bb Link
\u00bb Link with icon<\/p>\n

Section \u00bb Layout<\/b><\/p>\n

You can adjust the layout of the Bottom Bar. The set layout will be applied to the section container.<\/p>\n

\u00bb Max Width<\/p>\n

Section \u00bb Color<\/b><\/p>\n

The selected background color will be applied to Bottom Bar.<\/p>\n

\u00bb Background Color<\/p>\n

Link \u00bb Layout<\/b><\/p>\n

You can adjust the layout of the Bottom Bar items. The set layout will be applied to links.<\/p>\n

\u00bb Space Between<\/p>\n

Link \u00bb Color<\/b><\/p>\n

You can set the color and hover color for the all links of the Bottom Bar.<\/p>\n

\u00bb Text Color
\u00bb Text Hover Color<\/p>\n

Link \u00bb Typography<\/b><\/p>\n

You can set the color and hover color for the all links of the Bottom Bar.<\/p>\n

\u00bb Font Type (Google Font or Custom Font)
\n\u00bb Font Family
\n\u00bb Font Style
\n\u00bb Font Size
\n\u00bb Font Weight
\n\u00bb Line Height<\/p>\n

\"\u26a1\"Main Footer<\/h5>\n

Builder<\/b><\/p>\n

Click on the “Add New” button to add new column to Footer.<\/p>\n

\u00bb Contact Info
\n\u00bb Link List<\/p>\n

Contact Info<\/b><\/p>\n

Click on the “Add New” button to add new elements to Footer column.<\/p>\n

\u00bb Brand (Logo and Responsive Logo)
\n\u00bb Text
\n\u00bb Button (Multiple Styles)
\n\u00bb Link
\n\u00bb Link with icon<\/p>\n

Link List<\/b><\/p>\n

Enter a Heading and select a menu.<\/p>\n

\u00bb Heading (Column Title)
\n\u00bb Menu<\/p>\n

Section \u00bb Layout<\/b><\/p>\n

You can adjust the layout of the Footer. The set layout will be applied to the section container.<\/p>\n

\u00bb Max Width
\n\u00bb Vertical Padding
\n\u00bb Collumns<\/p>\n

Section \u00bb Design<\/b><\/p>\n

The selected background image will be applied to Footer.<\/p>\n

\u00bb Background Image<\/p>\n

Section \u00bb Color<\/b><\/p>\n

The selected background color will be applied to Footer.<\/p>\n

\u00bb Background Color<\/p>\n

Block \u00bb Layout<\/b><\/p>\n

You can adjust the layout of the Footer column.<\/p>\n

\u00bb Space Between<\/p>\n

Block \u00bb Color<\/b><\/p>\n

The selected background color will be applied to Footer column.<\/p>\n

\u00bb Background Color<\/p>\n

Logo Image \u00bb Layout<\/b><\/p>\n

Set the logo layout for desktop and mobile.<\/p>\n

\u00bb Width Type (Auto or Custom)
\n\u00bb Width
\n\u00bb Height<\/p>\n

Heading \u00bb Color<\/b><\/p>\n

You can set the color for the all headings of the Footer.<\/p>\n

\u00bb Text Color<\/p>\n

Heading \u00bb Typography<\/b><\/p>\n

You can set the color for the all headings of the Footer.<\/p>\n

\u00bb Font Type (Google Font or Custom Font)
\n\u00bb Font Family
\n\u00bb Font Style
\n\u00bb Font Size
\n\u00bb Font Weight
\n\u00bb Line Height<\/p>\n

Paragraph \u00bb Color<\/b><\/p>\n

You can set the color for the all paragraphs of the Footer.<\/p>\n

\u00bb Text Color<\/p>\n

Paragraph \u00bb Typography<\/b><\/p>\n

You can set the color for the all paragraphs of the Footer.<\/p>\n

\u00bb Font Type (Google Font or Custom Font)
\n\u00bb Font Family
\n\u00bb Font Style
\n\u00bb Font Size
\n\u00bb Font Weight
\n\u00bb Line Height<\/p>\n

Link \u00bb Layout<\/b><\/p>\n

You can adjust the layout of the Footer items. The set layout will be applied to links.<\/p>\n

\u00bb Space Between<\/p>\n

Link \u00bb Color<\/b><\/p>\n

You can set the color and hover color for the all links of the Footer.<\/p>\n

\u00bb Text Color
\u00bb Text Hover Color<\/p>\n

Link \u00bb Typography<\/b><\/p>\n

You can set the color and hover color for the all links of the Footer.<\/p>\n

\u00bb Font Type (Google Font or Custom Font)
\n\u00bb Font Family
\n\u00bb Font Style
\n\u00bb Font Size
\n\u00bb Font Weight
\n\u00bb Line Height<\/p>\n

Button \u00bb Color<\/b><\/p>\n

You can set the color and hover color for the all buttons of the Footer.<\/p>\n

\u00bb Bckground Color
\u00bb Bckground Hover Color
\u00bb Text Color<\/p>\n

Button \u00bb Typography<\/b><\/p>\n

You can set the background color, text color and text hover color for all buttons on the Footer.<\/p>\n

\u00bb Font Type (Google Font or Custom Font)
\n\u00bb Font Family
\n\u00bb Font Style
\n\u00bb Font Size
\n\u00bb Font Weight
\n\u00bb Line Height<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"

Overview Ordering columns, reuse layouts, add any icon, custom links and buttons, conditional menus, and ordering as desired. Adjust spacing…<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[8,15],"tags":[],"class_list":["post-197","post","type-post","status-publish","format-standard","hentry","category-theme-settings","category-footer-builder"],"acf":[],"_links":{"self":[{"href":"https:\/\/nexgen.codings.dev\/docs\/wp-json\/wp\/v2\/posts\/197","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nexgen.codings.dev\/docs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nexgen.codings.dev\/docs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nexgen.codings.dev\/docs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nexgen.codings.dev\/docs\/wp-json\/wp\/v2\/comments?post=197"}],"version-history":[{"count":4,"href":"https:\/\/nexgen.codings.dev\/docs\/wp-json\/wp\/v2\/posts\/197\/revisions"}],"predecessor-version":[{"id":202,"href":"https:\/\/nexgen.codings.dev\/docs\/wp-json\/wp\/v2\/posts\/197\/revisions\/202"}],"wp:attachment":[{"href":"https:\/\/nexgen.codings.dev\/docs\/wp-json\/wp\/v2\/media?parent=197"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nexgen.codings.dev\/docs\/wp-json\/wp\/v2\/categories?post=197"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nexgen.codings.dev\/docs\/wp-json\/wp\/v2\/tags?post=197"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}