Global Site Settings, Header & Footer Configuration
When launching a B2B export website, consistent branding identity and universal layout components are paramount—including your browser tab icon (Favicon), header logo, corporate color palette, top announcement banner, navigation menus, and footer legal/social links.
In SymbolFlow Appsuite, these site-wide attributes are centrally managed under the Globals section of Payload CMS.
This guide covers everything you need to know about Site Settings, Header, and Footer.
1. Site Settings
Section titled “1. Site Settings”In Payload CMS, locate Site Settings (网站设置) under the Globals section in the left sidebar:
1. Identity & Media Assets
Section titled “1. Identity & Media Assets”| Field Name | CMS Key | Format & Recommended Standard | Business Purpose & Placement |
|---|---|---|---|
| Website Name | appName | Text (localized for — en, — zh) | Your official corporate brand name. Appended automatically as the suffix in SEO titles (e.g. VD Cylindrical Damper | MyFactory) and displayed when no logo image is provided |
| Site Description | description | Textarea (localized) | High-level summary of your core business. Serves as the fallback SEO meta description whenever a specific page lacks custom metadata |
| Favicon | favicon | .ico, .png, or .svg (ideally 32×32 or 16×16 px) | Small icon rendered in browser tabs, bookmarks, and mobile home screen shortcuts |
| Logo | logo | Transparent PNG or crisp SVG vector | Primary brand trademark rendered in the top-left navigation bar and footer |
| Default Meta Image | defaultMetaImage | Recommended aspect ratio 1.91:1 (1200×630 px, under 300KB) | The default preview card image fetched when overseas buyers share your links across WhatsApp, LinkedIn, Facebook, or Skype |
| Prevent Search Indexing | preventIndexing | Checkbox (Boolean) | ⚠️ Warning: Outputs Disallow: / in robots.txt. Use only during initial private staging; ensure this is unchecked prior to public launch! |
2. Top Banner Ribbon
Section titled “2. Top Banner Ribbon”- Role: A prominent, full-width colored ribbon rendered at the very top of the website.
- Editing Experience: Rich text editor (supports bolding, highlights, and inline hyperlinks) with native multi-language support.
- Typical B2B Scenarios:
- Holiday Closure Notices:
"Notice: Our factory will be closed for the Lunar New Year from Feb 10-17. Inquiries will be answered within 24 hours." - International Trade Fairs:
"Meet us at Hannover Messe 2026 (Hall 4, Booth D18)! Click here to book an on-site technical consultation." - Quality Certifications:
"We have officially achieved IATF 16949:2016 automotive compliance certification!"
- Holiday Closure Notices:
- Dismissal: Clear the text content and save; the banner automatically disappears.
3. Theme & Color Palette
Section titled “3. Theme & Color Palette”Appsuite incorporates a professional industrial theming engine:
- Theme Selector: Quickly switch between pre-engineered industrial aesthetics (e.g. Precision Engineering, Clean Tech, Classic Industrial);
- 4-Tier Color Pickers (Colour Picker):
- Primary Color: The core brand accent used for primary CTAs, active states, and price highlights;
- Secondary Color: Supporting accent for secondary buttons and badge backgrounds;
- Tertiary Color: Highlight color for promo flags and notification dots;
- Neutral Color: Governs text contrast and card border shades.
[!TIP] Enter standard Hex codes (e.g.
#0F52BA) directly into each field to match your corporate brand identity guidelines.
4. Global JSON-LD Schema Settings
Section titled “4. Global JSON-LD Schema Settings”Search engines like Google rely on JSON-LD structured data to establish an official Knowledge Graph entity for your company. Configuring these fields boosts corporate search authority:
- Enable Global Schema (
enableGlobalSchema): When checked, the engine automatically outputs schema-compliantWebSiteandOrganizationentities across all HTML pages; - Social Media Profiles (
sameAs):- Add entries for your corporate profiles across major networks;
- Examples:
https://www.linkedin.com/company/your-factoryhttps://www.youtube.com/@yourfactory-officialhttps://twitter.com/yourfactoryhttps://www.facebook.com/yourfactory
- SEO Value: Informs Google algorithms that these social channels belong to the same entity as your website, enriching search SERP profiles.
- Customer Service Phone (
phone):- ⚠️ Formatting Requirement: Must strictly adhere to the international E.164 standard, starting with a
+and country code (e.g.+86-10-88888888or+1-800-555-0199) to pass Google structured data validation.
- ⚠️ Formatting Requirement: Must strictly adhere to the international E.164 standard, starting with a
- Customer Service Email (
email): e.g.sales@yourfactory.comorinquiry@yourfactory.com.
2. Navigation Header Configuration (Header)
Section titled “2. Navigation Header Configuration (Header)”In Payload CMS, navigate to Globals -> Header (页头):
1. Navbar Type
Section titled “1. Navbar Type”Choose between two industrial-grade navigation behaviors:
- Simple / Flat: Best for focused product catalogs. Configures up to 6 top-level navigation links (e.g., Home, Products, Solutions, About, Contact).
- Grouped / Two-level: Engineered for multi-category enterprises. Enables multi-tier Dropdown Groups.
2. Item Setup & Multi-Language Localization
Section titled “2. Item Setup & Multi-Language Localization”Within navItems or groupedNavItems:
- Link Target: Link to internal CMS pages (e.g.,
/about-us) or custom external URLs; - Dropdown Groups:
- Set Item Type to
Dropdown Group; - Enter the group label (e.g.,
Products by Industry); - Add sub-links within the
Sub Linksarray;
- Set Item Type to
- Independent Multi-language Support: All navigation items are Localized. Configure English labels (
Products,OEM Solutions) inenmode, and native Chinese equivalents (产品中心,OEM定制) inzhmode.
3. Footer Configuration (Footer)
Section titled “3. Footer Configuration (Footer)”In Payload CMS, navigate to Globals -> Footer (页尾):
The footer is where international procurement managers verify corporate identity, legal terms, and social proof:
1. Copyright Statement
Section titled “1. Copyright Statement”- Supports multiline rich text and localization.
- Standard compliant example:
© 2026 SymbolFlow Industrial Technologies Co., Ltd. All Rights Reserved.Certified ISO 9001:2015 & IATF 16949 Manufacturer.
2. Multi-Column Navigation (Footer Columns)
Section titled “2. Multi-Column Navigation (Footer Columns)”- Supports up to 4 distinct columns;
- Each column includes a Label and an array of navItems;
- Recommended 4-Column Industrial Structure:
- Column 1 [Products]: Cylindrical Mounts, Rubber Isolators, Custom Molded Parts, CAD Library;
- Column 2 [Solutions]: HVAC Applications, Genset Dampers, Marine Engineering, Heavy Machinery;
- Column 3 [Support]: Prototyping Policies, Sea Freight Lead Times, Quality Control, FAQ;
- Column 4 [Company]: Factory Overview, Workshop Tours, Compliance Certificates, Privacy Policy.
3. Social & Channel Links (Social Links)
Section titled “3. Social & Channel Links (Social Links)”- Configure platform links:
- URL: Full destination link;
- Label: Display tag (e.g.
LinkedIn,YouTube,WhatsApp); - Lucide Icon Picker: Select from hundreds of clean Lucide vector icons;
- Custom Icon Image: Upload custom emblem or trade association seals directly.
4. Live Preview & Deployment
Section titled “4. Live Preview & Deployment”- Side-by-Side Verification: While editing Site Settings, Header, or Footer, click Preview in the CMS header to inspect logo proportions, mobile menu transitions, and footer layouts within seconds;
- Audit Across Languages: Use the language dropdown to verify that navigation labels and copyright notices are translated for all active target markets;
- Save and Deploy: Click Save Changes, then trigger Build & Deploy from the SymbolFlow Platform Dashboard to publish the global branding updates worldwide!