Gå videre til hovedindholdet

SharePoint Branding Modern Pages

SharePoint Apps

SharePoint Branding Modern Pages

I was in Paris two years ago. I had a session about Branding Office 365. Everything went fine, except the one thing missing - branding. I spent all my time telling people not to brand what today is called classic sites - the old fashioned SharePoint pages and sites that we know from SharePoint on-premises.

I was telling people not to invest heavily in branding. Branding that is often thought of as a long term, one time investment on SharePoint on-premises is no longer so on Office 365.

Constant Microsoft updates are "breaking" your branding and modern pages and sites such as Delve, MySite are built in a different way than the classic sites.

I felt that it was important to tell people about it. But it was a sad session. I'm very positive, glad, smiling, always thinking about new opportunities. Not a Microsoft gray material. People that came to my session were expecting to learn how to brand Office 365. We all ended up being sad. The world was gray.

Today, modern pages and sites are here. We are expected to brand them. Customers are saying: "Just give me the usual". I'm thinking, "Yes, hide this, remove that. La la la".

And you would think that after all this time with SharePoint and Microsoft thinking about our business and listening to us that modern pages are easier to brand or at least empty and neutral, so you maybe don't even have to brand.


You have to brand modern pages. Yes, hide, remove.

And I know the world is not perfect. I remember a line from The Matrix movie. Something about "we made a perfect world. You people just kept waking up.".

It's a put a stone in their shoe thing. I understand that. I just think it is too big of a stone.

What is even worse is that people that are set to do this kind of thing are mostly well educated back-end developers with more or less knowledge and appreciation of front-end and styling. We are expected to cheer and by happy: "Yes, I'm cool. I removed the banner! Yes, I moved logo slightly to the left! The search box is a bit smaller now...What a day! A day well spent! Wow!".

Microsoft, you want me to be sad, grumpy and grey. "OK. Sure. La la la".

Modern pages are not empty. Not blank. Office 365 banner is at the top. A giant title and banner taking half of the page. What is that gray thing - a close up of an armpit? What is it doing there anyway. You have to scroll to see the actual content.

Scorching, screaming pink color used both as background and text. It is located just there where you look the most according to Golden ratio design. The menu on the left, yes, the usual, remove site contents and possibly all the rest.

And you know, as an old never beaten, never give up SharePoint developer/consultant/architect, I would say "Yes, hide, remove. La, la, la, la la".

Two years ago, my idea was to have one central place where you can define your branding on Office 365. All pages and sites should then look like that from the start. No need to remove and override scripts and stylesheets.

Modern sites and pages are a step in opposite direction. Branding modern pages is not just a question of having a stylesheet done. There is no UI to include the CSS file. You need to almost hack your way to brand. I mean, the design is not as grueling as Linkedin. I have a few emails and invitations pending on Linkedin. I also have a few announcements to write. I should probably post a link to this blog post. More than 1000 people are following me on Linkedin. I'm postponing, procrastinating since the new design is rolled out. Too strong. Don't like it.

In my opinion, I don't work for Microsoft. I don't have to like the design. I used to brand Microsoft's intranet, did it for 10 years. They apparently don't like it either.

The page is not empty. The gray banner looks like an ad for something. I don't know what. I just block it. And remove it. It could be a Google ad as well, I wouldn't see it.

No, I wouldn't see it. But, I understand why we all just can't block it. Customers want their own design on their own pages and sites. They want their own colors, their own "armpits". It does not matter. You don't brand Outlook. No, each email does not have a gray banner and shocking pink square in it, so I have to scroll and write my message.

In conclusion, I felt the need to find the way how to remove that thing from a modern page. Read more at Branding SharePoint and Office 365

I also wrote
SharePoint Store - Buying an Add-in, the Customer View


Populære indlæg fra denne blog

SharePoint Store - Buying an Add-in, the Customer View

Lite SharePoint add-ins Free to download

Customer at the Microsoft SharePoint Office Store


How hard is to add an app

The practical realization of the dream of making a free app and then eventually earning money

Microsoft made some improvements to the store recently. All improvements are welcome. Microsoft has its own add-ins and is focused on strengthening the platform, Office and SharePoint.
I do not work for Microsoft. No thank you.

I'm, just to make it clear, just as any other developer or a company trying to make money from SharePoint add-ins. My own Store is also open for business.

In the following I'll describe how it is to be a customer at the Microsoft's SharePoint store, the process of finding an app, buying the app... Oh, it is called add-in now...

1. Searching for a SharePoint add-in from SharePoint

I clicked on "Add an app" and searched for "page layouts" from SharePoint

I got 32 results. Nice.

I clicked on the link to open the SharePoint St…

SharePoint Branding Office 365 classic and modern - CSS on localhost - walk on the wild side

I tend to write a line in CSS, save the file and refresh the page in browser so I can see the result. Any tool that is more complicated and takes more time to see the result is not for me.

How can you work with CSS on localhost while seeing the result on Office 365?

1. Create a project in Visual Studio and add a stylesheet (I chose Core 1.0 Cloud project)

2. Click on Debug -> Start Without Debugging
3. Browse to the CSS file on localhost

4. Open a SharePoint site on Office 365 that you want to style

5. Click on "S" icon, paste the URL to the CSS file and click on "Add website" button
Don't have the "S"? Sans Style free. Get it at Chrome web store

6. Refresh the page

You'll get this error:

Mixed Content: The page at 'https://toughcookie.sharepoint.com/sites/dev/SitePages/DevHome.aspx' was loaded over HTTPS, but requested an insecure stylesheet 'http://localhost:57355/css/sansstyle.css'. This request has been blocked; the content…