Newsroom Header and Footer

Selecting the right header and footer setup is one of the first steps in finalising the design of your Newsroom. This choice ensures that your Newsroom is visually consistent with your corporate site while meeting your needs for flexibility and maintenance.

Three header and footer options

You can choose from three options:

1. Dynamic Header and Footer (Recommended)

  • How it works: Uses SSI files (Server Side Includes) to inject the same dynamic code as your corporate website.
  • Best for: When you want your Newsroom to exactly match the look, feel, and behavior of your company site.
  • Advantages:
    • Any changes made by your IT team on the corporate site are automatically reflected in the Newsroom.
    • Ideal if headers and footers are updated frequently.

2. Static Header and Footer (built by Presspage)

  • How it works: Presspage builds a standalone header and footer using the default Newsroom (Vanilla) template, customized to your brand.
  • Best for: A simple setup with only a few links back to the corporate site.
  • Considerations:
    • Supports existing template functions.
    • New features outside the Presspage template or platform need to be submitted and reviewed before deciding if it can be developed.

3. Stripped Header and Footer

  • How it works: If SSI files cannot be provided but a more complex design is needed, Presspage can replicate your header and footer by stripping code from your corporate site.
  • Best for: Organizations that need a closer visual match to their website but cannot use SSI files.
  • Considerations:
    • Some limitations may apply due to technical constraints.
    • Updates are more complex—larger changes may require re-stripping or additional resources.

Change Requests After Onboarding

  • For Static and Stripped headers and footers, change requests should be submitted to support@presspage.com after onboarding.
  • Smaller changes may be implemented quickly.
  • Larger changes may require additional scoping and will be scheduled within sprint cycles.

Requirements for implementing a dynamic header and footer (SSI)

To implement a Dynamic SSI header and footer, we require three separate files:

  • header.html – contains the website header, including menus and navigation
  • footer.html – contains the website footer
  • head.html – contains all necessary stylesheets (CSS) and JavaScript to run the header and footer

In practice, you’ll need to provide us with online URLs to these files (e.g., https://example.com/assets/header.html).

File Guidelines

  • No meta tags should be included in the HTML files.
  • URLs must be absolute, including both the domain and the path.
  • Avoid generic class names to prevent conflicts with Presspage templates.
  • CSS in head.html should be stripped to essentials and wrapped in a dedicated wrapper class to avoid conflicts with Newsroom styling.

    For example, wrap the inline CSS in a wrapper class like <div class="example-wrapper"> and prefix all CSS with this class (except the html and body elements).

    So for example, instead of:

      ul li {
          position: relative;
          margin: 0;
      }

    use:

    .example-wrapper ul li {
          position: relative;
          margin: 0;
      }

Hosting Considerations

If your Newsroom is hosted on a subdomain, ensure that your server’s CORS policy allows assets (e.g., fonts) to load from your corporate website.

Was this article helpful?
0 out of 0 found this helpful