Thank you SPS Charlotte!

This past weekend I was pleased to speak at SharePoint Saturday Charlotte. It was an awesome time and is one of the best SPS events out there. I had a great time presenting both Getting Started with the SharePoint Framework (SPFx) and Office 365 List Formatting (Slides can be found below).

DkWaC6QXsAY2qD8
Photo courtesy of John Warner (@kingfumaster)

Both sessions were full of people asking great questions and actively participating. Presenting at these events can be a lot of work and requires not just the travel and the weekend time, but often many many hours of prep. Unfortunately, not every event feels worth it, but the attendees at SPS Charlotte were genuinely interested and engaged and I felt like I was able to both teach and encourage them to do awesome stuff.

Having spoken to several attendees (of not just my sessions) the overall sentiment was very positive. I wasn’t the only one amazed that these SharePoint Saturdays are FREE. The quality of speakers, sponsors, and attendees all put together by fantastic organizers is super impressive. If you missed it this year, be sure to correct that mistake next August!

P.S. – Charlotte has public electric scooters that are super cheap to ride. I rode all over downtown after the event and even went 4 miles on one the next day on my way to the airport. Even if you don’t use SharePoint, you gotta get to Charlotte just to feel the wind in your hair, the jealous stares of the walking pedestrians, and the unbridled feeling of freedom while traveling at 8 mph on a lime green scooter.

Resources

Join me at SharePoint Saturday Charlotte on August 11th!

I will be presenting Getting Started with the SharePoint Framework (SPFx) and O365 List Formatting on Saturday, August 11th 2018 in Charlotte as part of SPSCLT!

SPSCLTvan

Last year’s event was awesome! Don’t miss this opportunity for free training with keynotes by Bill Baer, Brian Alderman, AND Naomi Moneypenny (Not to mention all the other great speakers)!

I’ll be presenting Getting Started with the SharePoint Framework (SPFx) at 10 am. This session will provide an overview of all your customization options and focus on where the SharePoint Framework fits in that ecosystem. You’ll leave this session knowing what the SharePoint Framework is, what it can do, when to use it, and how to get there. I’ll also provide you a bunch of tips and tricks to get you going right away.

Then I’ll be presenting O365 List Formatting at 11:15 am. We’ll cover Column Formatting and take a look at the soon to be released View formatting. We’ll talk about both the power and flexibility of this approach along with some of the limitations. I’ll share the basics of list formatting, tips and tricks, and tools and resources available to enable you to get started immediately (including a demo of Column Formatter 2.0).

I’m really excited to return to SPS Charlotte. Great attendees, great speakers, and great SWAG all at a FREE event – don’t miss it!

Thank You SPSNYC!

This past Saturday I had the honor of speaking at the 10th annual SharePoint Saturday New York City. It was a great event and I really enjoyed presenting on Getting the Most out of SharePoint Patterns and Practices (Slides can be found below).

Photo Jul 29, 11 02 02 AM

Due to some kind of crazy weather in NYC, I had all sorts of trouble getting there. My non-stop, 2.5 hour flight from Indianapolis turned into 4 different flights (including one that just sat on the runway for 2 hours before unloading us) and took 26 hours. I ended up in Charlotte, NC (2 weeks early!) and had to scramble to make it to NYC on time. I showed up about 40 minutes before my session but I had no luggage.

I gave my talk wearing shorts and a random NC shirt I bought in the airport and everyone was very cool about it. In fact, the talk went very well. People seemed genuinely very interested in PnP and a lot of great questions were asked. I was able to talk to some of the attendees afterwards and while they had heard about some portions of PnP, there were several things that were new (and exciting) to them. So… mission accomplished!

I flew from NYC to Seattle for some meetings and just got home yesterday. I was reunited with my bag just in time to pay an additional bag check fee to bring it home (Bags normally take 6 days, right?). Oh well, things worked out pretty well in the end and they could have been far worse.

The SPSNYC event, however, was very well done. Great organizers, speakers, vendors, and attendees all in a cool location and all for free. If you missed it this year, don’t make the same mistake in 2019! Thank you to everyone that came out!

Resources

Join me at SharePoint Saturday New York City on July 28th!

I will be presenting Getting the Most out of SharePoint Patterns and Practices (PnP) on Saturday, July 28th, 2018 in New York City as part of SPSNYC!

home_alone_2_lost_in_new_york_1920x1080

There are 54 sessions – all for free!

I’ll be talking about SharePoint Patterns and Practices (PnP):

The SharePoint Patterns and Practices (PnP) is an open source initiative coordinated by SharePoint engineering – but what does that mean and why should you care? PnP has tons of tutorials, videos, samples, documentation, and tools (as in amazing, ground-breaking tools). If you haven’t heard of it or if you thought it was just one or two things, you’re doing SharePoint development on hard mode!

In this session we’ll dive into what’s available, how to get started, how to stay up to date, and even how to contribute. You’ll leave this session knowing not only what PnP is, but you’ll be ready to start taking advantage immediately! It doesn’t matter if your using On-Premises or Online, you’re sure to learn something new and likely amazing.

I’m really excited to not just speak, but also to attend! The schedule and speaker lineup looks amazing and it’s sure to be a great event. If you happen to be one of the few people living in New York or the surrounding area, join us for FREE training, a bunch of swag, and a chance to meet people who are also passionate about SharePoint and doing awesome stuff.

Tracking SharePoint Popular Items Accessed through JavaScript

Applies to: SharePoint 2013+

A while back I wrote an AngularJS app running in SharePoint 2013 and using lists as the backing store for some components. Without getting into the reasons this particular architecture was chosen, let’s look at an issue that came up.

The client asked us to show the popular items. There is a standard web part for this, but you can also query the search API directly by sorting by ViewsLifeTime:descending which is what we did so that we could display it in a custom Angular directive. No problem! Right?

It wasn’t until some time later that the client asked about the results we were displaying. The most “popular” items appeared to be the ones they had had trouble with behind the scenes and didn’t match their expectations about what users would be viewing.

Unpopular

When you view a list item (dispform.aspx?id=X) this view is tracked in SharePoint’s Usage Analytics (assuming you’ve configured this correctly). It’s this information that is used by search to determine an item’s popularity.

Unfortunately, it turns out pulling items from the REST API triggers no such view event. This seems obvious in retrospect, but until we really thought about it, usage tracking is just one of those magical behind the scenes things SharePoint does and we just assumed it would work.

This explains the results the client was seeing. The items they were having trouble with are the ones they were viewing directly (outside of the Angular app). While this wasn’t a ton of traffic, it was far more than any other list item was getting since they were only being viewed via the REST API inside a custom application. Ugh.

Fortunately, the fix for this isn’t too complicated, it’s just not very obvious.

Spoofing Item Views in JavaScript

You can log a View event using the SP.Analytics.AnalyticsUsageEntry.logAnalyticsEvent2 method. I had trouble finding any helpful documentation on this method or what the parameters should be. Fortunately, after some experimentation (and patience as the entries are not immediately available), I got it working.

Here’s the basic JS code which you can then adapt and make smarter:

For instance, I adapted the above into an AngularJS service and wrapped the call to get the site Id and user into a promise so that I only had to pull that once in my app, but all of that is up to you.

One nice thing about doing this manually is you can control when it fires. For instance, you might want to only log usage during reads but not during edits or exclude administrative accounts, etc.

That’s it! Now your custom interface can participate in the internal popularity contest!

Setting the Accent Color of Your Modern Site’s Custom Theme

Modern pages in Office 365 let you “Change the Look” by providing a number of themes (sets of colors) that can be applied to your site (available from the gear menu in the top-right of the screen). The interface is pretty slick, it takes immediate effect, and the default options are so much better than those weird sets of themes from the classic days.

You can even do minor customization by clicking the customize link under your chosen theme. You can choose from one of the preselected primary colors and an accent color (designed to match your primary). Generally, these colors are great and have been selected to look good in most scenarios.

CustomizeColorsInUI

But I can’t pick the exact shade of red marketing has decreed that all things must be! Fortunately, you can create your own theme with the exact colors you want. You can even generate these using the UI Fabric Theme Generator. This is pretty easy, and Mikael Svenson wrote up a nice guide on doing this using PnP PowerShell.

If you follow his guide, and the official documentation, you can easily get a nice custom theme. However, one annoying and not obvious part is setting the accent color. If you use the generated theme you might end up with something like this:

SoPrettyDefault

For this theme, I used the Theme Generator. By default, you specify the primary color (the big rectangle on the left in the theme) and then all the other colors are variations of it. However, you can click on any of the generated colors to override them. I did this as you can see above by overriding themeSecondary (2nd box in the theme) and themeTertiary (3rd box in the theme):

SoPrettyFabricPalette

But what about that 4th box, the accent color? This wasn’t part of the generator and I couldn’t find it documented anywhere. You also don’t get the nice Customize link to let you set it. Instead, the accent color is set to the same as the primary color. This results in things like that weird square in the hero part being the exact color as your buttons, etc.:

StupidAccentFailure

Turns out setting this isn’t hard, it’s just not obvious. All you do is add an “accent” value to your generated list of colors like so:

@{
"themePrimary" = "#144e3a";
"themeLighterAlt" = "#d8f5eb";
"themeLighter" = "#b4ecd8";
"themeLight" = "#90e2c6";
"themeTertiary" = "#edd249";
"themeSecondary" = "#6b4130";
"themeDarkAlt" = "#30bb8a";
"themeDark" = "#279770";
"themeDarker" = "#1e7355";
"neutralLighterAlt" = "#f8f8f8";
"neutralLighter" = "#f4f4f4";
"neutralLight" = "#eaeaea";
"neutralQuaternaryAlt" = "#dadada";
"neutralQuaternary" = "#d0d0d0";
"neutralTertiaryAlt" = "#c8c8c8";
"neutralTertiary" = "#a6a6a6";
"neutralSecondary" = "#666666";
"neutralPrimaryAlt" = "#3c3c3c";
"neutralPrimary" = "#333333";
"neutralDark" = "#212121";
"black" = "#1c1c1c";
"white" = "#ffffff";
"primaryBackground" = "#ffffff";
"primaryText" = "#333333";
"bodyBackground" = "#ffffff";
"bodyText" = "#333333";
"disabledBackground" = "#f4f4f4";
"disabledText" = "#c8c8c8";
"accent" = "#B81344";
}

Adding that last line results in this:

SoPrettyWithAccent

WithAccent

Looks like there are a couple of other values you can add (and possibly more) such as “neutralSecondaryAlt”, “blackTranslucent40”, and “error”. Just like most of the entries, however, it’s not totally obvious when they’re used.

Now you no longer have an excuse not to set that sweet accent color to the boring shade dictated by your corporate style guide!

The PnP Super Heroes we “Need”

Back in November, I reworked the PnP Hero as an opensource SVG Vector image making several corrections and ensuring the hero looks good at any size. Then earlier this year, Vesa Juvonen announced he was using this design for some stickers (I’ve since gotten hold of one and they are awesome):

PnPHeroStickers

One of the things that became obvious though was that people would like to see more than just a dude. So… here’s my attempt at a lady:

PnPHero-Female-Original

Don’t like it or think something’s off? Good news! You can totally update it and submit a PR over in the PnPHero-SVG repo on Github!

While I don’t think there’s necessarily anything wrong with the PnP Hero we’ve had (but I wouldn’t would I), I think it’s important to be as inclusive as possible to make it clear that PnP is for everyone. After all, Sharing is Caring.

SharePoint PnP has contributors from all over the world of various gender and ethnicity. So, following the great example of emojis everywhere, in addition to female heroes, the PnP heroes now come in original, light, medium-light, medium, medium-dark, and dark skin tones:

MaleHeros

FemaleHeroes

The repository has a master SVG file with all of the layers, but there are also individual SVG files (as well as png files) for each included. These files can be freely used for anything (PnP related or not) with no attribution required.

This isn’t meant to be political commentary in any way, just an attempt to be more inclusive. Let me know what you think and if there is anything you think should be changed/added.