Bulk tagging in SharePoint Online

Tagging resources with metadata can provide a range of advantages when it comes to sorting, grouping and searching.

You might decide to create a custom view to group items outside of any folder structure. This would be particularly useful if you had a complex folder structure but wanted to group all the documents of a particular topic together (outside of the folder structure).

Bulk Tagging

Tagging in SharePoint Online is really easy and you can even do this in bulk.

Let’s take this folder as an example. I have a “Topic” managed metadata column which I want to update for all the documents in this folder.

Metadata view

Select the documents which require tagging (click the checkbox to the left of the document). Use the checkbox at the top if you want to select all the documents.

Document selection

Open the information panel by selecting the “i” symbol shown below.

SharePoint information panel

You can now bulk tag documents. You will only change the columns in which you enter a value (you won’t wipe the other choices).

Edit columns

Press Save. They are all instantly tagged!

Tagged documents in SharePoint

Now that the documents are tagged, they will appear in search results for the tag, any views containing this column and any grouped views.

For more SharePoint news:

Sign up for our Education tips, guides and product news or Business tips, guides and product news.

Find out more about SharePoint in education, Teams and Class Notebook by attending a webinar.

How to create a Microsoft Graph SharePoint Web Part to show recent OneDrive files

How exciting, SharePoint web parts can now talk to other parts of Office 365 rather than just SharePoint using the Microsoft Graph and third party APIs!

With the release of the SharePoint Framework version 1.4.1, we now have preview support of the Microsoft Graph API.

In this example, I’m going to create a SharePoint Framework web part to show my latest OneDrive files.

SPFx Microsoft Graph Web Part

I’m going to assume that you already know how to create SharePoint framework web parts, if you don’t, take a look at my previous blog posts:

I will begin with a new SharePoint framework project (no JavaScript framework) using the latest version 1.4.1 (see getting started).

In the new project, open the web part typescript file (src\webparts\webpartname\webpartname.ts).

Import the MSGraphClient using the following code:

import { MSGraphClient } from '@microsoft/sp-client-preview';

Inside the render function in our default class, we are going to define a variable for the service scope.

const client: MSGraphClient = this.context.serviceScope.consume(MSGraphClient.serviceKey);

We can make it easier to catch errors when coding against the MS Graph by installing the typings. You can do this from the terminal in VSCode by running:

npm install @microsoft/microsoft-graph-types –save-dev

This then needs to be imported in the web part typescript file.

import * as MicrosoftGraph from '@microsoft/microsoft-graph-types';

Under the line defining the service scope, add the following code to get data from the graph API

    client
      .api('me/drive/recent')
      .get((error, files: MicrosoftGraph.DriveItem, rawResponse: any) => {
        // handle the response
        for (var _i = 0; _i < rawResponse.body.value.length; _i++) {
          htmlcode += `<a href="${rawResponse.body.value[_i].webUrl}">${rawResponse.body.value[_i].name}</a></br>`;

        }
      this.domElement.innerHTML = `
      <div class="${ styles.myOneDriveFiles }">
        ${htmlcode}
      </div>`;
    });

Configuring API permission requests

In the package-solution json file (in the config folder), we need to define which Graph permissions we will be using.
Under “skipFeatureDeployment”, add the following JSON.

"webApiPermissionRequests": [
      {
        "resource": "Microsoft Graph",
        "scope": "Files.Read"
      }
    ]

To determine the permission levels and which API to use, I used the following references:

Graph Explorer
Permission Scopes

So we can test this, we need to allow access for this API in the Office 365 admin centre. To do this we are going to build and package the solution and then add it to the app catalog.

To package the solution, run the following commands from the VSCode terminal:

gulp bundle –ship

gulp package-solution –ship

This will create a SPPKG file in the sharepoint\solution folder. This is the file you will need to drag and drop into the tenant App Catalog. Please note that the next steps can only be performed on a first release tenant (not just a first release user).

You will see the additional highlighted message below.

SPFx Microsoft Graph Web Part

Open the SharePoint Admin Centre of your tenant, and select to “Try the new SharePoint admin center”, in the upper right corner of the screen.

SPFx Microsoft Graph Web Part

Select “API management”

SPFx Microsoft Graph Web Part

There seemed to be a bit of a bug on this page, I had to refresh a few times before it appeared and it appeared twice (maybe because i tried uploading to the app catalog twice).

Select the request and press Approve

SPFx Microsoft Graph Web Part

Add the web part to a modern page. If you have a pop-up blocker enabled in chrome, you will be asked to disable this.

SPFx Microsoft Graph Web Part

After reloading the page, wow we see Microsoft Graph data inside a SharePoint web part!!

SPFx Microsoft Graph Web Part

You can download the source code from my GitHub page

Creating a quiz using Microsoft Forms in OneNote

Microsoft Forms are a great way to quickly gather survey results or produce quizzes. It could be testing employees on health and safety in OneNote or it could be setting students a topic quiz in Class Notebook.

In this post, I’m going to go through the steps on how to add a quiz to OneNote.

First, create a new page and call it “Quiz”.

Class Notebook

Go to the insert tab in the ribbon and select “Forms”.

Microsoft Forms

Here you will see a list of any forms and quizzes that you previously created in addition to the new options.

List of forms

Click “New Quiz”.

Microsoft Forms will open in a new tab, give the quiz a title and description.

Click “Add question” and select “Choice”.

Enter a question and all the options, you can press “Add option” to add more answer options.

Next to each answer option, you can provide some feedback for users who select this option using the speech bubble icon (see highlighted below).

Mark the correct answer by selecting the tick icon (see highlighted below).

At the bottom of the question, you can assign points for the correct answer, allow multiple answers and make it a required question.

By pressing the menu (…), you can bring up more options such as shuffling the answers or writing math equations.

You can add more questions by clicking “Add question”. The form will save automatically as you edit it (no save button).

When you have finished creating your quiz, switch the browser tab back to the OneNote file, you will see that the quiz has now appeared in the “My forms” list.

Press the “Insert” button.

Our quiz is now embedded on the page!

When users complete the quiz, they will see their points after pressing submit (with feedback on each question).

The author of the quiz can go back into “Microsoft Forms” via the app launcher (see highlighted below).

They can then see a detailed breakdown of the results with the option to export to Excel.

Microsoft Forms can also be added to SharePoint pages, so you can enhance your intranet with surveys and quizzes!

Microsoft Forms is a great tool in the Office 365 package. By using this tool in your organisation, you could really improve engagement with users.

At Cloud Design Box, our solutions help schools and companies get the best out of SharePoint, Teams and OneNote.

More information on our education and business solutions can be found on our website.

Cloud Design Box Class Dashboard

Bett 2018

I’m going to be at Bett 2018 next week with the Cloud Design Box team, really excited to have some stand space this year with our MIS integration partners SalamanderSoft. Cloud Design Box will be showcasing the best of SharePoint, Class Notebook and Teams integration.

Our stand number is C210, opposite Google on the main corridor leading to the Bett Arena. We even have a seating area and coffee machine if you want to get away from the hustle and bustle of Bett for a while.

Please feel free to pop by and hello to myself, Darren and Lloyd. If you can’t make it, you can sign-up to a webinar so that you don’t miss out on all the exciting Office 365 news and the latest developments.

We will be launching our new SharePoint intranet packages containing features such as:

  • Class Dashboard (find all your class data across SharePoint, OneNote and Teams in one easy to access place)
  • Modern SharePoint UI Branding (Our slick new branding and navigation interface for the new look SharePoint)
  • Team Provisioning and Extensions (We create Teams from MIS data and extend the functionality even further with student folders and class pages)
  • SharePoint site automation and templates
  • Workflows, training, support and much more!

You can find out more about Cloud Design Box’s products here.

Our partners SalamanderSoft will be showcasing:

  • A new free utility ‘Salamander for Apple School Manager’ for uploading data to Apple School Manager directly from your MIS
  • Monitor tool for Salamander Active Directory
  • Microsoft Teams and School Data Sync including our free utility for uploading data
  • Office 365 user and group creation and maintenance, licenses, photos, timetables and more.
  • OneNote Class Notebook provisioning and use.
  • G-Suite user and group creation and maintenance, licenses, photos, timetables, sites, drive, cloud print and more.
  • Google Classroom including guardian and calendar support
  • Active Directory user and group creation, maintenance and more.
  • Write back of usernames, email addresses and user defined fields into your MIS (where supported by the MIS). Also creation of SIMs system users.
  • Support for the above for all UK MISs including Capita SIMS, RM Integris, Progresso, Facility CMIS, iSAMS, WCBS Pass & 3 Sys, Bromcom, Arbor and many overseas ones

You can find out more about Salamander’s products here.

Setting Assignments in Microsoft Teams for Education

Homework has many benefits for students including learning how to work independently, staying organised and taking responsibility for their part in the educational process. It also gives them a chance to review the lesson and go over the material again.

Assignments give teachers the ability to track student progress and to see if the student understands the lesson content.

Microsoft’s Office 365 now provides another educational tool in their arsenal of productivity apps. Teams is a collaboration tool for your classes with the ability to have discussion threads, document sharing, class notebooks (see my previous post) and assignments.

In this post I’m going to focus on the assignment aspect of teams. You can follow the video guide or the blog post below, I hope this helps you get the most out of Microsoft Teams!



How to view assignments for your class

Inside your class, click on the “Assignments” tab to view a timeline of all the set assignments for this group.

Assignments

You can select either a horizontal or vertical timeline view of the assignments using the view selector (highlighted yellow below).

Microsoft Teams

How to create a new assignment

To start setting work for students, click the “New assignment” button.

New Microsoft Teams Assignment

You are then prompted to enter the details of the new assignment

Fill in assignment details Microsoft Teams

  • Assign to: Select which classes to assign to (you can set it to more than one of your classes here!)
  • Title: This is the title of the assignment.
  • Instructions: Include a description here to help the student complete the assignment.
  • Due date and time: When the assignment becomes late (you have the option to allow late hand-in below)
  • Late turn-in allowed: If this is enabled, students can still hand-in work after the due date. This is required if you are using class notebook pages.
  • Points: Turn this on to allow a mark allocation. Currently these are only available as a number score.

Documents can be added from OneDrive, your computer or from the OneNote Class Notebook. We are hopeful that SharePoint and other class teams will be added to this soon! There are two options for attaching these resources.

Attach reference materials

These documents are for the student to view as part of the assignment. You might include a PowerPoint, links to useful websites, etc.

Specify what students will turn in

Documents uploaded in this section can be edited by the student and submitted back as part of the assignment. This is particularly useful for things like worksheets.

When you have finished the assignment, you can either save it as a draft or assign it to the class. As soon as this is assigned to the class, it will appear in their assignment timeline and they will get a notification on their team mobile and desktop apps.

Assign to students button

How to review completed assignments

Use the review button to bring up the assignment timeline and assignment submissions.

review assignments

Select the relevant assignment from the timeline to show the student work.

Mark assignments

Each student has:

  • Student work: Links to files that the student has returned.
  • Date turned in: The date and time that the student submitted their assignment.
  • Feedback: Some written feedback for the student.
  • Points: If you have chosen to enable this in your assignment, you can give the student a grade.

Students will not be able to see your feedback or grade until the “Post” button is clicked.

Post Grades and Marks

Click the “Export to Excel” button to download a spreadsheet of the assignments.

Export to Excel from MS Teams
Grade export from Microsoft Teams

The grades spreadsheet shows all the assignments set to this class over the school year. It optionally shows grades, if enabled per assignment. No more manual marksheets! You could use this data to import or fill in MIS marksheets quicker.

Mobile Apps

One of the best ways to engage with students both inside and outside of school using Teams is to encourage them to use the mobile app. Students get instant notifications of any mentions, homework or graded assignments.

Microsoft Teams iOS and Android App

Teams automation and customisation

Teams is free for schools, check you have the license enabled to start using it. At Cloud Design Box, we can provision teams from MIS data and create an engaging and simple dashboard to access team data in SharePoint. We can also create student folders inside team sites and extend the experience even further, making it easier and increasing student and teacher engagement. You can find out more information on our website https://www.clouddesignbox.co.uk/.

Cloud Design Box Class Cards

How to create a custom theme in PowerApps (workaround)

PowerApps is a great tool at building complex business applications using logic and no code. Microsoft provide several themes out-of-the-box to give your app a consistent look and feel. There is no option to create a custom theme (please release this functionality Microsoft)!

PowerApps Themes

As a workaround, we can use some logic to have a single place to update the colours, fonts, etc. However, please note that there are some steps to set this up and its time consuming but once you have done this, it’s much easier to play around with the theme rather than editing every element individually.

To make our theme easy to update, we are going to create a new screen which will be used for defining our design. Create a new screen called “Theme”.

PowerApps Themes

PowerApps Themes

On this new screen, we are going to add the elements that we want to style. We only need one instance of font-size, primary colour and secondary colour.

To start with, I’m going to add a button on the theme screen. I’m going to give the button my own custom colour as a background colour.

PowerApps Themes

In my theme, I’m going to rename my button to “ThemedButton” to make it easier to reference.

PowerApps Themes

In every other screen in our app (and every new screen we make), we are going to set the properties of the objects to reference our theme screen element colours, sizes, etc.

In my Edit Screen, I’m going to select the “RectQuickActionBar” and select the “Fill” option. Rather than add a colour here in the formula bar, I’m going to reference our primary colour (used in the button on the theme screen). To do this, we enter:

Fill=ThemedButton.Fill

PowerApps Themes

You can use this method to reference font size (ThemedButton.Size), font colour (ThemedButton.Color), etc.

Once you have setup all the properties, you can now change your styles in a single place by editing your theme screen.

It’s a very long-winded way to create a custom theme but might save you a lot of time changing colours when your manager asks for a different shade of blue across the whole app! I’m pretty sure custom themes will be on the Microsoft PowerApps roadmap soon, so you won’t have this problem!

If you need help with PowerApps, SharePoint or anything else Office 365 related, you can contact us at Cloud Design Box.

Learning Tools in OneNote Class Notebook

OneNote Class Notebook is free for education users as part of Office 365, it has some additional functionality which isn’t available in standard OneNote files. In this blog post, I want to focus on the additional learning tools available in this version. There is also a video guide for this post below.



How do I get Class Notebooks?

Class Notebooks can be created in a many ways (depending on how your school decides to use Office 365). Class Notebooks can be created from the Class Notebook App, Microsoft Teams or inside SharePoint or OneDrive.

Creating a “Class” in Microsoft Teams will automatically create a Class Notebook for the group.

How are Class Notebooks different to OneNote Notebooks?

Class Notebooks have a section for each student. Each student can see their own section, the teacher resources and the collaboration area. They can’t see other student sections. Logged in as a teacher, you have access to all the student sections.

OneNote Class Notebook

How do I send distribute an assignment to the students?

Assignments, worksheets or any other hand-outs can be copied into each student’s own section. To distribute a page, the teacher must:

  • 1. Create a new page
  • 2. Populate the page with what you would like to be sent out to the student (e.g. write an essay on…..)
  • 3. In the “Class Notebook” option in the ribbon, select “Distribute Section”
  • 4. Select where you would like the page to be sent

OneNote Class Notebook Distribute Section

How do I review student work?

Class Notebook has a great tool to make it simple to find student work. In the ribbon select “Review Student Work” from the Class Notebook.

OneNote Class Notebook Review Student Work Button

From here, you can select a page and switch between students for quick access to their work.

OneNote Class Notebook Review Student Work

Immersive reader

This option is available under the “View” tab.

Immersive Reader Button

The immersive reader provides the student with a tool to clearly show text on the page without other distractions (images, formatting, etc). In addition to sharpening the student focus on the text, the tool provides some options to:

  • Emphasise syllables, nouns, verbs and adjectives.
  • High contrast themes
  • Focus on lines or sections of the text
  • Read out the text

Immersive Reader

This is a learning tool that has some good research behind it which suggests that it can be used to improve reading and writing comprehension.

Read the study here

What about formal assignments and homework?

OneNote Class Notebook is a great tool for non-formal work hand-outs. With Microsoft Teams, it can be enhanced to provide formal assignments which can be handed out to students, collected in and graded. We will look at that in the next blog/video post.

Need help setting up Microsoft Teams?

I work for Cloud Design Box and we provide teacher training workshops, support, MIS integration, apps and many other services for Office 365. You can contact us via the website or by email. I hope you have found this blog and video post useful!

The benefits of Office 365 and SharePoint in education

There’s no denying that Office 365 now provides a fantastic integrated suite of products. Why should schools and colleges look at moving to Office 365? Can it save time, money and improve student engagement? Let’s take a look in more detail.

Why is cloud storage important?

Office Integration
Office 365

One of the big benefits of using Office 365 (in general), is the close integration with Office Online. The days when students had to install Office on a PC or be restricted to an OS or desktop device are long gone. Office 365 brings Word, Excel, PowerPoint, OneNote and Sway to all devices. Office 365 licencing also means that students can download the full version too.

Access on any device

Can your students access all the lesson resources, shared drives and personal drives on their mobile and tablet devices at home? Only Google and Microsoft provide realistic solutions. Both are free for schools, but both require some setup and modification to make them suitable for each individual school.

Students are far more likely to access resources on mobile or tablet devices. In fact, many will never want to own a laptop or desktop computer. In addition to this, teachers are more reliant on using personal tablets and phones to access resources. The OneDrive for Business app allows students to search and navigate through all the shared resources from their phone and tablet.

Document management
Office 365

Remember accidentally losing a file? It would involve a call to the IT department who would then be searching through backups trying to locate the correct file. OneDrive and SharePoint both have a recycle bin, so you can restore documents for 93 days after the original deletion date. If you delete it from the end-user recycle bin, your IT admins can get it back from the site collection recycle bin (within the 93 days). Even after the 93 days, you can call Microsoft who can sometimes help you get older files back.

What if someone saves over a document or a mistake is made? Every document has version history by default, so you can easily go back to a previous version of the document.

Live collaboration and co-authoring

One of the most impressive features of SharePoint to demonstrate is the ability for multiple users to work on the same document at the same time. It could be a lesson plan in a Word Document, a marksheet in excel or a presentation in PowerPoint. These products provide co-authoring in a slick and easy-to-use way. The paragraph, cell or slide will lock and all users will see the editing live (see below).

Remember when marksheet spreadsheets were locked for editing when trying to open on the school servers? You don’t have that problem in SharePoint, you can work quicker and more efficiently saving precious time that teachers don’t have enough of.
co-authoring
Co-authoring in Office 365

What about homework and electronic assignments?

SharePoint is a great document management system but what about assignments and grading work? For homework and assignments, Office 365 has a range of built-in and third-party products to provide assignment functionality.

Microsoft Teams is also free for education and comes with some built-in assignment tools. These are great basic assignment tools ideal for keeping track of homework. Teams integrates with SharePoint, so you can access all your class and shared resources.

Microsoft Teams
Assignments in Microsoft Teams

Class Notebook is a powerful learning tool with individual student sections, an immersive reader, and tools to distribute and collect work.

OneNote Class Notebook
OneNote Class Notebook

If you want some more in-depth assignment tools, third-party products such as teacher dashboard, firefly, show my homework and many more come with Office 365 single sign-on. Store your resources in SharePoint and use any other application for assignments. Please note that not all these third-party products will allow students an easy way to create and submit office documents.

At Cloud Design Box, we can help you implement Teams with MIS data, create SharePoint resource areas, apply custom branding, training, support, workflows and much more! Contact us via the website for more details.

SharePoint by Cloud Design Box
SharePoint Design by Cloud Design Box

Creating a choice field in SPFx

When using the SharePoint Framework (SPFx), we can use spHttpClient to manage our REST calls. Creating new fields (columns) in lists is like using jQuery ajax methods, first we feed in the body of our call in JSON format.

const spOpts: ISPHttpClientOptions = {
      body: "{'Title': 'Group', 'FieldTypeKind':2,'Required':false, 'EnforceUniqueValues': 'false','StaticName': 'Group'}"
    };

Then we create the REST call and receive the response.

this.context.spHttpClient.post(`${this.context.pageContext.web.absoluteUrl}/_api/web/lists/GetByTitle('List Name')/Fields`, SPHttpClient.configurations.v1, spOpts)
      .then((response: SPHttpClientResponse) => {
        console.log(`Status code: ${response.status}`);
        console.log(`Status text: ${response.statusText}`);
        response.json().then((responseJSON: JSON) => {
          console.log(responseJSON);
        });
      });

However, we get an error when trying to create a choice column using the following body:


      body: "'Title': 'Behaviour', 'FieldTypeKind':6,'Required':true, 'EnforceUniqueValues': 'false', 'StaticName': 'Behaviour', Choices: ['Choice1', 'Choice2', 'Choice3'] }"

Error: “The property ‘Choices’ does not exist on type ‘SP.Field’. Make sure to only use property names that are defined by the type.”

To resolve this issue, we need to add the data type to the request, we structure the JSON in a different way (compared to jQuery ajax calls). This is the JSON required to create a choice column:

body: {'@odata.type': 'SP.FieldChoice','Title': 'Behaviour', 'FieldTypeKind':6,'Required':true, 'EnforceUniqueValues': 'false', 'StaticName': 'Behaviour', Choices: ['Choice1', 'Choice2', 'Choice3'] }

Hope someone finds this useful and saves you a lot of time!

Promoted Links Web Part for Modern Pages

Promoted Links Web Part for Modern SharePoint Pages

This web part replicates the classic Promoted Links Web Part but with added features such as web part properties to change the background colour, size of background image and to select which promoted link list to use. You can download it here.

For more information on the full Cloud Design Box learning platform for modern SharePoint or custom workflows and design, Contact us via the website.

If you are interested in developing web parts using the new SharePoint Framework, this web part is a good example of:

  • loading jQuery from CDN
  • adding third party modules
  • making REST calls
  • configuring web part properties

You can find the complete source code in my GitHub repository at https://github.com/CloudDesignBox/cdb-promoted-links.

As soon as I get chance, I will create some additional blog posts on how this web part was created, breaking down the different task lists.

While I work on that, please feel free to download the code and have a play yourselves!