Community Portal Branding Information
  • 17 Jan 2023
  • Contributors
  • Dark
    Light
  • PDF

Community Portal Branding Information

  • Dark
    Light
  • PDF

Article Summary

NPact formats your Foundation Cloud Community Portal (FC Community Portal) site to look like your website using colors, fonts, images and more. This creates a seamless transition from the organization's website to the Community Portal for Donors, Applicants, Board Members, etc. Below is what you can expect when setting out to brand FC Community Portal.

Standard Branding: What is included

  • Header: The top section of the web page above the main body of content
    • Header background (i.e., size, color, and shape)
    • One (1) logo supplied by your organization
    • One (1) Navbar either top or side
      • Color for menu items (i.e., links to pages within the portal). For example, the Donor role dropdown with sub menu items such as Recommend Grant, Fund Statement, Gift History, etc. This will be how the user navigates within the portal.  

Chart  Description automatically generated with medium confidence

  • Footer: The bottom section of the web page below the main body of content
    • Footer background (i.e., size, color, and shape)
    • One (1) logo supplied by your organization
    • Contact information 
    • Social media icons 

Graphical user interface, text  Description automatically generated

  • Background: Color, size, border  
  • Mouse over or hover behaviors: Color change. For example, the color will change as users hover their mouse over a button or hyperlink prior to clicking.
  • Tailoring of hyperlinks: Editing of hyperlinks throughout the portal. This includes the header, footer, and main content body. For example, the hyperlink to the Grant Recommendations page from the Grant Summary tile on the home page.
  • Font: Select type to be used throughout the portal. NOTE: Headers will have a larger font size than body text. 
  • Primary User Buttons: The buttons users interact with throughout the portal. For example, the “Submit” button on the grant recommendation page. NOTE: There are a few buttons that cannot be changed.
  • Color used on tabs: Tabs used throughout the portal including those on submission screens. 

Graphical user interface, text, application  Description automatically generated

  • Color used on h1,h2,h3: This refers to the header text used for page titles, section titles, etc.
  • Color used for text content 
  • Banner image: Also known as “hero image”. It is typically located at the top of the page spanning the entire width of the screen. 

Graphical user interface, website  Description automatically generated

Branding Add-On Services

  • Sticky Header: Keeps the header visible at the top of the page even as the user scrolls.
  • Hamburger Menu: A menu display option appearing as an icon. After clicked, a side menu or navigation drawer opens. (This is not related to mobile responsiveness)
  • Side Menu: Standard placement of navigation bar is at the top of the page. This option is available if left-hand side is preferred. NOTE: Right-hand side is not available.

 Branding Does Not Include:  

  • Sitemap
  • Additional hyperlinks: Exception is a “Contact Us” link, which is considered included with standard design.
  • Carousel or image slideshow
  • Animated GIF images 
  • Pop-up windows 
  • Sign-up forms

Was this article helpful?