[Music] Hello, it's Matt, and welcome to Collaboration Coach.
This time I'm going to show you
how to create this good looking frequently asked questions page
using the new collapsible sections feature in SharePoint.
Collapsible sections are also known as accordions
and are really useful when you have lots of content to share
on a single page.
You can create sections that will reveal more information upon a single click
and as a result your page stays tidy and focused
and should make it easier for viewers to find what they're looking for.
An FAQ page is a great example of where to use a collapsible section.
Viewers can find the question they're looking for quickly
and then get the answer with a click,
and they don't have to scroll through lots of questions and answers to find what they're looking for.
So in this video I'm going to show you how to create the page,
set a background image and format it,
then we'll create the sections, format them
and duplicate the formatting to save us time.
And if you stick around to the end I'll share some pro tips
like how to turn your new FAQ page into a template.
Okay, so first of all, I'm going to create the page.
Now, I'm doing this from a standard SharePoint team site,
this one's called "coaching"
and I'm just going to go to the "new" button here and choose "page".
I'm going to choose the "blank" template,
and then "create page".
Now you can see I have to add a name
and I'm going to call this "frequently asked questions".
I'm going to add an image
and I'm going to go to the stock images and type in a keyword
and then I'm going to choose this image here.
You can use any of these stock images without worrying about license.
If I wanted to I can click on this button here and move the focal point around a bit.
The next thing I want to do is edit this web part
so I'm going to choose the "edit web part",
and you'll see here I can change the layout of the page if I want to.
And I want to change it to "image and title",
so I'm going to throw the title - which is "frequently asked questions" - across the top of the image like that.
Now I want some text above the title as well,
and when I type that into this field,
it will overlay it over the top of my title here - "got a question".
You can see that there.
Now everything else looks good so I'm going to close that panel down.
Now the header of my page is ready.
Now the next thing I need to do is add the first section,
so I'm going to come to this section here, and you can see this lights up,
so this is my first section that's already been created for me,
and I can add some text in here - so this is going to be my first question.
I'm going to actually edit this section to make it collapsible,
so I come to the "edit section" button here,
and then on the right-hand side this panel opens up and I can choose this toggle here...
..."make this section collapsible".
So if I just toggle this to "on".
Now I've got a couple more options here.
First of all is the display name.
Now, this is where I'm going to put the first question for my frequently asked questions.
The first question is going to be "what is the difference between coaching and consulting?".
That's looking good.
Now I want to also make sure that this question is collapsed when the page opens,
and in order to do that, I just need to toggle this "default display" to "collapsed".
Now I can just go to the text field here, and I can paste in the answer to that question.
And notice when I do that, I've got this ribbon here
where I can add in bullets and richer formatting.
And on the panel on the right here, I can do other formatting
and I can also add in tables as well if I want to.
I'm just going to leave it like this for now,
and if I close this down, you'll see that now this section is collapsible.
That's set up how I want it and what I'm going to do now to save a bit of time...
...is duplicate this section, by just opening it up so I get this section menu here,
and then iIm going to choose "duplicate section" and just press that there.
So what that does is just take a copy of the section but it also takes the settings with it
so things like the collapsible setting that has just toggled will be applied to this new section
so I don't have to do that again.
So all I have to do now is add in the new questions and answers for each section.
Now one thing I want to do,
to differentiate between the questions - I'm going to change the shading for each section.
So to do that I just need to come to this section background shading section.
You see I've got four options I can choose from
and I'm going to choose the second one here,
so there's a slight change of shade for each question in the list.
Then I'm going to duplicate and add some more questions
and then add in all the answers.
Okay so now I've added all my questions I can close the section panel on the right hand side here
and I can publish the page.
Now whenever this page is opened up
you can find the question you're looking for and click on to get the answer.
Now here's a couple of tips to take your pages to the next level.
So first of all, each of these sections can be formatted in different ways.
So for example, if you wanted to add an image to one of the sections you could easily do that.
So if I edit the page again and open up this first section,
I can always change the format or the layout of the section by choosing the "edit section" button here.
And then you'll see I've got my five different options here
so I could have two columns, one larger column on the left and a smaller one on the right,
then I could add an image here just by adding in the image web part,
and then I can browse stock images,
and let's choose this one and then insert.
Now I can close and republish that page
and when I extend it, it's going to have that image.
Now the second tip for you is to save this page as a template.
So if I go to the edit button again,
you'll see where it says "save as draft", if I drop the menu down to the right of that, I can save this as a template.
So if you ever want to make any other FAQ pages you can use the template
and it will have all the formatting that you've already created in there,
so it's great for yourself if you just want to replicate what you've done
but also other people can use the work you've done as well.
So when I hit "save as template",
it's going to ask me for a name
and I'm going to call this FAQs.
This is going to be the name of the template - the name that I'll see when I create new pages.
And then I just need to go "save page template" here and it's saved.
Now if I go to the home page and go "new" and then "page", so I'm creating a new page,
I will now see this template here. This is the one i just created called FAQs
and if i hit FAQ, choose that as my template, you'll see all the frequently asked questions
and all the formatting that I already added to that page.
So hit "create page",
and now it creates me a new page.
This is a brand new page. I just need to add a new title to that and off I go.
Obviously I need to change all these questions and their answers
but a lot of the work's already been done for me so it's a real time saver.
Okay so that's how you create an FAQ page in SharePoint using collapsible sections.
Thank you so much for watching
and I'll see you next time.