SharePoint Customization Examples: How to Customize a SharePoint Online Site (Step-by-Step)

If you’ve ever opened a freshly created SharePoint site and thought, “this looks too plain, I need to make it feel like ours” — you’re in the right place.

In this tutorial, I’ll walk you through everything you need to know about customizing a SharePoint Online site. No code required for most of it. We’re talking about practical, real-world customization that you can do right now, whether you manage a Team site or a Communication site.

I’ll cover six major areas: site information, applying templates, themes, header and navigation, footer, and some newer features like flex sections and the Brand Center. Let’s get into it.

What Does “SharePoint Customization” Actually Mean?

When people say “customize SharePoint,” they usually mean one of two things:

• Visual customization – changing the look and feel, colors, fonts, logo, and layout
• Functional customization – adding web parts, building pages, setting up navigation, personalizing content for different users

In this tutorial, I’m focusing mostly on the first category — things any site owner can do using SharePoint’s built-in settings. No developer tools, no PowerShell, no SPFx. Just the gear icon and a few clicks.

That said, I’ll also touch on some slightly advanced options (like the Brand Center and Flex Sections) that Microsoft has rolled out recently — because they’re genuinely useful and not enough people know about them.

1. Change SharePoint Site Information (Name, Description, Privacy)

This is the most basic but often overlooked customization. The site information panel lets you update your SharePoint site name, add a description, and control privacy — all in one place.

Here’s how to get to it:

1. Open your SharePoint site
2. Click the gear icon (top right corner)
3. Select Site information

Inside the panel, you’ll see these options:

• Site name – This is required. Change it to something that clearly describes the site’s purpose
• Site description – Optional, but worth filling in. It shows up in search results and helps people understand what the site is about
• Privacy settings – Choose between Private (only approved members can access) or Public (anyone in your organization can access)
• View all site settings – This takes you to the classic site settings page, where more advanced options live
• Delete site – Only use this if you’re absolutely sure. There’s no undo button here

A real-world tip: Don’t leave the site description blank. When someone searches for this site in Microsoft 365, that description shows up right below the title. A good description helps people quickly decide if this is the site they’re looking for.

2. Apply a Site Template

SharePoint comes with a library of pre-built site templates from Microsoft. These are not just visual themes — they bring in entire page structures, pre-configured web parts, and content layouts specific to different business scenarios.

Some popular templates include:

• Store Collaboration – For retail or frontline teams
• Crisis Communication – For emergency announcements
• Human Resources – For HR portals with onboarding resources
• Learning Central – For internal training and learning content

Here is a screenshot for your reference; you can see a few templates.

To apply a template:

1. Click the gear icon
2. Select Apply a site template
3. Browse the available templates and click on one to preview it
4. Review the site capabilities shown in the preview panel
5. Click Use template to apply it, like in the screenshot below:

One thing to keep in mind: your existing data is safe. Applying a template changes the look and layout of your home page and may add new pages, but it doesn’t delete your lists, libraries, or content. You can access everything from Site contents after the template is applied.

If you ever want to go back to the default home page, just go to the Site Pages library, find Home.aspx, click the three dots (…) next to it, and select Make homepage. Here is a screenshot for your reference:

This is how to apply a SharePoint template.

Check out How To Create Custom Site Template In SharePoint Online?

3. Change the Theme (Colors and Fonts)

This is where it gets fun. SharePoint lets you change the entire color palette of your site in just a few clicks.

Option A: Use a built-in theme

1. Click the gear icon
2. Go to Change the look
3. Click Theme
4. Pick from the available color themes and click Save, like in the screenshot below:

Microsoft provides a decent range of built-in themes. But if your organization has specific brand colors, you’ll want to go further.

Option B: Create a custom theme using the Brand Center (newer feature)

Microsoft recently introduced the Brand Center — a dedicated SharePoint site at the tenant level where IT admins or designated brand managers can define company-wide fonts, colors, and themes.

Here’s the basic flow:

1. Set up the Brand Center (your Microsoft 365 admin does this once)
2. In the Brand Center, go to Add Colors and define your brand hex color codes
3. Then go to Font packages and themes → Add theme
4. Build your theme using the brand colors you defined

Once published, site owners across your organization can apply this custom theme to their own sites — without any PowerShell or code.

Option C: Site-level custom theme (site owners can do this)

Even without the Brand Center, site owners can now create a simple custom theme directly on their site:

1. Click Gear icon → Site branding
2. Go to the Themes tab and click + New theme
3. Define your colors (you can use hex codes directly)
4. Give it a name and click Save

This is perfect when you manage a site that needs to match a specific department’s branding, without waiting on IT.

4. Customize SharePoint Site Header

The header is the first thing people see when they land on your SharePoint site. Customizing it well makes a huge difference in how professional and organized your site looks.

To access header settings:

1. Gear icon → Change the look → Header

You’ll see four sections:

Layout options:

• Minimal – Clean and compact; just the logo and site name
• Compact – Slightly more space; works well for communication sites
• Standard – The default layout
• Extended – Gives you a large banner-style header with more room for branding

Background:
Change the background color of the header bar to match your theme or brand color.

Display options:

• Toggle the Site title on or off
• Upload a custom Site logo (use a PNG with a transparent background for best results)
• Set a Site logo thumbnail for compact header display

Once you’re happy with the changes, click Save.

Practical example: For a company intranet homepage, I usually go with the Extended layout, upload the company logo in white, and set the background to the company’s primary brand color. It immediately makes the site feel branded and intentional.

5. Customize SharePoint Site Navigation

Navigation is what helps people find things on your site. Poor navigation is the number one reason people give up on SharePoint sites. Let’s fix that.

Go to Gear icon → Change the look → Navigation

Here you can control:

Site navigation visibility:
Toggle the navigation on or off entirely. For sites that are single-page or landing pages, turning off navigation can actually look cleaner.

Orientation:

• Vertical – Navigation appears on the left side (default for Team sites)
• Horizontal – Navigation appears at the top

If you go horizontal, you also get to choose between:

• Mega menu – Shows a large dropdown grid, great for sites with many subsections
• Cascading – Traditional dropdown menu

Here is a screenshot for your reference.

My recommendation:

• For Team sites used by a small team → stick with vertical navigation
• For Communication sites used as company intranets → go with horizontal + mega menu. It handles lots of links much better and looks more polished

Below is a SharePoint team site left navigation, check the screenshot below:

You can further edit the actual navigation links by clicking Edit on the navigation bar itself. From there, you can add links, reorder items, and create sub-links.

Check out Create a Dropdown Navigation in SharePoint [With Sublinks]

6. Customize the Footer (Communication Sites Only)

This one surprises a lot of people — the Footer option is only available on Communication sites, not Team sites. If you’re on a Team site and don’t see it, that’s why.

To access footer settings:

1. Gear icon → Change the look → Footer, follow the screenshot below:

You’ll get these controls:

• Enable – Toggle the footer on or off
• Layout – Choose between Simple (single row) or Extended (multi-row with more links), like in the screenshot below:

• Logo – Add a footer logo (company logo or department icon)
• Display name – The label that appears in the footer, like your company name or site name
• Background – Change the footer background color

After saving, you can also click Edit directly on the footer to add navigation links and labels — similar to how you edit the top navigation.

Good use cases for the footer:

• Links to legal/compliance pages
• Contact information or support links
• Links to related sites in your organization
• Social media links for company-wide communication sites

Check out SharePoint Site Left Navigation or Quick Launch

7. Add and Customize Web Parts on Pages

Beyond the site-level settings, you can also customize individual pages by adding and configuring web parts. Think of web parts as the building blocks of your pages.

To add a web part to a page:

1. Click Edit on the page (top right)
2. Hover over a section and click the + button to add a web part
3. Search for the web part you want

Some of the most commonly used web parts for customization include:

• Hero – A visual banner-style section great for homepages; supports images, titles, and links
• News – Automatically pulls in recent news posts from your site or across your SharePoint environment
• Quick Links – A clean, icon-based link section for directing users to key resources
• Highlighted Content – Dynamically surfaces documents, pages, or sites based on filters you set
• People – Displays profile cards for specific team members
• Events – Shows upcoming calendar events
• Text and Image – For adding formatted content with supporting visuals

New Flex Sections:
Microsoft recently introduced Flex Sections as a major upgrade to how you lay out page content. With Flex Sections, you can freely move, resize, overlap, and group web parts on a 2D grid — giving you much more design freedom than the older column-based layout.

To use a Flex Section:

1. While editing a page, click the + Add a section option
2. Choose Flexible layout
3. Now you can drag and drop web parts anywhere within that section and resize them freely

This is a huge upgrade if you’ve ever felt constrained by SharePoint’s default 1-, 2-, or 3-column layouts.

Check out SharePoint Editorial Card Web Part

8. Customize Site Pages vs. Home Page

Here’s something that trips people up: the Home page of a SharePoint site is just one page in the Site Pages library. You can create multiple pages and set any of them as the new homepage.

To create a new page:

1. Click Gear icon → Add a page
2. Choose a page template or start from blank
3. Customize it with web parts
4. When ready, click Publish

To make a different page the homepage:

1. Go to Site contents → Site Pages
2. Find the page you want
3. Click the three dots (…) next to it
4. Select Make homepage

Why would you do this?
Say you applied a template and don’t love the default home page it created. You can build a completely custom page and swap it in as the homepage without touching anything else the template set up.

9. Personalized Content with Audience Targeting

This is one of the more powerful but underused features in SharePoint. Audience targeting lets you show specific content only to certain groups of users — while everyone else sees something different (or nothing at all).

For example, you could set up a news web part on your intranet homepage to show HR-specific announcements only to the HR team, while the IT team sees IT-related updates in the same space.

Here’s how to enable it:

For a web part:

1. Edit the page
2. Click on the web part you want to target (e.g., News, Highlighted Content, Quick Links)
3. In the web part settings, look for Enable audience targeting and turn it on
4. Now you can target specific Microsoft 365 groups

For a news post or document:

1. Go to the SharePoint library or list
2. Open the settings and enable Audience targeting on the library/list itself
3. Add the target audience column to the items you want to target

This works best when your users are properly organized into Microsoft 365 groups or security groups — which is another reason to keep your Azure AD groups tidy.

10. Quick Branding Tips That Make a Real Difference

Before I wrap up, here are a few quick wins that I always recommend when customizing a SharePoint site:

• Use a transparent PNG logo – It blends cleanly into any background color
• Stick to 2–3 brand colors – More than that starts looking chaotic
• Match your header background to your main brand color – It immediately looks intentional
• Keep navigation items under 7 – More than that and people start ignoring the menu
• Use the Hero web part on the homepage – It adds visual weight and makes the page feel designed, not assembled
• Add a site icon (favicon) – Go to Site information → Site logo and upload a square icon. It shows up in browser tabs and search results

Team Site vs. Communication Site: What Can You Customize?

People often ask whether the customization options differ between the two site types. Here’s a quick breakdown:

Customization Option	Team Site	Communication Site
Site Information	✅	✅
Apply a Site Template	✅	✅
Theme	✅	✅
Header	✅	✅
Navigation (vertical)	✅	✅
Navigation (horizontal/mega menu)	✅	✅
Footer	❌	✅
Audience Targeting	✅	✅
Flex Sections	✅	✅

The Footer is the big one — it’s exclusive to Communication sites. Everything else is available on both.

Here is a video I recorded and uploaded to the YouTube channel on SharePoint site customization.

Conclusion

Customizing a SharePoint Online site doesn’t have to be complicated. Start with the basics — update your site name, apply a theme that matches your brand, set up the header and navigation, and drop a few well-chosen web parts on your homepage. That alone will make your site look 10x better than a fresh out-of-the-box install.

Once you’re comfortable with those, move on to things like audience targeting, custom themes via the Brand Center, and Flex Sections for more advanced layout control.

The goal is a site that feels like it was built for your team — not just a generic SharePoint template that nobody wants to use.

You may also like:

• SharePoint Calendar Color Coding
• How To Add a Calendar in SharePoint Online
• When to Use OneDrive vs SharePoint for File Storage