August 20 Next-Gen CMS Introduction Training

Aaron Coleman Author

08/20/2024 Added

11 Plays

Description

Learn how to use the Next-Gen CMS to build visually appealing sites using content types, and components within Layout Builder. This training also covers media library, adding users to your site, and other topics.

Searchable Transcript

Search:

[00:00:00.000]I will send it around to everybody either later today or tomorrow morning.
[00:00:03.360]And yeah, so if you want to review it at your own leisure, then we'll do that.
[00:00:10.160]So I'm going to share my screen, and we'll go ahead and get going here.
[00:00:13.900]All right, so you can see everybody running out of the tunnel at Memorial Stadium.
[00:00:28.700]We're going to go ahead and start going through our CMS training.
[00:00:31.820]So if you logged in to the Sandbox site that I sent the link to, you probably see this administrative toolbar up here on your site as well.
[00:00:41.360]So this is kind of, you know, it's kind of the difference between viewing the UNL sites when you're not logged in versus when you're logged in and you have access to a site.
[00:00:50.680]You'll see this stuff.
[00:00:52.300]So a lot of this stuff will probably look familiar, and I'll kind of go through it all as we go through the training.
[00:00:57.660]But yeah.
[00:00:58.660]You know, some of the most important stuff here is just right here in this main toolbar, content, which is most of the time is where you're going to be structure, configuration, people, and then reports is kind of, you know, I don't even really touch on that in the training.
[00:01:12.960]So we'll click content here.
[00:01:16.620]And if you click content, it shows you all the content on your site.
[00:01:21.520]And of course, if you click add content, it shows you the type of content you can add to your site.
[00:01:27.340]So you can either click.
[00:01:28.640]Add content and then kind of hover over and choose a particular kind, or you can just click add content.
[00:01:34.460]It'll give you these particular types of content that you can add.
[00:01:37.680]So as I go through these, you'll see here builder page, which is kind of like.
[00:01:44.040]The page type that you'll probably use the most.
[00:01:47.800]There's book page, which is, you know, a way to add in page navigation news item, which is basically what it says it is person,
[00:01:56.580]which is what it says it is.
[00:01:58.260]And we'll go through all of these.
[00:02:00.520]You'll probably notice if you're familiar with the current CMS, that there's no basic page.
[00:02:05.000]And that is because builder page replaces basic page kind of as the type of content that you'll use the most when you're building your site.
[00:02:13.500]So it's kind of like two pages in one.
[00:02:16.780]And we'll get to that here in a second.
[00:02:18.540]Building in the new CMS, I would say the biggest difference between it and the old system is that
[00:02:27.880]it's a little bit more modular.
[00:02:29.240]You build pages, and then you can kind of include those in other pages.
[00:02:36.060]And you can connect pages really easily using the link function and the WYSIWYG.
[00:02:45.340]And the biggest thing is that there's no HTML.
[00:02:49.600]So you're adding text, you're adding images, and there's internal templating within the system that renders
[00:02:57.500]everything out.
[00:02:58.200]You can build fancy-looking pages, and you don't have to know HTML.
[00:03:01.360]You don't have to know CSS.
[00:03:03.860]You don't have to know JavaScript.
[00:03:05.560]So there's a lot of really big benefits to this new system.
[00:03:09.740]So we're going to kind of build from the ground up here, adding some of these different content types
[00:03:16.840]and then adding them to other pages as we build our little mini site.
[00:03:22.040]So we're going to go ahead and start with person here.
[00:03:27.120]And I'm just going to add myself.
[00:03:30.820]So I'm going to fill out that field, which is the display name or the title of this person.
[00:03:36.180]And then I'm going to go ahead and start typing my name here.
[00:03:39.280]Let's show you how this works.
[00:03:40.560]So this is a UNL directory reference, and you see that it auto-completed.
[00:03:45.080]And I'm going to choose that and select it.
[00:03:47.340]And then when I did that, it shows my UNL ID after my name.
[00:03:52.100]So I'm going to click save just so you can kind of see what this looks like.
[00:03:56.740]So just by filling out two fields, I have a page here.
[00:04:01.660]So this page is basically pulling information from directory.
[00:04:06.860]So I have a photo in directory.
[00:04:09.120]It's pulling the photo.
[00:04:10.220]My name is obviously the title field that I typed in.
[00:04:14.020]Then all of this stuff, my job title, my department,
[00:04:18.480]and all my contact information is pulling from directory.
[00:04:21.420]So, you know, you can actually build a page and fill out very little
[00:04:26.360]information in the system because it's pulling from other sources.
[00:04:29.860]So, you know, if I want to come back in here and I want to edit this,
[00:04:32.620]and let's just say, you know, for this particular training,
[00:04:39.020]maybe I don't want my job title to be senior web developer.
[00:04:41.920]Maybe I want it to be, you know, lead instructor,
[00:04:44.480]because I'm leading the training today.
[00:04:45.960]So we'll change that and I'll show you what that does.
[00:04:48.020]And then I could override the photo.
[00:04:50.800]And these fields are all basically fields that will allow you to override those
[00:04:55.980]fields that are coming in from directory. So, you know, maybe you're on a,
[00:05:00.740]you have somebody who's on a committee or something.
[00:05:02.940]And for that particular committee,
[00:05:04.360]you want their title to be different or maybe a different contact information,
[00:05:07.940]or maybe you have somebody on your site that isn't even from the university.
[00:05:12.460]Maybe they're, you know, a visiting artist or something.
[00:05:16.900]In that case, you wouldn't even fill out this UNL directory reference.
[00:05:20.740]You would just fill in these fields here and you could fill out, you know,
[00:05:24.880]it would display this,
[00:05:25.960]the same way as if it was pulling from directory.
[00:05:27.840]So, you know, let's see here for bio, I can say, you know,
[00:05:31.260]Aaron does development and training.
[00:05:37.000]Put that there and then save it again.
[00:05:43.040]So now you can see I changed my job title with the override field.
[00:05:55.140]So now that's,
[00:05:55.940]it says lead instructor instead of senior web developer.
[00:05:58.140]And I just added a little bit of bio information.
[00:06:01.380]So that's showing up here.
[00:06:02.580]If you added more,
[00:06:04.180]it would show up and you can add degrees and all kinds of stuff and it'll
[00:06:07.720]show up here.
[00:06:08.160]So we built a person page.
[00:06:10.100]So let's say we want to build a directory now with more than one person.
[00:06:14.960]So we're going to go into content here, add content.
[00:06:17.980]And we're going to go builder page.
[00:06:25.920]And we'll say our trainers.
[00:06:29.800]So builder page, I'm going to touch on this a bunch more as we go through the
[00:06:36.600]training, but I'm going to just kind of go through this, zip on through this
[00:06:41.100]here really quick because there's two edit interfaces essentially for a
[00:06:44.160]builder page.
[00:06:44.680]There's kind of the basic page edit interface, which is where we're at now.
[00:06:49.620]And I'll touch on this later.
[00:06:50.860]I'm going to click save.
[00:06:55.900]So, and there's the layout edit interface, and that is this third tab here.
[00:07:03.300]So you'll see when I click that it's, and this is what I meant when I said
[00:07:07.280]two pages, two types of kind of pages in one, the edit tab kind of is like
[00:07:14.160]your basic page functionality that you're might be familiar with in the
[00:07:17.600]current system.
[00:07:18.280]The layout tab is the layout builder functionality in this new system.
[00:07:23.200]And this is where you add different components.
[00:07:25.880]You add components to your site and it helps you build out kind of these
[00:07:28.580]advanced layouts.
[00:07:29.600]Again, we're going to touch on all this stuff again as we move through the
[00:07:34.300]training.
[00:07:34.680]For this particular case, I'm going to add a section.
[00:07:39.140]So when you're in a layout builder page, you'll see I can add a section
[00:07:45.480]here.
[00:07:45.920]You can see there's a placeholder for this body field and placeholder for
[00:07:49.440]the menu.
[00:07:49.860]Again, I'll touch on those in just a second.
[00:07:52.120]But any time you add a section on your layout page,
[00:07:55.860]it's going to ask you what you want that layout for that section to be.
[00:07:59.620]So if you think of a section on a layout builder page,
[00:08:03.220]think of it as a row,
[00:08:05.400]or I think in the past we've referred to them as a band.
[00:08:08.620]It's a horizontal piece of your page that you can put other content into.
[00:08:14.980]So I'm choosing a row or a section,
[00:08:18.260]and I'm going to say how many columns I want in that section essentially,
[00:08:24.160]or what the layout is going to be.
[00:08:26.040]In this particular case, we're going to choose a one column.
[00:08:28.440]So once you choose that one column or any layout,
[00:08:33.160]then it gives you some more options for how you display that particular section on your site.
[00:08:39.880]So you can put a section heading in.
[00:08:41.820]If I put a section heading in, I can format that section heading.
[00:08:46.760]I can change the background.
[00:08:49.840]I can add a background pattern that layers on top of the background color.
[00:08:55.820]I can change the container.
[00:08:57.420]So the container is the width of that section, whether it kind of goes to the
[00:09:03.180]edges of the navigation or it goes edge-to-edge browser.
[00:09:06.500]The spacing is the vertical spacing, so how tall that section or row is.
[00:09:13.640]So by default, it's kind of a nice medium padding on the top and the bottom.
[00:09:19.820]You can remove the top.
[00:09:21.920]You can remove the top and the bottom, so if you hold
[00:09:25.800]down the command key on your keyboard, you can multi-select
[00:09:29.980]or you can deselect by holding down the command key.
[00:09:34.260]You can add extra top and bottom.
[00:09:36.140]So there's a lot of different ways you can kind of build these sections out.
[00:09:39.740]In this particular case, we're just going to go ahead and add it.
[00:09:42.480]All right, so now that I've added my section,
[00:09:49.880]you see that it gives me this interface.
[00:09:52.220]In addition to adding that section,
[00:09:55.780]the CMS automatically gives me the ability to add another section,
[00:09:59.900]both above and below it.
[00:10:01.240]So if I start building out this page, I can get it really advanced.
[00:10:04.980]And even later on, if I have a bunch of different sections,
[00:10:09.700]I can actually drag and drop them and move them around.
[00:10:11.760]But in this particular case, we're going to go ahead and add a component.
[00:10:14.420]So once you've added a section and a layout,
[00:10:16.660]then you can add components to that layout.
[00:10:19.720]So you can see here, there's all these different components.
[00:10:23.480]So component is kind of a pre,
[00:10:25.760]determined visual layout for a particular type of content.
[00:10:30.640]We have some documentation
[00:10:33.700]on what all of these components look like
[00:10:36.280]and where you can use them on the site
[00:10:37.960]at cms-docs.unl.edu.
[00:10:41.520]And Eric or Saron can drop that in the chat.
[00:10:45.300]In this particular case,
[00:10:47.260]we're going to actually click this more button.
[00:10:48.840]I know this seems like I'm just rolling through a lot,
[00:10:51.440]but we're going to come back and touch on all this stuff.
[00:10:53.220]So I'm going to click this more button.
[00:10:55.740]And when I click the more button,
[00:10:59.160]it allows me to kind of pull in the best way to describe it
[00:11:03.680]as kind of automated or aggregated content
[00:11:06.360]that exists either elsewhere on the site
[00:11:08.960]or on some other site or system at the university.
[00:11:13.900]So, and again, I'm going to touch on all these again
[00:11:17.740]as I move through here.
[00:11:18.480]In this particular case,
[00:11:19.500]we want to add a curated list of people.
[00:11:21.380]And so let's say,
[00:11:25.720]and here's what I meant by when I said modular.
[00:11:30.900]So, you know, I am going to choose a person to display here.
[00:11:35.180]So I added myself previously as a person.
[00:11:38.780]I'm going to reference that person.
[00:11:40.800]I'm going to go teaser featured
[00:11:42.860]and I'm going to add this block.
[00:11:44.920]So you can see it is pulling through
[00:11:50.040]sort of an abbreviated view of that person piece of code
[00:11:55.700]that I added about two minutes ago.
[00:11:59.500]So I want to add a section as well for Eric and Saren.
[00:12:04.020]So I'm going to go one column.
[00:12:05.880]I'm just going to roll through this and go with the defaults.
[00:12:08.700]And again, you can see I'm adding this component.
[00:12:13.880]I'm going to go more.
[00:12:15.720]I'm going to do a curated list of people.
[00:12:18.740]And I can say other instructors.
[00:12:25.680]And here I can say Eric.
[00:12:29.260]We've already created people references for them in previous trainings.
[00:12:35.820]So I'm just going to reference them.
[00:12:37.240]I'm going to use the view mode.
[00:12:38.540]If you remembered on the one where I listed myself, it was teaser featured.
[00:12:43.340]We're just going to go with teaser to show you kind of the different display modes of each of these.
[00:12:47.960]And then we're going to go ahead and I'm going to go ahead and change the background on this section just so you can kind of see what it looks like.
[00:12:55.660]So we'll come back in here.
[00:12:57.340]We're going to make this lightest gray and we'll give it a landmarks and then we'll save it.
[00:13:03.660]And then we're going to save our page and see what it looks like.
[00:13:05.920]So you can see I changed the background and I added a repeated pattern.
[00:13:10.400]And you can see now that it's kind of a light gray with all these different kind of illustrations of campus buildings.
[00:13:16.700]So let's hit save here.
[00:13:17.980]All right.
[00:13:21.800]So we have a page.
[00:13:22.860]Our trainers.
[00:13:23.920]Well, my language isn't quite right.
[00:13:25.780]Trainers and instructors, whatever.
[00:13:26.960]It doesn't make that big a difference.
[00:13:28.280]But we've got this directory page built now that's kind of showing the different ways that you can list people on your site.
[00:13:35.740]And if I click through here, obviously it clicks through to the page that I created.
[00:13:40.800]And if I were to change, you know, my title here, it would change not only on this page, but on this page that it's included in.
[00:13:48.480]So we have this page.
[00:13:50.320]Let's say we want to put it in our navigation.
[00:13:52.000]So to do that, I'm going to click this edit.
[00:13:55.620]Tab again.
[00:13:56.260]So this edit tab, in addition to including kind of these basic page features, it includes all the kind of administrative controls for your content or your page.
[00:14:08.220]So this determines whether it's going to be in the navigation, which is what we want to do right now.
[00:14:13.660]So we want to put this in the menu.
[00:14:15.000]And we're going to say, let's just put this fourth in the menu, because eventually we're going to build four pages and we want it to be to the far right.
[00:14:22.660]So in addition.
[00:14:25.600]You know, you can add a redirect if you really need to on this page, you know, by default, it's going to generate a URL for that page if you for some reason need to change that you can change that here by clicking this button off and changing it.
[00:14:38.240]Authoring information this tells you just who authored the page.
[00:14:42.820]Promotion options don't really need to worry about this. And then your page options are, you know, whether you want to hide the page title or hide the sidebar and I'll touch on these two as we kind of
[00:14:55.580]move through them. So in addition to all this stuff over here, you can actually change the status of your page, you know, right now it's published and it's kind of published by default, which means you publish it to your site, anybody can see it, you know, especially if it's linked up in the navigation. If I wanted to create a new draft of this, like make a little edit, I could save it as a draft, and it would put it in draft mode. So I would have my original published page, I'd have another version of that page that was
[00:15:25.560]in draft mode that somebody else could review, or I could review it before it goes live.
[00:15:29.340]And then unpublished really just takes that page, and it hides it away. It doesn't, it's still on your site, it's not deleted, but nobody can see it, other than people who have access to the site.
[00:15:43.600]So we just really came in here to add it to our navigation, which we already did. So we're going to click save.
[00:15:55.540]And now you can see it's in the navigation. It's not in the fourth spot, because we only have two things in the navigation, but we'll move it over when we start adding some other stuff.
[00:16:04.640]So we've added some people, and we built a directory page, and now we are going to add a news item to our site.
[00:16:14.160]So let's just call this news item for August 20th.
[00:16:25.520]So again, you'll see there's no HTML here.
[00:16:28.340]There's just a bunch of fields to fill out, and right here at the very top, there's this field for lead image.
[00:16:35.560]So this will be the image that leads your news story.
[00:16:38.120]We're going to click this add media, and you'll notice that it says opening media library.
[00:16:43.500]So what is media library?
[00:16:45.680]So media library is the new system within the new CMS for managing both images, video,
[00:16:55.500]and files.
[00:16:56.540]So if you're familiar with the current CMS, it works kind of in a file structure sort
[00:17:03.580]of way.
[00:17:03.980]It's basically the way people have managed files going back to DOS, where you can create
[00:17:10.540]folder system, you can upload files into those folders, you can create folders within those
[00:17:15.860]folders, and then upload files or images, and then you have to reference those files
[00:17:21.220]and images in your HTML and CSS and wherever else.
[00:17:25.480]And it's, you know, it can be kind of tricky for people who don't know how to do it.
[00:17:30.040]So this new system, we upload everything into one giant media library.
[00:17:35.160]And how you find things is based on both the name of the file and tagging of that file.
[00:17:44.640]So I'll kind of go through this here a little bit, but we do have some documentation both
[00:17:50.920]on best practices for naming your files and your images.
[00:17:55.460]As well as best practices for tagging your files and images.
[00:18:02.220]So again, Eric or Saron could put those links in here, but I'm going to show you what it
[00:18:06.400]looks like when you add a image to media library.
[00:18:09.780]So let's choose this image here.
[00:18:13.860]So you can see I chose an image to upload to the media library and immediately it asks
[00:18:21.260]me for alt text.
[00:18:22.740]So that basically it's putting this image.
[00:18:25.440]Into the system and it's storing this alt text with the image so that anytime this image
[00:18:30.100]is referenced on the site, that alt text is automatically goes with the image.
[00:18:34.900]So you don't have to worry about, you know, adding alt text in the code like we used to
[00:18:39.200]or anything like that.
[00:18:40.100]It's, it makes it much more easy to be accessible.
[00:18:42.540]Works great.
[00:18:43.520]So I'm going to go ahead and say, you know, student and parents unpacking items or move
[00:18:55.420]to dorm.
[00:18:57.560]So that's my alt text.
[00:19:01.900]So tags, you know, you want to go, I think I mentioned this in the documentation, but
[00:19:07.360]you want to kind of go general to specific.
[00:19:09.960]So, you know, very general, we could say student.
[00:19:13.760]And I'll show you, I'll show you something, something not to do here.
[00:19:22.740]So I'm going to start typing students.
[00:19:25.400]And you can see that over the many trainings I've done, I've actually created three tags
[00:19:32.640]that could mean the same thing, student, student life, or students.
[00:19:36.020]And that's a terrible way to do tagging.
[00:19:38.160]I'm just showing you this because I've done it poorly over the course of these trainings.
[00:19:44.860]If you have one tag that's referencing kind of students or student life, you should use
[00:19:50.880]that same tag over and over again.
[00:19:52.320]Otherwise, what would happen is you'll create these two
[00:19:55.380]tags that are so close to each other, and you might put images in different tags.
[00:20:00.100]And then, you know, over time, it becomes harder to find those images.
[00:20:04.280]So we're going to go, we're going to go with student life here.
[00:20:08.180]I shouldn't even have those other tags in there, but I'm just showing you a cautionary
[00:20:12.300]tale of what not to do.
[00:20:13.560]So here we could say move in.
[00:20:18.060]All right.
[00:20:19.140]I don't have a tag for that.
[00:20:20.200]So you saw what happened when I have a tag for something.
[00:20:23.400]If you have a tag, it will autocomplete.
[00:20:25.360]And you should select that tag.
[00:20:27.020]Then you can put a comma and you can create other tags as you keep going.
[00:20:31.540]So move in, you know, if I want to get very specific on this, I could say 2024, right?
[00:20:42.400]So I could create a dated tag.
[00:20:44.660]So if I want to start, you know, going through in the future and maybe five years down the
[00:20:49.680]road, I want to search for a date tag.
[00:20:52.560]I could say, okay, I've got all these photos in here.
[00:20:54.660]Some of these are getting.
[00:20:55.340]I want to replace these.
[00:20:57.400]So, you know, this is just a good way to kind of create some tags for future use where,
[00:21:02.420]you know, maybe you create a year tag, you go back, look at those year tags, maybe something's
[00:21:08.180]out of date there and it'll give you a good way to replace, find, and then replace some
[00:21:12.300]of those photos in the future.
[00:21:13.400]So we're going to go student life, move in 2024.
[00:21:16.520]We're going to save and insert that.
[00:21:18.620]And now we've got our image in here and we've got it both.
[00:21:25.320]We've got a cut line.
[00:21:26.020]So this would be good.
[00:21:27.580]So the alt text is kind of like what you'd get
[00:21:31.600]if people have like a screen reader,
[00:21:32.960]but maybe you have a cut line where you know
[00:21:35.840]the specific name of the people who are moving in
[00:21:39.240]and the specific dorm where you want to give
[00:21:41.140]a little bit more specifics to that.
[00:21:42.980]So like, you know, names of student and parents
[00:21:48.360]and town that they're from and dorm name.
[00:21:55.300]I don't know all these things.
[00:21:56.260]I'm just putting it in here
[00:21:57.300]so you can kind of see what it looks like.
[00:21:58.520]And then credit, you know, Craig Chandler took this.
[00:22:03.800]So we've got going to give him credit for that.
[00:22:06.760]So byline who wrote that, you know,
[00:22:11.200]we can say I'm going to fill out all these fields
[00:22:16.400]just so you can kind of see what they look like.
[00:22:18.060]Nobody wants to see me type four paragraphs.
[00:22:21.680]So I have a lorem ipsum generator here.
[00:22:24.420]I'm going to copy.
[00:22:25.280]I'll just paste it in here.
[00:22:27.700]And then down here, person reference.
[00:22:33.320]So if you have a contact for your news item,
[00:22:35.660]this is like maybe they're like a subject matter expert
[00:22:40.720]or something like that.
[00:22:41.640]I'm going to go ahead and show you how this works,
[00:22:43.840]kind of what I meant when I said our system was very modular.
[00:22:46.880]So I'm going to go ahead.
[00:22:47.800]So this is a person reference.
[00:22:49.700]I'm actually referencing that person
[00:22:53.240]that I created earlier of myself.
[00:22:55.260]So, you know, here's a related link.
[00:22:57.160]Maybe we want to say housing.unl.edu
[00:23:02.500]and then say university housing.
[00:23:05.720]And then we'll go ahead and save this.
[00:23:08.580]So you can see here's our title, byline, published date,
[00:23:19.920]our cut line for the image, credit.
[00:23:22.720]And then it's formatted like you'd see,
[00:23:25.240]basically, like a news article in Nebraska Today.
[00:23:27.600]So we didn't have to do any HTML.
[00:23:29.840]We just filled out the fields.
[00:23:31.220]All this stuff is already laid out.
[00:23:35.440]And again, you can see it's pulling through my name,
[00:23:38.680]my contact info, and then the name or the job title
[00:23:42.940]that I used to override the original job title
[00:23:45.240]that's pulling from directory.
[00:23:46.220]So we're showing that this is referenced
[00:23:48.460]three different places on the site.
[00:23:50.220]And if we were to change it in one place,
[00:23:52.060]it would change all those three places.
[00:23:53.820]So, you know,
[00:23:55.220]things are a little more interconnected,
[00:23:56.460]which makes it nice.
[00:23:58.020]You know, you can kind of have single sources
[00:24:00.220]on your site and change them
[00:24:03.020]and not have to worry about going
[00:24:04.240]and fixing them in a bunch of different places.
[00:24:06.000]Then at the bottom of this news item,
[00:24:08.000]you can see all the other news items
[00:24:10.200]that have been added recently to the site.
[00:24:12.040]So, you know, these are the ones
[00:24:13.220]we've been adding in different training.
[00:24:16.100]And then this is one that's being pulled
[00:24:17.620]from Nebraska today.
[00:24:18.880]All right.
[00:24:20.220]So we've got our people,
[00:24:21.680]our directory page and our news item.
[00:24:23.980]So now I'm going to go ahead
[00:24:25.200]and I'm going to touch on web forms.
[00:24:28.140]So we're going to add a web form to our site.
[00:24:32.300]Let's say RSVP for training.
[00:24:36.380]All right.
[00:24:39.700]So we're going to create this web form.
[00:24:41.000]Let's put it in the navigation.
[00:24:42.920]Sure.
[00:24:43.300]And then you can see here,
[00:24:49.520]there's this box that says web forms
[00:24:51.080]must first be created before referencing them.
[00:24:53.200]So what do I do?
[00:24:55.180]What does that mean?
[00:24:55.760]Well, in our old system,
[00:24:58.260]you just create a web form.
[00:24:59.640]You put all the fields on it
[00:25:02.380]and you collect that data.
[00:25:03.400]In the new system,
[00:25:05.260]the fields for the data that you're collecting
[00:25:08.740]and then the page that it's attached to
[00:25:10.940]are two separate things.
[00:25:12.560]So what's the benefit of that?
[00:25:15.040]Well, in the current system,
[00:25:17.600]we often have people say,
[00:25:18.700]hey, can I clone this web form
[00:25:20.760]or can I just copy and paste it?
[00:25:22.280]And there's really no way to do that
[00:25:25.160]because the web form fields
[00:25:27.540]are, it's just kind of its own thing.
[00:25:30.480]It's not HTML.
[00:25:31.880]It's kind of built into this database structure
[00:25:34.400]where it's collecting data.
[00:25:35.380]So there's no way to do that.
[00:25:36.520]So in the new system,
[00:25:38.580]that sort of field,
[00:25:40.680]those fields and the information
[00:25:42.660]that you're collecting
[00:25:43.260]is separated from the page
[00:25:44.800]that you're attaching to.
[00:25:45.820]So you're attaching those fields to the page.
[00:25:48.000]Then the page that you're attaching to
[00:25:51.220]is the place where all the data is collected.
[00:25:53.760]So I'm going to
[00:25:55.140]kind of show you what that looks like.
[00:25:56.480]So we're going to just say RSVP here.
[00:25:58.640]So this is a web form that we've already created
[00:26:01.120]prior and I'm attaching it
[00:26:03.300]to this page. So I'm going to click save.
[00:26:05.020]So you can see
[00:26:10.320]just by attaching that
[00:26:13.020]here's all the fields of data
[00:26:14.900]that we're collecting.
[00:26:16.260]So what's the benefit of that?
[00:26:19.300]Well, the benefit of that is
[00:26:21.240]you don't need to clone
[00:26:23.260]a web form anymore.
[00:26:25.120]You have an event that's yearly
[00:26:27.520]or even monthly or quarterly
[00:26:30.780]and you're always collecting
[00:26:32.400]the same sorts of information.
[00:26:33.780]Maybe you're collecting name,
[00:26:35.140]you know, phone, email,
[00:26:37.260]whatever you're collecting.
[00:26:39.580]Rather than trying to clone the web form,
[00:26:42.420]all you do is you keep
[00:26:43.760]the same web form fields
[00:26:45.280]and you'd attach them
[00:26:46.340]to different pages on your site.
[00:26:48.300]And then the page is where
[00:26:50.460]the data would be collected.
[00:26:51.940]So here you can see up here,
[00:26:53.300]this tab results.
[00:26:55.100]If this form were to be filled out,
[00:26:57.460]the results would be attached
[00:26:58.920]to the page where,
[00:26:59.880]and then this is where I could,
[00:27:02.480]you know, download the data
[00:27:03.740]and view the data
[00:27:05.480]and things like that
[00:27:06.280]if it were,
[00:27:06.760]if it had been filled out.
[00:27:08.120]So this is where, you know,
[00:27:09.140]you can download it and all that.
[00:27:11.480]So we've attached this training
[00:27:16.440]or this, sorry,
[00:27:18.300]this web form to our page
[00:27:20.280]called RSVP.
[00:27:21.760]So where are these fields at?
[00:27:24.140]Where did we generate?
[00:27:25.080]Those.
[00:27:25.280]So this is actually in structure.
[00:27:28.440]If you go structure, web forms,
[00:27:30.820]and you can see here,
[00:27:33.900]we have this one called RSVP,
[00:27:35.360]which is the one we attach to our page.
[00:27:37.140]So here you can see
[00:27:40.520]all these different fields
[00:27:42.380]that we've added to this web form.
[00:27:49.740]So if I click build here,
[00:27:51.260]maybe I want to add, you know,
[00:27:54.520]another,
[00:27:55.060]another field here.
[00:27:56.000]I don't know.
[00:27:59.100]We've got dietary restrictions.
[00:28:01.780]So maybe we're going to add another field.
[00:28:05.080]Let's just do a text field for now.
[00:28:08.120]We'll just say any other thoughts for us
[00:28:16.160]and we'll save and add element.
[00:28:17.960]And then we'll close this.
[00:28:22.080]We'll save it.
[00:28:25.040]So I added this text area or text field down here.
[00:28:29.220]Any other thoughts for us?
[00:28:30.480]So we saved it.
[00:28:31.400]Now, if I go back to content
[00:28:33.380]and if I go back to our web form,
[00:28:37.420]RSVP for training,
[00:28:38.560]you can see at the very bottom here,
[00:28:41.960]we've got this text field called
[00:28:43.620]any other thoughts for us.
[00:28:44.680]So we added it to that web form.
[00:28:46.720]It's attached to this page.
[00:28:47.980]So it's showing up on this page.
[00:28:49.360]We could create another page
[00:28:51.340]attaching the same web form
[00:28:53.040]that have the same fields.
[00:28:55.020]And you could collect
[00:28:56.220]two separate pieces of data for that.
[00:28:59.320]All right, so we've created a web form.
[00:29:01.920]I'm going to touch on book page
[00:29:05.560]very, very briefly.
[00:29:06.680]And rather than actually
[00:29:11.720]building a book page,
[00:29:12.920]I am just going to go to
[00:29:15.080]cms-docs.unl.edu.
[00:29:17.880]Again, I know they put links in there,
[00:29:21.320]but this is probably the best way
[00:29:22.840]for me to show
[00:29:23.500]what a book page looks like.
[00:29:25.000]So if you're familiar
[00:29:25.660]with the old system,
[00:29:26.500]a book page is a page
[00:29:30.200]where you can create pages
[00:29:34.040]that are linked
[00:29:35.180]with an internal navigation.
[00:29:37.300]So these pages here,
[00:29:40.000]all this navigation
[00:29:41.040]for introduction to Next-Gen CMS
[00:29:43.080]are book pages.
[00:29:45.020]So book pages are nice
[00:29:46.700]because you have this navigation
[00:29:49.340]that's always on the right-hand side
[00:29:51.520]of the page.
[00:29:52.160]You can nest items.
[00:29:53.940]So you can see here,
[00:29:54.980]I'm drilling down within content types.
[00:29:58.300]I'm open that up.
[00:29:59.780]Within that, there's a builder page.
[00:30:02.840]Within that, there's all these components.
[00:30:05.560]So book pages are really good
[00:30:09.840]for, I would say,
[00:30:11.700]things like manuals,
[00:30:14.700]procedures, documentation.
[00:30:18.300]I've seen people use them
[00:30:20.620]for annual reports.
[00:30:21.880]Maybe you have sections
[00:30:24.320]of your annual,
[00:30:24.960]and you have lots of information
[00:30:26.720]you want people to move through
[00:30:28.240]and read that.
[00:30:30.040]It's really good for training.
[00:30:31.320]And you can sort of nest pages.
[00:30:35.560]I wouldn't say infinitely,
[00:30:38.080]but you can nest a lot of pages
[00:30:40.100]down in here
[00:30:40.900]and a lot of information
[00:30:43.160]while keeping this navigation
[00:30:44.620]on the side.
[00:30:45.320]So that's really all
[00:30:47.060]I'm going to touch on book pages.
[00:30:48.320]If you're familiar with old system,
[00:30:50.040]they work exactly the same way.
[00:30:51.560]They're really good for,
[00:30:53.400]you know,
[00:30:54.940]honestly,
[00:30:55.220]if you have a PDF
[00:30:56.800]that's a multi-page PDF
[00:30:58.080]and you want people to see it,
[00:30:59.500]it's probably best
[00:31:01.720]to put it in a book page
[00:31:02.880]so that people can actually see it.
[00:31:04.480]So now that I've touched
[00:31:07.320]on book pages,
[00:31:08.040]we're going to jump back over here.
[00:31:09.420]And we are going to
[00:31:14.420]add another builder page.
[00:31:16.960]So I'd mentioned before
[00:31:22.040]that a builder page
[00:31:23.460]is kind of like two
[00:31:24.920]pages in one.
[00:31:25.700]And so we're going to show
[00:31:27.820]kind of the basic page
[00:31:29.900]functionality here
[00:31:32.620]of a builder page.
[00:31:34.460]So if you're familiar
[00:31:38.040]with a current basic page,
[00:31:39.720]we have the ability
[00:31:40.660]to add a hero,
[00:31:41.460]but it's tucked way down
[00:31:42.940]in the bottom menu.
[00:31:44.040]In this new iteration,
[00:31:46.180]it only makes sense
[00:31:48.060]because the hero
[00:31:48.880]is a big image
[00:31:49.740]at the top of the page
[00:31:50.780]to have this box up here
[00:31:53.000]where you can add the hero
[00:31:54.020]basically.
[00:31:54.900]You know,
[00:31:55.380]above the top of your page.
[00:31:56.760]So we're going to
[00:31:59.360]add this hero.
[00:32:00.880]And again,
[00:32:01.880]it's going to pop me
[00:32:02.760]into the media library.
[00:32:03.760]Since I've already
[00:32:05.240]gone through that process,
[00:32:06.240]we're just going to go ahead
[00:32:07.100]and choose
[00:32:07.860]something that we've
[00:32:10.440]already uploaded.
[00:32:11.320]So let's just choose
[00:32:12.700]this one here.
[00:32:13.440]So when you add
[00:32:17.460]a hero image,
[00:32:18.460]there's different,
[00:32:20.600]these different kind of
[00:32:22.320]options
[00:32:24.880]for display
[00:32:25.780]of your hero image.
[00:32:26.880]So the hero image
[00:32:28.120]is going to show up
[00:32:28.680]at the top of the page.
[00:32:29.560]If you think of it
[00:32:31.600]as kind of like
[00:32:32.520]a photograph
[00:32:33.480]behind a matte,
[00:32:34.980]like a mat
[00:32:36.560]in a frame,
[00:32:37.940]not all of your image
[00:32:41.560]is going to show
[00:32:42.440]in the hero.
[00:32:43.300]And
[00:32:44.580]this
[00:32:45.720]will allow you
[00:32:46.980]to kind of move
[00:32:47.980]that image
[00:32:48.680]vertically
[00:32:49.720]within that window,
[00:32:51.160]this object position.
[00:32:52.920]The hero size,
[00:32:54.860]is kind of like
[00:32:55.720]how much of the image shows.
[00:32:57.320]So by default,
[00:32:58.160]it's a medium.
[00:32:58.760]You can choose narrow
[00:33:00.000]if you have like
[00:33:00.860]a really specific photo.
[00:33:02.140]Or you can choose large
[00:33:04.700]for like a larger image.
[00:33:06.080]I'm going to go ahead
[00:33:06.760]and fill out these fields
[00:33:07.880]so you can kind of see
[00:33:08.920]what they look like.
[00:33:10.360]So we're going to create
[00:33:20.420]this hero.
[00:33:20.900]So we've got it.
[00:33:24.020]It's in here.
[00:33:24.840]Again, I'm going to go
[00:33:26.180]back over here
[00:33:27.020]and I'm going to copy
[00:33:28.480]some text
[00:33:29.180]so you can kind of,
[00:33:30.280]I don't want to type
[00:33:31.960]a bunch of text in here.
[00:33:34.440]So we're going to put
[00:33:36.240]this text in here.
[00:33:37.380]And let's just click
[00:33:40.540]save quick.
[00:33:41.100]All right.
[00:33:50.060]So we can see
[00:33:52.280]we've got this image.
[00:33:54.340]It's going to be
[00:33:54.820]cut off.
[00:33:55.740]We've got this little blob
[00:33:58.600]over here that's empty.
[00:34:00.640]I'll show you what that means.
[00:34:01.900]And I want to explain this again
[00:34:04.700]really quick. So when I went into
[00:34:06.580]the layout tab, you notice
[00:34:08.480]there was like that placeholder for
[00:34:10.440]your body text and placeholder
[00:34:12.360]for navigation.
[00:34:13.180]So if I were to click over
[00:34:16.380]into this layout tab now,
[00:34:17.880]you can see
[00:34:21.880]this text is coming through
[00:34:24.240]from
[00:34:24.800]this edit page,
[00:34:27.900]from this basic page.
[00:34:28.900]So when you're building pages,
[00:34:31.640]I think
[00:34:32.880]typically you're only going to use
[00:34:35.800]one tab or the other. Theoretically
[00:34:37.820]it's easy. You could
[00:34:39.640]mingle that content
[00:34:42.000]from the edit tab and the layout tab.
[00:34:44.000]I think it's easier to think about them as
[00:34:45.780]two different types
[00:34:47.880]of pages that you'll be building.
[00:34:49.240]We've had a few questions
[00:34:51.680]about that.
[00:34:52.280]If you're
[00:34:54.780]building a simple page
[00:34:56.680]and we're going to come back here and
[00:34:58.660]continue editing our simple page,
[00:35:00.520]it's best to just work in the edit
[00:35:02.680]tab. If you're working
[00:35:04.340]with a more advanced layout, then
[00:35:06.740]it's better to work
[00:35:08.600]in this layout builder tab.
[00:35:10.080]We can come in here
[00:35:12.960]and we can format this a little bit more.
[00:35:14.760]We can put another header in here
[00:35:17.120]and
[00:35:18.900]throw a WYSIWYG.
[00:35:19.820]We can format that.
[00:35:22.180]Maybe we want to edit the hero a little bit
[00:35:24.760]so
[00:35:26.400]their heads were kind of cut off
[00:35:28.700]so we're going to make this large
[00:35:29.940]and we're going to adjust this a little bit
[00:35:32.360]so it kind of pushes that image
[00:35:34.680]down from the top.
[00:35:35.820]Maybe just do 20%.
[00:35:38.320]I don't know. That might not work either.
[00:35:39.900]Let's just do 40%.
[00:35:41.000]Maybe we want to also
[00:35:44.440]add another image in here
[00:35:46.020]so we're going to click here.
[00:35:47.800]We're going to choose our media library
[00:35:50.520]button and we're going to open that.
[00:35:52.580]Again, we'll just choose
[00:35:54.740]an image that's already uploaded.
[00:35:56.280]We'll choose this one.
[00:35:57.900]When you add
[00:36:00.600]an image or a piece of media
[00:36:02.600]from media library, then you get different
[00:36:04.320]formatting options.
[00:36:05.440]Narrow is going to be slightly
[00:36:08.380]less than half of your content
[00:36:10.440]area. Default
[00:36:12.560]is going to be the size that you uploaded the image
[00:36:14.540]at and then wide is going to be
[00:36:16.640]the full width of that area.
[00:36:18.640]Then this is
[00:36:22.940]kind of how the
[00:36:24.720]image formats alongside
[00:36:26.520]the text. Right here, it's centered
[00:36:28.760]with offset text,
[00:36:30.020]left aligned with offset text,
[00:36:32.660]floated left with wrap,
[00:36:34.520]floated right with wrap.
[00:36:35.980]I think that looks about the best for now.
[00:36:38.960]Then if you remember
[00:36:40.860]when we went to view the page, there was
[00:36:42.840]kind of that space off to the right.
[00:36:44.600]By default, if you create
[00:36:46.760]builder pages
[00:36:48.920]and you keep adding them to your navigation,
[00:36:50.660]it's going to add in page navigation
[00:36:52.900]sort of like book page navigation.
[00:36:54.980]We don't want that to show up. We're going to just
[00:36:56.780]go ahead and hide that.
[00:36:57.700]We're going to update our hero too to
[00:37:00.760]make sure that saves. Then we're going to
[00:37:02.780]save our page.
[00:37:03.400]All right.
[00:37:08.460]I might need to bump that photo down
[00:37:10.660]and I could do that in that
[00:37:12.600]edit tab.
[00:37:13.200]Otherwise, we have a page here that
[00:37:16.600]looks pretty good and we were only in the edit
[00:37:18.560]tab. Let's put this in the
[00:37:20.560]navigation of our site.
[00:37:24.680]Save it again.
[00:37:28.220]We've got
[00:37:34.540]three pages we've built
[00:37:36.740]here, four pages, including the people.
[00:37:38.680]Now we're going to go ahead and
[00:37:40.700]build a front page of our site, like a
[00:37:42.760]nice big page with
[00:37:44.740]a splash and some other stuff on it.
[00:37:46.180]Again, we're going to go into builder page.
[00:37:48.380]This time, we're just going to
[00:37:52.620]go right past
[00:37:54.660]all this stuff
[00:37:56.060]and back into the layout tab.
[00:38:00.460]For our page,
[00:38:06.200]let's say we want a big image
[00:38:08.760]at the top
[00:38:09.480]that's kind of like a hero, but
[00:38:12.660]maybe we want a little
[00:38:13.960]button on the top of it and some text
[00:38:16.580]on top of it. We're going to choose a one
[00:38:18.480]column. Let's
[00:38:20.580]just go ahead and add it for now
[00:38:22.480]by default. Add our
[00:38:24.440]component.
[00:38:24.640]Add our component here.
[00:38:25.240]Here is where we're going to start
[00:38:28.580]adding these visual display
[00:38:30.360]components. This is where
[00:38:32.620]CMS Docs shows
[00:38:34.660]you what all those things do and what they
[00:38:36.560]look like. We're going to choose a display
[00:38:38.640]banner, which is kind of like
[00:38:40.620]a fancy hero.
[00:38:41.280]We're going to go welcome
[00:38:44.200]subhead.
[00:38:45.980]Oops, my spelling.
[00:38:48.780]...
[00:38:50.780]Thank you.
[00:39:01.640]the top of the page. Let's just choose this one. It's nice. So learn more about what we do here.
[00:39:17.300]And then, you know, if you're going to put a link up in your hero, this is probably the
[00:39:20.760]site. We'll put an image in here. Obviously, we need an image if it's going to be a big image at
[00:39:28.840]things that the most important thing that you want people to do on your site when they visit it.
[00:39:32.700]So in this particular case, maybe we want them to sign up for training.
[00:39:38.000]Then maybe that's the most important thing we want them to do. So whenever you have a link
[00:39:42.280]field on your site, and this is important to remember, if you've already created this
[00:39:47.280]page on your site that you want to link to, all you need to do is start typing the name of that
[00:39:53.000]page and it will auto complete and you click it and you've created a link, you know, HTML.
[00:39:59.200]So that's another benefit of the new system. And then, you know, if for instance, for whatever
[00:40:06.220]reason, if that page title changes or whatever, this link is going to be stay fixed. You don't
[00:40:12.400]have to change anything. So we're going to go ahead and
[00:40:16.620]say, you know, sign up for training for a link button text. So up here, you know, the image is
[00:40:25.160]most of this image is kind of on the right part of the image. So here is where you can choose
[00:40:30.140]where you want, like the text and the button to float. So in this particular case, we're going
[00:40:35.480]to leave it on the left because the visual information of this image is on the right.
[00:40:39.320]So we're going to click add block. So we can see we've got our nice big image.
[00:40:46.380]But let's save it. But we've got this page title, and we've got all this space, and we
[00:40:57.000]don't really want any of that stuff. So we're going to go in here to edit. And we're going
[00:41:04.400]to hide the page title here. So we're going to click save. And this also gives me an opportunity
[00:41:11.680]to kind of go through these tabs really quick. So obviously, we're viewing the page here.
[00:41:16.240]Edit, we've been in edit tab, a bunch. Layout is we've been in layout tab, a bunch should be
[00:41:23.760]starting to get familiar with the layout tab. revisions shows all the revisions that have been
[00:41:30.560]made to the page and who made them. So you can actually revert to old revisions, maybe you make
[00:41:36.400]an edit that you don't like, and you want to revert back, this just shows you or maybe,
[00:41:41.260]you know, somebody makes an edit to your page that you've given access and you want to roll
[00:41:45.620]back the change.
[00:41:46.220]Because they misspelled something.
[00:41:47.640]So it's really easy to do in this tab.
[00:41:50.880]Replicate is a but, a tab that we are going to touch on later.
[00:41:57.320]So anyway, we've got all this spacing around here.
[00:42:01.380]We want this to be right up against the navigation.
[00:42:03.700]We want it to be edge to edge.
[00:42:05.340]So we're going to come back into layout, because that deals with the layout stuff that we just
[00:42:10.880]built.
[00:42:11.140]So whenever you're in the layout tab, layout builder.
[00:42:16.140]And you have added components or sections, the easiest way to kind of see where you're
[00:42:22.280]at on the page is when you roll over, you can see here, if I roll over the section,
[00:42:27.900]the CMS gives me a little edit interface on the upper left-hand side to configure the
[00:42:34.740]section.
[00:42:35.080]So the section is the sort of container that you put the layout components into.
[00:42:41.440]So if I roll over the component, I get a little edit.
[00:42:46.120]Edit interface to the upper right.
[00:42:48.320]So this would allow me to quickly edit the component or this display banner that I added
[00:42:54.780]to this page.
[00:42:55.700]So in this particular case, we want to get rid of this padding.
[00:43:03.240]So we can see that this is part of the section.
[00:43:05.420]It's part of that wrapper that we dropped that into.
[00:43:07.500]And we want to go edge to edge.
[00:43:11.820]So we want it to go side to side of the browser view.
[00:43:16.100]And then we want to remove the default vertical spacing that's kind of at the top there.
[00:43:21.420]So we're going to go ahead and update that.
[00:43:23.260]We'll save it just to make sure it looks like we want to.
[00:43:26.880]And then we've got our nice big image at the top with our text and our button to sign up for training.
[00:43:35.420]So that's a good start to our page.
[00:43:37.520]We're going to add a few more things in here to kind of direct people through our site.
[00:43:43.420]So, you know, let's go ahead.
[00:43:46.080]Let's go ahead and add another section.
[00:43:47.140]This time we're going to do two column.
[00:43:49.920]And you'll see when I add two column, it gives me more options about how I want to lay out those two columns.
[00:43:58.080]So I can make them equal or one bigger than the other.
[00:44:02.260]You know, in this particular case, we're going to go 50-50.
[00:44:05.260]All this other stuff is good.
[00:44:08.520]We're going to just go default on that.
[00:44:13.000]And now I've added a 50-50.
[00:44:16.020]You can see that I can actually add two separate components to this section.
[00:44:19.000]And if I click this, if you're very eagle-eyed,
[00:44:23.560]you'll notice that there's slightly different components
[00:44:26.400]that you can add in this column versus like the full width one.
[00:44:31.700]So again, CMS Docs tells you what all you can use in what section.
[00:44:37.000]We just have slightly different things in here
[00:44:39.800]because not every component looks good in every layer.
[00:44:42.980]You know, you don't want to jam a huge image into like a fourth column
[00:44:47.520]and there's certain things you don't want to go full width either.
[00:44:50.780]So in this particular case, we're going to choose a card.
[00:44:53.600]Card is kind of like a looks like a baseball card or something like that
[00:44:58.440]where there's an image at the top and some text
[00:45:01.200]and some optional text you can put in there and a link.
[00:45:03.860]So let's just say we want people to learn about our department.
[00:45:09.760]So we want to direct people there.
[00:45:12.220]So again, this is a link.
[00:45:14.440]So we can say about our department.
[00:45:16.820]We autocomplete that.
[00:45:19.000]And it has created a link to our about our department page.
[00:45:23.000]I'm going to fill out all these fields just so you can see what they look like.
[00:45:26.960]Subhead.
[00:45:29.920]We'll add an image in here.
[00:45:32.200]Again, we're just going to choose one that, you know, already uploaded.
[00:45:41.460]We'll just say, you know, very little here by this gray.
[00:45:55.560]I'm sorry about that.
[00:45:58.680]Scroll down and add this block.
[00:46:02.760]So we've got one card over here.
[00:46:07.200]Let's add another one to keep it balanced and make this one
[00:46:10.860]go to.
[00:46:11.400]You know, meet our people.
[00:46:16.320]So this is where and rather than fill this out, I want to show
[00:46:20.420]you kind of some different kind of explain how much versatility
[00:46:26.220]there is in our system.
[00:46:27.380]So we're going to go people overline people subhead.
[00:46:34.860]We'll choose another media item.
[00:46:38.920]Let's just go with.
[00:46:41.380]Oh, I don't know.
[00:46:42.800]Let's do this one.
[00:46:43.880]So you'll see I did not fill out this headline link up here.
[00:47:06.920]So because I didn't do that, I now have the option
[00:47:10.560]to add a new one.
[00:47:11.360]Add a button to this card.
[00:47:12.760]So let's go ahead and say our trainers meet us.
[00:47:25.520]All right.
[00:47:26.540]And just to make sure they match, I'm going to click add the block.
[00:47:33.080]Let's save this.
[00:47:35.000]All right.
[00:47:41.020]And now you can see we have two cards here, one where the headline becomes the
[00:47:46.440]link and one where we have a button at the bottom that is the link.
[00:47:50.460]So in addition to, not only do we have all these different components you can
[00:47:55.420]use on your site, but there's actually different ways that a lot of these
[00:48:00.360]components can display depending on what fields you fill out.
[00:48:04.340]So these are both cards, but because I filled one out one way and one out the
[00:48:09.220]other way, they display slightly differently.
[00:48:11.000]Now, if I were building the site for real, I would keep these consistent and I
[00:48:15.260]would probably either make both of them the headline title or both of them with
[00:48:19.340]buttons at the bottom, just so they matched and they were closer to the same
[00:48:22.440]height and things like that.
[00:48:23.640]But I just wanted to show you kind of how flexible the system was because there
[00:48:28.700]are so many variations, especially within some of these components like tandem
[00:48:33.260]where there's, you can build so many different looking pieces of content from
[00:48:39.260]the same component.
[00:48:40.500]So let's say on our front page, we want to add some news and events.
[00:48:45.960]So we're going to pop back into layout, come back down here.
[00:48:51.500]Let's go ahead and go one column and edge to edge.
[00:48:58.640]We're going to add a section.
[00:49:00.660]So we've got our component here.
[00:49:03.480]So we're going to add events.
[00:49:07.220]So again, this is aggregated content.
[00:49:10.560]This is content that's coming from, you know,
[00:49:13.420]it's content that we might not have created directly today,
[00:49:15.860]but it's content that exists either on this site or somewhere else.
[00:49:19.080]So in this particular case, we're going to pull upcoming events,
[00:49:21.760]which is pulling events from our events instance.
[00:49:26.620]So here's another huge benefit of using this system.
[00:49:31.180]In the old system, to add events to your page,
[00:49:33.400]you had to add like JavaScript and know how to do that.
[00:49:37.500]In this one, you literally only have to choose
[00:49:40.440]this widget and fill out your calendar URL
[00:49:44.220]and click add block.
[00:49:46.360]And boom, your events pull in.
[00:49:50.260]You can even change how many of them
[00:49:51.820]you want to display there.
[00:49:52.980]Likewise, if you want to add upcoming news
[00:49:57.660]or recent news, you know, rather than adding
[00:50:01.960]some fancy view or automated widget,
[00:50:04.960]all you need to do is add your component, go more.
[00:50:08.360]We're going to use news aggregator.
[00:50:10.420]So this is pulling all the news that's on our site.
[00:50:13.520]So let's just say latest news.
[00:50:16.480]Let's go with four.
[00:50:18.700]You can actually choose four, you know,
[00:50:20.840]variations of four.
[00:50:22.680]I think four looks best.
[00:50:23.740]We'll add that block.
[00:50:25.660]We'll click save.
[00:50:28.780]See what our page looks like.
[00:50:33.720]Got our big image at the top.
[00:50:35.800]We've got our cards that are moving people
[00:50:38.600]into different sections of our site.
[00:50:40.980]Upcoming events that are automatically pulling
[00:50:43.140]from our events calendar.
[00:50:44.340]And then the latest news that's been added to the site.
[00:50:47.140]So as I scroll down the page, you can kind of see,
[00:50:50.180]you know, maybe there's a little padding here
[00:50:52.320]or maybe a little padding here
[00:50:53.940]that we want to remove or reduce.
[00:50:56.560]And we could go into the layout tab
[00:50:58.740]and, you know, remove upper padding
[00:51:02.060]or remove lower padding on one of these bands or sections
[00:51:04.440]just to kind of clean it up and make it a little tighter.
[00:51:06.700]But overall, we have like a really nice page here.
[00:51:10.380]It didn't touch HTML, didn't touch CSS,
[00:51:12.920]didn't touch JavaScript.
[00:51:14.060]Pretty easy.
[00:51:15.680]So I touched on this before,
[00:51:17.940]but let's say we really like parts of this page
[00:51:20.400]and we want to make another page
[00:51:24.920]that looks kind of like that.
[00:51:26.180]So we have this replicate tab
[00:51:28.680]and this will save you some time.
[00:51:30.380]Like if you are building your site,
[00:51:32.560]maybe you have four or five pages
[00:51:34.420]that have the same general layout,
[00:51:36.400]but different content.
[00:51:37.600]All you need to do is create the first one.
[00:51:40.360]Click that replicate tab like this.
[00:51:42.680]And then boom, this is an exact copy
[00:51:50.140]of the page I just created.
[00:51:51.400]So if I come in here
[00:51:52.460]and maybe this is another internal page
[00:51:55.580]and I wanna just change a few things.
[00:51:57.060]Like, so maybe I don't want events on this page.
[00:51:59.880]So I'm gonna remove events.
[00:52:01.040]Maybe I don't want latest news on this page
[00:52:06.440]because it's gonna be an internal,
[00:52:08.020]like a page that's not the front page.
[00:52:11.000]Maybe I want a different image here.
[00:52:12.900]So I'm gonna pop into this component.
[00:52:15.580]I could very easily, you know, remove this image,
[00:52:20.100]add another image, come in here.
[00:52:22.880]Boom, choose that.
[00:52:25.560]You know, interior page.
[00:52:30.500]I could change this text around pretty quickly.
[00:52:34.420]Click save.
[00:52:40.320]You know, so in less than a minute, basically,
[00:52:44.400]we created this new page that looks like our old page,
[00:52:48.540]and then all we have to do is start swapping out the text and images.
[00:52:50.980]And, you know, it just makes it really easy.
[00:52:54.560]If you think about pages on your site that have, like, a similar layout,
[00:52:59.060]create one, and then use that replicate tab,
[00:53:02.860]and it's very easy to make a bunch of pages that have a nice layout
[00:53:09.060]and have a similar layout.
[00:53:10.300]It's a very similar feel on your site.
[00:53:11.280]So I have a few more things I want to go through
[00:53:16.760]before we get to the question and answers.
[00:53:19.140]So I touched on media library before,
[00:53:23.640]and, you know, adding it to components and adding it to heroes.
[00:53:27.660]The other way you get there is you go content, media.
[00:53:30.960]So if I click content, media,
[00:53:33.120]this is going to take me to an interface
[00:53:36.180]that's very similar to...
[00:53:40.280]how the interface you get
[00:53:44.900]when you go to add, like, an image or something
[00:53:47.660]through a component.
[00:53:48.800]So this just shows you everything in your media library, right?
[00:53:52.280]So, you know, if I wanted to search for, you know, move,
[00:53:57.460]because I added that,
[00:53:59.740]you know, move in, it's going to pull that up.
[00:54:03.800]You know, if I search for students, for instance,
[00:54:06.120]or sorry, if I go over here to tags,
[00:54:08.440]and if I search for students,
[00:54:10.260]then that will pull up everything that I've tagged students.
[00:54:14.720]So this is a really nice way to kind of roll through
[00:54:17.360]your files and your images on your site.
[00:54:19.600]So I'm going to show you the ways that you can add different stuff.
[00:54:23.360]So we added images through our components.
[00:54:25.480]So I'll have you do that.
[00:54:26.860]I'm going to add a file to this site.
[00:54:29.320]So let's choose a file if I have one.
[00:54:32.680]Boy, what do I have here?
[00:54:40.240]Let's go ahead and add this.
[00:54:45.080]So you'll see this little checkbox.
[00:54:49.160]I certify the following is true when you upload a file.
[00:54:52.120]I have done due diligence to assure this file meets accessibility standards.
[00:54:56.320]So what does that mean?
[00:54:59.740]Well, when you're creating a PDF or a Word doc,
[00:55:05.600]there are certain things you need to do to make that accessible to people with screen
[00:55:10.220]readers or other assistive devices who are using your website.
[00:55:14.380]If you've ever tried to browse a PDF on your phone,
[00:55:18.240]you know that it is not usually a great experience.
[00:55:22.700]So having said that,
[00:55:25.140]in addition to making sure that your files that you upload meet accessibility standards,
[00:55:30.720]I would say that if you have content on your website that you want your user to actually see,
[00:55:37.800]it should be a webpage.
[00:55:40.200]Right now, if I look at our stats on our website,
[00:55:45.980]roughly 50% of our users coming to our website are on mobile devices.
[00:55:52.040]So if you have content that you're uploading as a PDF,
[00:55:55.420]it's very possible that almost half of your users are either going to not be able to see that content
[00:56:03.040]or have a very difficult experience seeing that content.
[00:56:06.840]So again, I would say,
[00:56:08.940]if you have content that you're uploading as a PDF,
[00:56:10.180]if you have content on your website that you want people to be able to see,
[00:56:13.960]make sure it's a webpage.
[00:56:15.600]I can see if you have a PDF maybe that you want somebody to print.
[00:56:20.520]That content should also be available as a webpage.
[00:56:24.320]Maybe you have a printable version because you want it to look exactly a certain way when it's printed out.
[00:56:29.220]That's okay to upload a PDF in that case.
[00:56:31.740]Again, I just stress, if you have content that you want people to see,
[00:56:36.520]it should be a webpage.
[00:56:38.080]So now that I've...
[00:56:40.160]ranted about that, the tags works very similar to image tags.
[00:56:46.320]I would say general to specific.
[00:56:48.180]So, you know, we could say documentation here.
[00:56:52.940]There's already a tag, so I'm going to choose that.
[00:56:55.660]I'm going to say focus group.
[00:56:57.680]There's already a tag for that.
[00:56:59.660]You know, I could say college of business.
[00:57:03.400]Looks like there's a tag for that.
[00:57:06.040]So we've got all these tags created.
[00:57:08.000]We're going to upload this file.
[00:57:10.140]And we can see that we uploaded that to our media library.
[00:57:15.100]So similarly, let's go to, I'm going to show you how to upload and add a video to your site.
[00:57:25.860]So we're going to go add media, remote video.
[00:57:29.260]And let's come in here.
[00:57:34.560]I think I've already added this roadside safety.
[00:57:37.900]Let's go ahead and add this video.
[00:57:40.640]So if you need to add a video to your site, you just copy the URL of that video.
[00:57:45.180]You come in here, add the remote video URL.
[00:57:50.920]Tags works the same.
[00:57:52.360]You know, we could say LGBTQ.
[00:57:55.360]Don't have a tag for that.
[00:57:58.860]I don't know.
[00:58:01.400]I'd have to look at some more specifics here.
[00:58:03.740]So gender and sexuality center.
[00:58:07.480]So we could say gender.
[00:58:10.100]And, you know, maybe this is student focused.
[00:58:16.100]So we could go back to our good old students tag.
[00:58:18.300]So there we go.
[00:58:19.640]So we'll save that.
[00:58:22.120]And we'll see now that this video has been added to our media library as well.
[00:58:33.420]So adding videos and files to our pages and site is very similar to how you
[00:58:40.080]add links to your site.
[00:58:41.160]It's very easy.
[00:58:41.960]So we come back in here to content.
[00:58:43.500]And let's go to, you know, about our department.
[00:58:47.300]We're going to edit that.
[00:58:48.280]Come back into our page here.
[00:58:51.080]And let's just say we want to link to that document that we uploaded.
[00:58:55.300]So we're going to select this text.
[00:58:57.300]Select the link button.
[00:58:59.300]And then all we have to do is start typing the name of that file.
[00:59:02.420]So content, I think it's called content hub, something or other.
[00:59:05.380]Oh, geez, I've uploaded the same file a bunch of times.
[00:59:08.520]Anyway.
[00:59:10.060]So we're going to select that file.
[00:59:11.600]We're going to click the checkbox.
[00:59:12.900]So we've created a link to that file that we uploaded.
[00:59:15.780]Similarly, if we want to add a video to our page, we come in here.
[00:59:22.240]We click our media library.
[00:59:23.700]And then, you know, the image, there's the image tab to add images.
[00:59:28.380]Then we just click this tab here to show the remote videos.
[00:59:31.180]It takes a second to load those over.
[00:59:32.760]And then we've got them here.
[00:59:34.060]So I'm going to choose this video.
[00:59:36.800]I'm going to insert it.
[00:59:40.040]And again, like the video or sorry, like the image, there's some formatting options.
[00:59:47.040]So there's narrow, which is about 50% roughly, you know, you can float it left.
[00:59:52.480]You can float it center, wrap it around text.
[00:59:54.860]In this particular case, I'm always bigger is better for video.
[00:59:59.320]So we're going to go default.
[01:00:00.600]We're going to make this thing full width.
[01:00:02.020]I'm going to click save.
[01:00:03.980]Come back to our page.
[01:00:10.020]So you can see here, not only are we linking our document, we can hover over
[01:00:14.480]that link and we can see that it is linked there.
[01:00:19.560]Um, and then we also have this big video embedded, so maybe we don't want it that
[01:00:26.580]big, we can change it to narrow, whatever, but we've got it embedded on our page.
[01:00:30.420]So that's kind of like the basics on building a site, adding content, all
[01:00:36.660]that stuff I want to go over in a minute.
[01:00:40.000]Just a couple more things really quick before we go to questions.
[01:00:44.500]So when you request a site, um, I set it up for you and then I add you as a user,
[01:00:52.480]but if you need to add other users to your site, that's all controlled
[01:00:56.440]through this little people tab here.
[01:00:57.880]So this shows you, if you click people, it shows you who all
[01:01:03.040]have access, access to your site.
[01:01:05.020]If you import a user, you know, I can say.
[01:01:09.980]You can search for a person you can search by their name or
[01:01:14.660]by their, you know, username.
[01:01:16.040]I'm going to import them up.
[01:01:20.160]You can see he already has access on this site.
[01:01:22.760]And so when you add somebody to the site, what are these
[01:01:28.740]different, uh, roles mean?
[01:01:31.380]So I have a little bit more permission than you.
[01:01:34.360]So if you add somebody to a site, you're not going to see
[01:01:36.700]quite the same as me, but the, really the three roles that you
[01:01:39.960]can add people to your site, our site, admin, editor, and viewer.
[01:01:44.320]So basically site admin is kind of default.
[01:01:49.440]That's what we give to everybody.
[01:01:50.840]Uh, a site admin can add content.
[01:01:54.020]They can add edit content.
[01:01:56.340]They can add new users.
[01:01:57.980]They can remove users.
[01:01:59.280]They can even come into configuration.
[01:02:02.200]If for whatever reason, sorry, if you come in here to
[01:02:06.860]configuration, basic site settings.
[01:02:09.940]So if you're editing your site and you need to add like an
[01:02:13.740]affiliation or change the affiliation, or if you need to
[01:02:16.700]change your front page, you can do that.
[01:02:19.180]And a site admin can do all those things.
[01:02:22.440]A site admin can even delete content.
[01:02:25.720]Although again, I want to say, please do not delete content.
[01:02:29.060]It's very, very hard to do, or it's very, very hard to get
[01:02:31.720]back.
[01:02:32.100]A site admin can basically do anything that a user can do on
[01:02:37.480]a site and editor.
[01:02:39.920]Is one step down from that.
[01:02:41.660]So an editor can add content and they can edit content.
[01:02:47.300]They can't add or remove users.
[01:02:49.780]They can't delete content and they can't get into any of the
[01:02:53.180]site configuration stuff.
[01:02:54.340]So that's good.
[01:02:55.180]If you just have somebody, you know, you want to add to your
[01:02:58.240]site, that's, you want to have them be able to create content
[01:03:02.480]and edit content.
[01:03:03.280]That's perfect.
[01:03:04.020]Viewer is a new role that we've added, and this is kind of like
[01:03:09.900]the approver role.
[01:03:11.100]So if you remember back when, and I'll just go back here again.
[01:03:17.040]So a viewer can, the only thing a viewer can do is view content
[01:03:22.220]on the site.
[01:03:23.300]So they can view content in any published status.
[01:03:27.560]Obviously, if your content's published, anybody coming to your
[01:03:31.720]site can view it.
[01:03:32.700]But if you have a piece of content, for instance, that is,
[01:03:39.880]in unpublished or draft status, then a viewer role can log into
[01:03:48.940]the site and see those things.
[01:03:50.540]So what's the benefit of that?
[01:03:52.340]Well, maybe you are, you know, given the task to create, you
[01:03:58.360]know, a couple new pages for a section of your site, but
[01:04:01.780]somebody wants to look at those pages and approve them before
[01:04:05.420]they go live, but they don't really want to edit them.
[01:04:07.820]They just want to kind of say, hey, here.
[01:04:10.220]I want to look at these pages and give you a thumbs up before
[01:04:12.480]they go live and everybody they're live on the web and
[01:04:15.080]everybody can see them.
[01:04:15.840]So in that particular case, you'd create those pages and you
[01:04:20.520]would make them unpublished or draft.
[01:04:23.320]I would say unpublished unpublished is more of kind of
[01:04:25.940]like a flexible state draft is you're creating a new draft of
[01:04:29.420]that that's either going to go live at it's going to have to
[01:04:33.680]go live at some point in the future.
[01:04:35.020]Unpublished, you can kind of create pages and just kind of
[01:04:38.780]leave them.
[01:04:39.840]Unpublished and just keep making edits and edits and edits
[01:04:42.580]and edits until you decide that they want to go published.
[01:04:45.800]So, you know, this viewer role that I had mentioned is good.
[01:04:51.020]If you have like a, you know, a manager or something who
[01:04:57.540]doesn't want to get into the nuts and bolts of the website,
[01:05:00.240]but they just want to give you a thumbs up or thumbs down on
[01:05:02.580]whether something should be published or not.
[01:05:04.140]You create those pages, you leave them unpublished, you give
[01:05:08.560]them viewer access.
[01:05:09.820]Give them the links to those pages.
[01:05:11.680]They could say, yep, this is good.
[01:05:13.660]Then you're going to make them published, link them in the
[01:05:15.740]navigation, link them elsewhere, and they'd be good to go.
[01:05:18.560]All right.
[01:05:20.540]So that is kind of all the nuts and bolts of the website, how
[01:05:26.140]you add and edit content, how you add and remove users.
[01:05:29.380]So now I want to talk a little bit about the process really
[01:05:33.020]quick before we go into question and answer.
[01:05:35.380]So what's the process if you go?
[01:05:39.800]Go to cms.unl.edu, which you've obviously already been there
[01:05:44.040]because these are the steps.
[01:05:45.740]The steps are get started, attend a training.
[01:05:48.660]You're attending the training.
[01:05:49.880]You're already at step one of the process.
[01:05:55.100]So step two, request a site and start building.
[01:05:59.720]So if you've taken the training and you want to request a site,
[01:06:03.160]this is where you would click.
[01:06:04.620]Either request a site here or up here, request a site.
[01:06:09.780]Once you do that, I will create that site for you
[01:06:12.900]and I will send that URL to you and you can go ahead and start building.
[01:06:17.220]As I've mentioned many times before in the training,
[01:06:20.260]there's this documentation.
[01:06:21.360]So there's a quick link to that there.
[01:06:24.260]If for some reason you did not build the site,
[01:06:28.620]maybe you're in this training because somebody else helped you build the site
[01:06:32.760]and you're just going to edit it from now on.
[01:06:35.320]You don't need to worry about these.
[01:06:37.160]You kind of just need to refer to the stuff I just talked about
[01:06:39.760]about how to edit pages, how to edit components, things like that.
[01:06:43.260]So if your site's already live and you were just kind of handed the keys,
[01:06:47.640]congrats, you don't have to worry about any of this.
[01:06:49.880]So after you've taken the training, you've requested a site,
[01:06:55.540]you've built your site out, your site is all ready to go,
[01:06:58.700]you're ready for your site to go live, that's this third button here.
[01:07:03.800]This is make your site public.
[01:07:05.660]You can either click this button here or up in the navigation,
[01:07:09.020]you can click request.
[01:07:09.740]Request to make your site public.
[01:07:11.120]So when you fill this form out, this basically says, okay,
[01:07:17.280]my new site in Next-Gen CMS,
[01:07:19.400]I want that to be a site that everybody sees when they go to yoururl.unl.edu.
[01:07:27.240]You fill this form out, you give us the Next-Gen CMS address
[01:07:33.060]and your subdomain, what time you want it to go public,
[01:07:36.540]and then Eric will,
[01:07:39.720]make your site public and it will be viewable to the world.
[01:07:43.220]So those are kind of these steps in the process.
[01:07:47.260]And that is really all I was going to go over today.
[01:07:52.060]So now we can open up the chat to any questions that people might have.
[01:07:58.900]Looks like Eric and Saron have answered quite a few of them already.
[01:08:04.400]All right. I'm going to go ahead and answer some of
[01:08:09.700]these really quick. We're getting a few. So how can we transform the current website to the new
[01:08:14.640]CMS system? Do we need to request a site or is there a way to import it directly?
[01:08:19.600]So our current CMS, the one that we're on right now is Drupal 7. We went into this system in
[01:08:29.320]2012, I believe, something like that. This is kind of the first major upgrade. Well, the biggest
[01:08:39.680]upgrade, you know, the back end of Drupal kind of changed so much that it's forcing us to make
[01:08:45.040]this change. So there's really no way to import your site as is into the new system. You have to
[01:08:52.520]rebuild it. That's the, you know, that's kind of how it is. It's such a different system. You know,
[01:09:03.120]if you're familiar with the current system, it's kind of just one big blob of HTML and text. So you
[01:09:09.660]to translate that into the new CMS. And that's kind of what we're learning how to do today.
[01:09:14.600]So to answer Apala's question, yes, you have to request a site using that button that I
[01:09:22.820]just showed you, and then rebuild that site in this new system. And I will say, you know,
[01:09:28.720]that seems kind of daunting, especially if you have a bigger site, but I would say,
[01:09:32.820]before you start, you know, before you say, I have to move every single thing over,
[01:09:38.600]I would say to look at your current site and to do a site audit, which is to say,
[01:09:44.220]go through there and really make sure you're looking at things like, does this really need
[01:09:51.760]to move over to the new site? Like, is this important enough to move with me? Is it still
[01:09:57.400]current? Is it still relevant to my users? It's kind of like when you move from one house to
[01:10:03.360]another or an apartment to the next one, you know, you don't take every single thing. Some
[01:10:08.580]of it gets taken to the goodwill or, you know, some of it gets left on the curb. It's just,
[01:10:13.700]you know, doing a thorough site inventory is probably the best thing you can do before you
[01:10:20.880]start moving your site, uh, just to determine what is the most necessary content that people
[01:10:28.080]need to see. You know, we've been building these sites, kind of just adding pages and
[01:10:32.900]adding pages. I'm guilty of this certainly for the past 12 years. And so,
[01:10:38.560]the sites are very sprawly and it's kind of like an overgrown hedge, right? We kind of got to
[01:10:43.540]shape it up a little bit nicer as we move into this new system. So, um,
[01:10:48.820]so that's what I would say. Uh, I'm going to go down this list here. We've got several of them.
[01:10:54.340]Um, Megan, for photos of people in our case, keynote speakers with this different size headshots.
[01:11:00.560]Um, so in CMS docs, again, um, that
[01:11:08.540]I would say, so I'm going to share, I'm still sharing my screen here. So we actually have in
[01:11:14.780]this meet under media library in our CMS docs, we have this file best practices. So that's what
[01:11:22.080]I had mentioned earlier. This is kind of like best practices on naming your files. So here's
[01:11:26.200]about how to create accessible files. We also have this image best practices. So in this image
[01:11:33.200]best practices, we have something about naming your images, optimizing your images, and also
[01:11:38.520]recommended image size by component type or content type. So this section here should answer
[01:11:46.560]your question, Megan, about, you know, kind of what works best in those particular areas. So
[01:11:52.760]Melanie is asking, is there a deadline by which we need to have our current site turned into next
[01:11:58.620]gen? So the current system, Drupal 7, will shut down on December 19th. That is the
[01:12:08.500]the hard deadline, where everybody needs to be moved off. We're trying to get people
[01:12:16.080]to move before that, obviously, because we don't want people to run up right against the end and
[01:12:20.640]get all stressed out. But, that is the hard deadline is December 19th at 10 AM in the morning,
[01:12:27.540]roughly. So, you know, September, October, November, December, four months, roughly.
[01:12:37.600]Um, yeah. Brian's question in the documentation is their best practices for mobile devices.
[01:12:44.420]Saron answered that, you know, responsive design is built into all the components
[01:12:51.020]and layouts of this system. So you do not need to worry about that at all.
[01:12:54.560]And I think I've answered the questions in the chat. So if anybody else has any questions,
[01:13:02.260]either feel free to put them in the chat or just ask them, you know,
[01:13:07.180]just ask them in the chat. So if anybody else has any questions, feel free to put them in the chat.
[01:13:07.580]So if anybody else has any questions, feel free to put them in the chat. So if anybody else has any questions, feel free to put them in the chat.
[01:13:37.560]So if anybody else has any questions, feel free to put them in the chat.
[01:14:07.540]So if anybody else has any questions, feel free to put them in the chat.
[01:14:37.520]So if anybody else has any questions, feel free to put them in the chat.
[01:15:07.500]So if anybody else has any questions, feel free to put them in the chat.
[01:15:37.480]So if anybody else has any questions, feel free to put them in the chat.
[01:16:07.460]So if anybody else has any questions, feel free to put them in the chat.
[01:16:37.440]So if anybody else has any questions, feel free to put them in the chat.
[01:17:07.420]So if anybody else has any questions, feel free to put them in the chat.
[01:17:37.400]So if anybody else has any questions, feel free to put them in the chat.

The screen size you are trying to search captions on is too small!

You can always jump over to MediaHub and check it out there.

Comments

0 Comments

August 20 Next-Gen CMS Introduction Training

Description

Searchable Transcript

Comments icon comment

Related Channels

Comments