Branding assets for APA custom web applications
1. Header without top navigation (Section ID: headerContent)
skip to main content
2. Standard Footer (Section ID: footerContent)
*** Sample html code in a custom application ***
... <head> ... <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <link rel="apple-touch-icon" sizes="144x144" href="[APA_ROOT]/Content/Images/launcher-apa-144.png" tabindex="-1"> <link rel="apple-touch-icon" sizes="114x114" href="[APA_ROOT]/Content/Images/launcher-apa-114.png" tabindex="-1"> <link rel="apple-touch-icon" href="[APA_ROOT]/Content/Images/launcher-apa-57.png" tabindex="-1"> <link rel="shortcut icon" href="[APA_ROOT]/Content/Images/favicon-apa.ico" type="image/x-icon" tabindex="-1"> <link rel="stylesheet" type="text/css" href="[APA_ROOT]/css/apa-common.css" tabindex="-1"> <script src="[APA_ROOT]/js/jquery.js"></script> (or connect to CDN) </head> <body> <!-- header container --> <section id="includeHeader"></section> <section class="mainwrap"> <div class="body-container"> [Main page content] </div> </section> <!-- footer container --> <section id="includeFooter"></section> <script> var $j = jQuery.noConflict(); $j(document).ready(function () { $j('#includeHeader').load( "[APA_ROOT]/apa_branding_include.html #headerContent" ); $j('#includeFooter').load( "[APA_ROOT]/apa_branding_include.html #footerContent" ); }); </script> </body> ... --- Environment variable [APA_ROOT] --- QA: [APA_ROOT] = "https://test.apa.org" PROD: [APA_ROOT] = "https://www.apa.org"
