{"type":"doc","content":[{"type":"extension","attrs":{"layout":"default","extensionType":"com.atlassian.confluence.macro.core","extensionKey":"toc","parameters":{"macroParams":{"minLevel":{"value":"1"},"maxLevel":{"value":"6"},"outline":{"value":"false"},"type":{"value":"flat"},"separator":{"value":"brackets"},"printable":{"value":"true"}},"macroMetadata":{"macroId":{"value":"015d59c9-c76a-46af-8abb-3ca0d3dde06b"},"schemaVersion":{"value":"1"},"title":"Table of Contents"}},"localId":"3a74b5c5-5412-425a-97d5-c536a60318c6"}},{"type":"heading","attrs":{"level":2},"content":[{"text":"Intro","type":"text"}]},{"type":"paragraph","content":[{"text":"This document provides the instructions for adding Simple Footer to a resort that is using Theme Designer version 2. Simple Footer v2 uses the flexbox model for responsive layouts. ","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":756,"widthType":"pixel"},"content":[{"type":"media","attrs":{"width":1367,"id":"52e8a461-ccd1-47a2-acbe-efe6f50a36fc","collection":"contentId-3096084482","type":"file","height":228}},{"type":"caption","content":[{"text":"Desktop","type":"text"}]}]},{"type":"mediaSingle","attrs":{"layout":"center","width":534,"widthType":"pixel"},"content":[{"type":"media","attrs":{"width":811,"id":"53b53179-13ad-4ae7-8fa3-1aa923fdcca3","collection":"contentId-3096084482","type":"file","height":360}},{"type":"caption","content":[{"text":"Mobile (Below 991px)","type":"text"}]}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Instructions","type":"text"}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Create a NOP Widget and add the following HTML and name it ","type":"text"},{"text":"Simple Footer","type":"text","marks":[{"type":"code"}]},{"text":".","type":"text"}]}]}]},{"type":"codeBlock","content":[{"text":"","type":"text"}]},{"type":"orderedList","attrs":{"order":2},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Update the HTML content as needed for the resort","type":"text"}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"You can add/remove remove columns and the column content if you want. See the ","type":"text"},{"text":"Adding/Removing Columns Section","type":"text","marks":[{"type":"link","attrs":{"href":"#Adding%2FRemoving-Columns"}}]},{"text":" of this document for more info.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Be sure to update the ","type":"text"},{"text":"mailto:","type":"text","marks":[{"type":"code"}]},{"text":" for the email and the ","type":"text"},{"text":"href","type":"text","marks":[{"type":"code"}]},{"text":" for the phone number when updating the page content","type":"text"}]}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Save and Assign the widget to the ","type":"text"},{"text":"Footer","type":"text","marks":[{"type":"code"}]},{"text":" Widget Section and then Save the assignment.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Create another NOP Widget for the Simple Footer CSS and Name it ","type":"text"},{"text":"Simple Footer CSS","type":"text","marks":[{"type":"code"}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Add the following CSS to the widgets markup section","type":"text"}]}]}]},{"type":"codeBlock","content":[{"text":"","type":"text"}]},{"type":"orderedList","attrs":{"order":6},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Save the widget and Assign it to the ","type":"text"},{"text":"body_start_html_tag_after","type":"text","marks":[{"type":"code"}]},{"text":" widget zone.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Save again and clear the site cache","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"The Simple Footer should now be showing on the site","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Update the background color. The background color is controlled in Theme Designer under ","type":"text"},{"text":"Plugins > Simple Footer > Background Color","type":"text","marks":[{"type":"code"}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Update the text color if needed: The text color is controlled in Theme Designer under ","type":"text"},{"text":"Plugins > Simple Footer > Text Color","type":"text","marks":[{"type":"code"}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"The footer logo will use whatever logo you set for the header under ","type":"text"},{"text":"Header > Logo > Logo Image","type":"text","marks":[{"type":"code"}]},{"text":" by default. You can override this with a different logo under ","type":"text"},{"text":"Plugins > Simple Footer > Logo","type":"text","marks":[{"type":"code"}]},{"text":" if needed.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"The footer logo width will match whatever you set in ","type":"text"},{"text":"Header > Logo > Width","type":"text","marks":[{"type":"code"}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"The fonts will inherit from the Brand Primary Font automatically.","type":"text"}]}]}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Adding/Removing Columns","type":"text"}]},{"type":"paragraph","content":[{"text":"You can add or remove columns as needed and the CSS will maintain the proper layout. The content of the column wrapper ","type":"text"},{"text":"aw-simple-footer--column","type":"text","marks":[{"type":"code"}]},{"text":" must be wrapped in the ","type":"text"},{"text":"aw-simple-footer--column-content","type":"text","marks":[{"type":"code"}]},{"text":" container to maintain the correct content layout as follows:","type":"text"}]},{"type":"codeBlock","content":[{"text":"","type":"text"}]},{"type":"paragraph","content":[{"text":"If the column contains a logo, you must add the ","type":"text"},{"text":"logo","type":"text","marks":[{"type":"code"}]},{"text":" class to the ","type":"text"},{"text":"aw-simple-footer--column-content","type":"text","marks":[{"type":"code"}]},{"text":" wrapper, ie ","type":"text"},{"text":"

","type":"text","marks":[{"type":"code"}]},{"text":". This ensures the Logo remains properly positioned in the column. ","type":"text"}]},{"type":"paragraph"},{"type":"paragraph"},{"type":"paragraph","content":[{"text":"Jacob Note for Boyne requirements","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"you can add a new div below","type":"text"}]},{"type":"codeBlock","content":[{"text":"

","type":"text"}]},{"type":"paragraph","content":[{"text":"so something like","type":"text"}]},{"type":"codeBlock","content":[{"text":"\n","type":"text"}]},{"type":"paragraph","content":[{"text":"then in widget for the footer styles add","type":"text"}]},{"type":"codeBlock","content":[{"text":"#boyne-amex-footer {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: (whatever height you need the footer to be);\n}","type":"text"}]}],"version":1}

CONTACT US

CONTACT US

Browser not supported