November 19 Next-Gen CMS Training

Aaron Coleman Author

11/19/2024 Added

13 Plays

Description

Next-Gen CMS Training video covering content types, layout builder, components, media library, and more.

Searchable Transcript

Search:

[00:00:00.000]Go ahead and record this.
[00:00:00.960]Let me share my screen and we'll get going.
[00:00:04.460]Let's see here.
[00:00:20.080]All right.
[00:00:27.920]All right.
[00:00:28.680]I'm trying to load the onboarding site here.
[00:00:30.700]Right now it's UNL site.
[00:00:33.400]All right.
[00:00:34.960]Can everybody see this?
[00:00:36.420]Kids running out of the tunnel, CMS site.
[00:00:38.360]Yep.
[00:00:38.920]You're sharing a different page.
[00:00:41.460]Well, it said screen three and that's what I shared.
[00:00:46.120]All right.
[00:00:52.960]Now?
[00:00:53.700]Okay.
[00:00:54.980]All right.
[00:00:57.840]So if you're familiar with the current CMS, the next-gen CMS is slightly different.
[00:01:06.320]I would say some of the benefits are that it's a low-code, no-code environment, meaning
[00:01:12.840]you don't have to mess with HTML or CSS or JavaScript.
[00:01:16.640]You basically just upload images and fill in fields.
[00:01:20.820]And then there's internal templating that you can build these nicely designed pages
[00:01:25.680]with that.
[00:01:27.760]If you've all logged into the Sandbox site that I gave you access to, you'll notice that
[00:01:33.820]when you log in, you get your administrative toolbar up here along the top, and then you
[00:01:38.260]see the tabs on the pages, any of the pages on the site that you have access to.
[00:01:43.660]So that's very similar to the old site.
[00:01:46.020]And we'll be going through what all these things mean.
[00:01:49.400]Some of this stuff will look familiar.
[00:01:51.060]Some of it will look new.
[00:01:52.300]But we're going to go ahead and start with content here.
[00:01:55.560]So content is...
[00:01:57.680]Kind of where all the content is on your site.
[00:01:59.600]If you click content, it shows you a list of all the content
[00:02:03.600]that's already been created on the site.
[00:02:05.140]If you go add content, here, it gives you a list of all the types of content
[00:02:10.840]that you can add to your site.
[00:02:12.120]So you can click add content and come to this page that I'm at right now.
[00:02:16.020]Or you can hover over it and go add content
[00:02:19.500]and then choose that particular content type for adding.
[00:02:23.040]So as you scroll through here and look through this page,
[00:02:27.160]you probably know...
[00:02:27.600]Notice if you're familiar with the current system,
[00:02:30.080]there's one thing you don't see, and that is basic page.
[00:02:32.720]So basic page, if you're familiar with the current system,
[00:02:36.920]it's basically you have one big box that you can put either code
[00:02:44.660]or you can edit it either with WYSIWYG.
[00:02:48.420]What you see is what you get, or you can switch over to HTML view.
[00:02:52.300]So in a lot of cases, you have a page that just has a bunch of code in it.
[00:02:57.520]And it's very easy to accidentally delete a div
[00:03:00.640]and then kind of ruin the layout of your page.
[00:03:03.080]So we don't have those anymore.
[00:03:05.940]We now have a builder page,
[00:03:08.020]which will basically replace your basic page
[00:03:11.460]as probably the most used piece of content on your site.
[00:03:15.320]And it has kind of a dual functionality.
[00:03:18.040]And I'll get into that as we get through the training.
[00:03:20.360]And then some of this other stuff is much more straightforward.
[00:03:23.900]Book pages works exactly like it did in the,
[00:03:27.520]in the old system.
[00:03:28.020]It's really good for documentation and stuff like that.
[00:03:30.600]News item is specific to,
[00:03:32.780]if you're adding a news item to your site,
[00:03:35.100]this will format a lot like a Nebraska today story.
[00:03:37.780]And then you can aggregate the most recent news items on your site.
[00:03:42.220]Person is a way to display information about people on your site.
[00:03:47.520]And then it makes it really easy to build directory pages.
[00:03:49.920]And then a web form is again,
[00:03:52.160]that one's very similar to web forms in the old system.
[00:03:57.520]So we're actually just going to kind of jump around through these system-wide
[00:04:01.360]types here, add these,
[00:04:02.680]and then I'll get more in depth into builder pages once we go.
[00:04:06.780]So we're going to start off by adding a person.
[00:04:09.280]And I think my connection is slow or something else is up because that took
[00:04:26.920]way too long.
[00:04:27.520]So I'm going to go ahead and fill out a couple of fields here.
[00:04:30.820]The first one is just my name.
[00:04:32.340]And then I'm going to show you what happens if I just fill out two fields.
[00:04:35.640]So this second field is a UNL directory reference.
[00:04:39.480]And you'll notice when I start typing, it auto completes.
[00:04:42.820]And then once I click that, it gives my name and then it gives my UNL username.
[00:04:47.800]And I'm going to go ahead and just click save here.
[00:04:49.720]So you can see what happens when I just fill out two fields for this piece of
[00:04:54.200]content.
[00:04:57.520]So by just filling out those fields, I got my name here, which is that first
[00:05:02.340]field and all this other information, including the photo job title department
[00:05:07.200]and all this contact information is automatically pulling from directory.
[00:05:11.080]So, you know, I have a page here and I only filled out two fields.
[00:05:16.160]If I come back in here, I can edit this content and you can see here there's
[00:05:23.320]bio, you know, I can say Aaron does training and.
[00:05:27.520]I'm not going to type too much.
[00:05:39.320]But then there's all these other fields that you can fill out and those will
[00:05:43.400]show up in different places on this page.
[00:05:45.520]So, you know, personal website, all this social media stuff.
[00:05:48.820]I obviously filled out the bio field.
[00:05:50.660]You can fill in education and additional.
[00:05:52.820]We also have all these UNL directory overrides.
[00:05:56.340]So this is a little bit of a different way of doing it.
[00:05:57.520]This is good for, you know, maybe you don't like how your job title is added into directory.
[00:06:04.600]Or maybe when you're adding this person to the site, they're representing a role that
[00:06:12.820]is not their primary role at the university.
[00:06:14.640]You know, maybe you're building a committee site and you need to show what role they have
[00:06:19.060]on that committee rather than their job title at the university.
[00:06:22.060]So kind of as an example of that, let's just say today, rather than senior web developer,
[00:06:27.520]I'm going to be lead trainer.
[00:06:28.820]And we won't change any of this, but I will say these other fields are really good for
[00:06:36.060]if you have, you know, an affiliate, like a visiting professor, somebody who does not
[00:06:41.760]have a UNL directory reference, you would just fill out their display name and then
[00:06:46.720]all these override fields.
[00:06:48.440]And rather than overriding, it would just be rendering these fields, you know, instead
[00:06:54.800]of the UNL directory.
[00:06:57.520]Because they wouldn't have that information in UNL directory.
[00:07:00.060]So I'm going to go ahead and click save here.
[00:07:01.640]We can see the changes that I made to it.
[00:07:04.000]As you can see here, put this little sentence of bio information in here, and it changed
[00:07:15.100]my job title to lead trainer.
[00:07:16.780]So this is a really easy way to add people to your website, and I'll show you later how
[00:07:21.700]to make a directory with this.
[00:07:23.520]But we're going to go to add content, and now we're going to go ahead and add a news
[00:07:26.880]item.
[00:07:27.520]So again, this is a structured piece of content that you can add to your website.
[00:07:33.080]We're going to say a news item for November 19.
[00:07:41.000]And just like the person content type, you can see there's just a bunch of fields here,
[00:07:47.520]and there's no big blobs of HTML, which is really nice.
[00:07:51.260]So I'm going to add an image to this, and you'll notice whenever you need to add an
[00:07:57.520]image to either a component or a content type, you'll have this little button that
[00:08:04.660]says add media.
[00:08:05.560]And when you click that, it then opens the media library, which once this opens, I'll
[00:08:12.860]explain how this works.
[00:08:14.300]So when you add both files and images to your website, that's one of the biggest changes
[00:08:22.420]between our old system and then this new next-gen CMS.
[00:08:25.920]In the old system.
[00:08:27.520]You added all your files and images through what is called just a file manager, which is
[00:08:34.060]kind of folders within folders, and you can put files in those folders and then you, you
[00:08:40.000]know, find the URLs to those files and images, and then you link them in your code.
[00:08:45.140]Um, it was very similar to, you know, clear going back to DOS days where you just have
[00:08:51.480]folders, folders in the folders, you can put files in the folders and then you reference
[00:08:55.380]them.
[00:08:55.620]Well, this is complete.
[00:08:57.520]Completely different system media library is kind of like one big pool that you put
[00:09:03.860]things in.
[00:09:04.440]And then the way that you then find those later in the future is through tagging and
[00:09:11.540]also how you've named your file.
[00:09:13.620]So I'll talk a little bit about tagging when I add this image here.
[00:09:17.940]Um, but I will say that we have documentation on our CMS docs website that is, we have a
[00:09:27.520]both documentation for best file practices when naming your files and images, uh, and
[00:09:34.700]we also have best practices for tagging your files and images when you upload them.
[00:09:39.640]So I'm just going to go ahead and upload something here.
[00:09:44.060]So we can say, let's go with this one here.
[00:09:57.520]Say student using how to native earth in a field.
[00:10:07.320]So whenever you add an image, you're automatically prompted to add alt text.
[00:10:13.920]And so then when you add alt text to that image, it is attached to that image.
[00:10:18.040]So anytime you use that image throughout your site, it
[00:10:21.100]will have the proper alt text.
[00:10:23.020]So tags, again, this is a way that you're going to find this.
[00:10:27.520]Image in the future.
[00:10:28.900]So you're going to want to go kind of general to specific so that, you know,
[00:10:34.720]when you're searching for things in the future, you can find them.
[00:10:37.300]So I'm going to say this, you know, this is a student, so I'm
[00:10:40.420]going to start typing student.
[00:10:41.620]And when I start typing this, you can see it auto-completes.
[00:10:49.060]And this also gives me a good chance to say, this is what you should not do.
[00:10:53.800]So you can see here, I have a tag for.
[00:10:57.520]Student, student life, and students.
[00:11:00.320]So this is bad.
[00:11:02.540]You should not have three tags that are so similar to one another.
[00:11:06.700]I think you could argue that you could keep student life and students, but you should
[00:11:12.140]not have student and students because those are too close together.
[00:11:16.840]And you could imagine in the future when you start getting lots of images or files, some
[00:11:22.040]tag student, some tag students, that they just diverge and you wouldn't be able to find
[00:11:26.780]certain things.
[00:11:28.140]So in this particular case, you should use one or the other.
[00:11:31.320]I'm going to go with students.
[00:11:32.420]Let's just say this is agronomy.
[00:11:35.360]If you know what department or major they are, that's a good idea, too.
[00:11:42.640]And then we could say extension.
[00:11:47.620]So you can see that when there's already a tag that exists, it auto-completes.
[00:11:54.280]And if that tag that auto-completes is something that you need.
[00:11:57.520]You should select that.
[00:11:58.660]And if you create a new tag, then you need to put a comma there and
[00:12:03.520]then you can keep searching.
[00:12:04.560]So another thing I've told people is, you know, sometimes it's not a terrible idea.
[00:12:10.380]If you know what year the photo was taken, that way you can find sort out
[00:12:15.580]photos by years that were added to the site in the future, you know, if you
[00:12:18.720]ever need to switch out, say you get five years down the road and you want
[00:12:22.500]to remove everything from 2024, this would be a really easy way to find all those photos.
[00:12:27.520]So we've got four tags in here, and I think that's pretty good.
[00:12:30.840]We're going to go ahead and save and insert this.
[00:12:32.720]So you can see now we have our image is loaded into our news item, and we have
[00:12:41.380]this field called a cut line.
[00:12:43.320]So cut line would be more specific information about that photo.
[00:12:47.560]You know, an alt tag is kind of more descriptive for somebody who might be
[00:12:53.040]low vision or vision impaired.
[00:12:55.100]The cut line.
[00:12:57.520]Would be maybe more specific, you know, so if you knew the name of this person,
[00:13:02.620]like name of student, um, and year in school plus specific project that they're
[00:13:17.660]working on, you know, I'm obviously typing that out, but that's the sort of
[00:13:23.000]thing that you would put in your cut line, um, lead image credit, this is
[00:13:27.520]where you can give credit to who took the photo. So we're going to say Craig
[00:13:31.920]Chandler university communication. I got it. So the byline is then who wrote
[00:13:41.920]that article. So we'll say Alan Smiley. And rather than watching me type
[00:13:49.380]multiple paragraphs, we're just going to go over here to this lorem ipsum
[00:13:52.640]generator, and I'm going to copy this and paste it in.
[00:13:57.520]And so earlier I mentioned that when you build sites using this new system,
[00:14:05.380]it's a little more modular. So I'm going to show you one example of that
[00:14:09.760]right now. So person reference. You can see I started typing, and it
[00:14:14.320]autocompletes to my name, which I added myself as a person to the site,
[00:14:19.320]and now I'm referencing that. And so here is a URL for a related link.
[00:14:24.560]So let's just say...
[00:14:27.520]Let's just say extension.
[00:14:28.520]So Nebraska.
[00:14:32.540]And then we will save this and see what our news release looks like,
[00:14:39.980]our news item.
[00:14:40.660]So you can see we've got the byline, the title, the date it was published,
[00:14:56.200]the cut line.
[00:14:57.520]The date for the photo, the photo credit, the actual news story text.
[00:15:02.420]And then here is where I referenced myself.
[00:15:04.440]So you can see that not only did it pull through my contact information,
[00:15:08.120]but it pulled through that job title that I had overridden using the field
[00:15:13.760]within there.
[00:15:14.680]So if I were to go back in and change that,
[00:15:17.520]it would change not only on the page that I created for myself,
[00:15:20.000]but then all those pages that it is referenced on,
[00:15:23.440]including this news item.
[00:15:24.640]So here, related links.
[00:15:26.800]That's where I added.
[00:15:27.960]Nebraska extension.
[00:15:28.780]And then down here at the bottom are the latest news items
[00:15:32.800]that have been added to the site,
[00:15:34.320]published in reverse chronological order.
[00:15:37.180]So you can see these ones I have added for previous trainings,
[00:15:40.640]and then here's the one for today.
[00:15:42.180]And this is the one we're on.
[00:15:43.540]So that's a news item.
[00:15:45.420]And we'll come back and touch on how you can add news feeds
[00:15:48.800]to your page here after a little bit.
[00:15:50.160]So we are going to go now,
[00:15:53.700]and we're going to add content web form.
[00:15:57.520]All right.
[00:16:05.460]I was just seeing.
[00:16:06.220]Okay.
[00:16:06.560]So RSVP for training.
[00:16:10.640]So I'm creating a web form here,
[00:16:13.940]and you see this information message that says,
[00:16:16.460]web forms must first be created before referencing them.
[00:16:19.020]So it might seem confusing because I thought I was creating a web form,
[00:16:23.620]but I am going to reference a web form that's RSVP for training.
[00:16:27.520]So it's already been created.
[00:16:28.300]So we'll just say RSVP here.
[00:16:31.880]So basically what is different about this new system from the old system
[00:16:37.420]is that the fields of the data that you're collecting
[00:16:41.340]are separated from the page that they are attached to,
[00:16:45.900]which might seem kind of confusing.
[00:16:48.680]But one of the questions we get a lot in,
[00:16:51.640]or we got a lot in the old system was,
[00:16:54.320]can I clone a web form?
[00:16:55.960]Can I just duplicate it?
[00:16:57.940]And in the old system, there was really no way to do that.
[00:17:00.520]You had to recreate the form and all the fields,
[00:17:03.020]and it was kind of a pain.
[00:17:04.600]So in this new system,
[00:17:06.480]rather than recreate all those fields again,
[00:17:09.860]as long as you're collecting the same data,
[00:17:12.540]you can just reference those fields
[00:17:15.380]that you've created on multiple pages.
[00:17:18.660]And then the page that you're referencing
[00:17:22.700]those web form fields is where the data is collected.
[00:17:26.000]So...
[00:17:27.520]That might not make a whole lot of sense,
[00:17:29.380]but I'm going to walk you through
[00:17:30.820]what that looks like here
[00:17:32.680]and kind of show you how that works as I save this.
[00:17:36.740]So I'm going to save it.
[00:17:37.560]And you can see that I referenced
[00:17:39.340]this RSVP web form fields.
[00:17:41.540]And these are all loading in here, right?
[00:17:43.720]So all this specific stuff,
[00:17:46.220]date you'll be attending.
[00:17:47.040]So this looks like some sort of
[00:17:48.800]like conference registration, right?
[00:17:50.440]And if it were to be filled out,
[00:17:52.180]we just published it.
[00:17:54.280]So we know nobody's filled it out.
[00:17:55.680]But if it had been,
[00:17:57.280]then we have our results tab here
[00:17:59.200]where we can download,
[00:18:01.440]you could download that information
[00:18:03.620]that people have submitted.
[00:18:04.960]So we've got our web form
[00:18:08.520]with our fields
[00:18:10.120]and we can gather our data.
[00:18:11.440]So what about the fields themselves?
[00:18:13.620]So creating the web form fields
[00:18:17.580]for the data that you want to collect
[00:18:19.080]is actually under the structure button here.
[00:18:23.220]So structure, web forms.
[00:18:25.180]So if I click here,
[00:18:27.040]you can see these various web form fields
[00:18:32.160]that have already been created,
[00:18:33.120]including RSVP, which is the one that we referenced.
[00:18:36.100]So if I come in here to build this.
[00:18:37.880]So this part here, although visually it looks different,
[00:18:42.980]it looks kind of similar to how the current system works,
[00:18:47.080]where you have all the different fields in order.
[00:18:49.520]You can choose whether they're required or not.
[00:18:51.440]If I want to add a new element,
[00:18:53.060]let's just say text area
[00:18:56.800]and then I can title my text area,
[00:19:01.980]maybe would you like a free t-shirt
[00:19:10.520]and if so, what size?
[00:19:13.320]Something like that, right?
[00:19:14.500]So this is a text area we're going to collect from people
[00:19:17.340]and we'll save that.
[00:19:19.660]So you can see now there's a new field down here at the bottom.
[00:19:25.480]We're going to save it
[00:19:26.560]on our web form.
[00:19:29.660]And then we'll come back in here to the content tab
[00:19:32.560]to the web form page
[00:19:35.440]where we hit attach these fields.
[00:19:37.200]And we're going to click in here.
[00:19:38.440]And if I scroll to the bottom,
[00:19:43.320]you can see, you know,
[00:19:45.880]would you like a free t-shirt?
[00:19:47.100]And if so, what size?
[00:19:48.040]So you can see that we added that field
[00:19:50.420]within structure to this web form fields
[00:19:53.280]and it automatically attached to the web
[00:19:56.320]form page that it was attached to.
[00:19:58.560]So what is the benefit of this?
[00:20:00.660]Well, the benefit is, you no longer need
[00:20:02.700]to worry about cloning web forms.
[00:20:04.260]If you're collecting the same data
[00:20:05.740]and you have those fields already created,
[00:20:08.180]all you need to do is create another
[00:20:10.220]web form page, add content web form
[00:20:13.060]and attach the same fields to that page
[00:20:15.500]and then the data would be separated
[00:20:17.240]on the pages.
[00:20:17.900]So maybe you have a conference
[00:20:20.080]that happens yearly and you don't want
[00:20:23.260]to recreate the fields.
[00:20:24.360]Well, you would just create a new page
[00:20:26.080]2024 event registration, 2025 event
[00:20:29.860]registration.
[00:20:30.420]Those would be the pages that you
[00:20:32.440]attach the fields to.
[00:20:33.460]Or maybe it's even quarterly or monthly.
[00:20:36.000]This would make it really easy to
[00:20:38.100]separate out the data that is being
[00:20:41.740]submitted without having to recreate
[00:20:44.240]those fields every time.
[00:20:45.700]So that's kind of one of the bigger
[00:20:48.140]differences between the two systems.
[00:20:49.800]But once you've built it one or two,
[00:20:52.660]it totally makes sense why.
[00:20:55.840]So rather than going through add content
[00:20:58.540]and adding book pages, this is going to
[00:21:01.160]just give me the opportunity to once
[00:21:03.300]again talk about CMS docs, which is
[00:21:06.900]where all our documentation is.
[00:21:10.620]Because this over here, if you look,
[00:21:15.000]introduction to NextGen CMS, this
[00:21:16.980]navigation on the right, and then all
[00:21:18.560]this content over here, this is actually
[00:21:21.420]built in book pages.
[00:21:22.380]So I previously mentioned
[00:21:25.600]book pages are really good for
[00:21:28.060]documentation or any type of pages on
[00:21:31.840]your site where you want a dedicated
[00:21:34.300]navigation on the right-hand side of the
[00:21:37.200]page that always flows with the user no
[00:21:39.680]matter where they are in that book or
[00:21:42.420]document.
[00:21:42.900]So this is really good for documentation.
[00:21:45.920]I've seen people use it for year-end
[00:21:48.820]reports because you can, within here,
[00:21:51.620]obviously, you can nest these things.
[00:21:53.140]So if this is the book,
[00:21:55.680]then these are pages and or
[00:21:57.720]chapters, theoretically, right?
[00:21:59.420]So I can open up content types.
[00:22:01.800]And you can see
[00:22:03.660]when content types opens,
[00:22:05.920]then I get all these other
[00:22:07.240]specific sections
[00:22:10.040]down within content types.
[00:22:11.380]So we've already talked about pretty much all of these
[00:22:13.740]except for builder page.
[00:22:15.240]So within builder page, I can open that
[00:22:17.720]up as well and see all of these components
[00:22:19.860]that I can put within builder page.
[00:22:21.620]So
[00:22:23.120]I won't go any further
[00:22:25.280]into book pages other than to say that it works
[00:22:27.580]exactly the same way it does in the old
[00:22:29.640]system. It functions the same way it does in the
[00:22:31.600]old system. It's really
[00:22:33.600]good for documentation and things like that.
[00:22:35.480]So those are
[00:22:37.480]book pages. Again,
[00:22:39.060]there's a lot of really good information here
[00:22:41.600]at cms-docs.unl.edu
[00:22:45.160]if you're building your site.
[00:22:46.660]There's
[00:22:49.200]a lot here to go through.
[00:22:51.480]So
[00:22:52.300]jumping back to
[00:22:54.980]the site that we're building
[00:22:57.640]for today.
[00:22:58.240]Now we're going to go into
[00:23:03.920]builder page.
[00:23:05.720]And I think
[00:23:09.620]I previously mentioned that builder page
[00:23:11.480]kind of has two different functionalities
[00:23:13.980]in one. And so I'm going
[00:23:15.620]to show you kind of
[00:23:16.760]the basic page functionality
[00:23:19.320]of builder page
[00:23:21.460]first because this is
[00:23:23.140]a way that you can build
[00:23:24.680]I think more simple
[00:23:27.600]pages, but they still look good
[00:23:29.400]without getting into the layout builder portion
[00:23:31.720]of it. So we'll just say
[00:23:33.640]about our department here.
[00:23:35.800]Let's just take some more text
[00:23:39.240]from our lorem ipsum over here.
[00:23:41.220]So one
[00:23:54.380]of the things you'll notice, and this is the same
[00:23:56.320]no matter what type of
[00:23:58.360]content you're in.
[00:23:59.820]Over here on the right-hand
[00:24:01.780]portion of the page is kind of your administrative
[00:24:04.340]stuff that is related
[00:24:06.540]to that piece of content.
[00:24:07.940]So if I wanted to add this to the menu,
[00:24:10.400]I could pretty quickly
[00:24:12.500]add this piece of content
[00:24:14.540]to the menu.
[00:24:15.300]URL alias, whenever
[00:24:18.340]you create a page, it's going to automatically
[00:24:20.240]generate a URL, but you can override
[00:24:22.520]that by unchecking the box and
[00:24:24.080]putting whatever you want in there.
[00:24:25.260]Authoring information
[00:24:27.960]just tells who created
[00:24:29.920]the page. That's me. If I hit
[00:24:31.920]save here, then I will have authored it.
[00:24:34.040]Promotion options,
[00:24:36.020]there's really not much.
[00:24:37.100]We don't really use these things, so I
[00:24:39.860]wouldn't worry about that.
[00:24:40.780]And then these page options I'll get into a little bit
[00:24:43.900]more, but we've got hide page title and
[00:24:45.820]hide sidebar.
[00:24:46.560]Then over here,
[00:24:49.960]this is a big kind of WYSIWYG
[00:24:51.940]area where you can put text and
[00:24:53.780]images and formatted text.
[00:24:55.400]Previously, our
[00:24:57.860]hero, which is a big image at the top
[00:24:59.860]of the page, was kind of tucked down at the
[00:25:01.800]bottom in this administrative stuff,
[00:25:03.740]but because it is a big image that's at the
[00:25:05.840]top of the page, just made a lot
[00:25:07.780]more sense to put it right up here at the top.
[00:25:09.640]So we're going to add
[00:25:11.860]an image to our page
[00:25:13.940]and once again, it's going to pop us
[00:25:15.800]into media library.
[00:25:16.800]So I'm going to just, rather
[00:25:19.700]than uploading another image, because you saw
[00:25:21.800]that process already,
[00:25:23.480]we're just going to choose one that's already been
[00:25:25.220]uploaded. So let's just go with
[00:25:27.660]let's go with this one here.
[00:25:30.400]It's very colorful.
[00:25:34.120]I'm getting a connection
[00:25:44.940]unstable here, so I apologize
[00:25:46.960]if it's choppy on
[00:25:49.240]your end.
[00:25:49.680]So we have our
[00:25:53.180]image that's uploaded into
[00:25:55.080]our hero. The object
[00:25:56.940]position here.
[00:25:58.000]So think about
[00:26:01.120]your hero image
[00:26:03.200]as a photo or
[00:26:04.980]print that slides behind
[00:26:07.020]a matte within
[00:26:08.620]a frame, like a matte,
[00:26:10.460]a photo matte.
[00:26:11.660]So not all of your image
[00:26:15.020]is going to show all the time.
[00:26:16.320]So depending
[00:26:18.860]on the visual information of your image,
[00:26:20.780]you might want to move that up and down
[00:26:22.880]up or down in the matte. So if you choose
[00:26:24.860]50%, 0%,
[00:26:26.320]it's going to lock the top of the photo to
[00:26:28.820]the top of the matte.
[00:26:29.660]Just like if you choose
[00:26:32.520]50%, 100%, it's going to
[00:26:34.800]lock the bottom of the photo to the bottom of the matte.
[00:26:36.920]By default, it's 50-50.
[00:26:38.900]So it's going to be right across the middle there.
[00:26:40.720]And the hero
[00:26:42.640]size is
[00:26:43.960]how much vertical
[00:26:46.420]space of that image shows. So we're going to
[00:26:48.740]choose medium here. I'm going to fill these
[00:26:50.640]out.
[00:26:52.580]So you can see what they look like, but
[00:26:54.440]these are not required
[00:26:56.260]fields.
[00:26:56.860]I'm going to
[00:27:08.340]create that.
[00:27:08.820]All right. So we've created our hero. We have
[00:27:18.300]some text, and we're just going to click save.
[00:27:20.240]We'll come back in and do a little more work on this page
[00:27:22.280]but I just want to show you what it looks like
[00:27:24.260]so far.
[00:27:24.720]So you can
[00:27:44.260]see this is a medium height hero.
[00:27:46.100]I think we want to go in and edit this.
[00:27:48.240]We've got this default menu over here.
[00:27:50.300]I'll kind of explain that in a second.
[00:27:51.980]And maybe we want to add another
[00:27:54.160]image to this page and maybe like
[00:27:56.220]a subhead or something like that.
[00:27:58.200]So we're going to come back in here to
[00:27:59.920]edit.
[00:28:00.460]I am sorry this is taking
[00:28:12.240]so long. Oh my gosh.
[00:28:13.300]Edit.
[00:28:14.480]And then we will change the height
[00:28:20.340]to large.
[00:28:21.680]So this is, again, the vertical
[00:28:23.680]height of our hero. We're going to update
[00:28:25.700]that.
[00:28:26.080]So that was updated.
[00:28:33.020]We're going to go ahead and add
[00:28:35.660]a header here just to show you kind of
[00:28:37.620]some of the formatting you can do.
[00:28:39.140]This is very much like the old system.
[00:28:41.740]You know, I can add another header here.
[00:28:43.700]If I want, I can pop
[00:28:45.700]another image in here. So if I click
[00:28:47.740]this little media button,
[00:28:49.260]it's going to load up the media
[00:28:51.380]library that you've seen a couple times already.
[00:28:53.300]Again, we're going to go ahead and choose
[00:28:55.180]something that's already
[00:28:56.260]been in here
[00:28:59.080]rather than upload another one.
[00:29:00.900]So we're going to insert
[00:29:03.280]that. So once
[00:29:05.280]the image is inserted,
[00:29:07.120]then you have some formatting options
[00:29:09.100]within the page for formatting that.
[00:29:11.360]So narrow is going to be
[00:29:13.660]about half
[00:29:15.240]the width of your window.
[00:29:16.880]You can
[00:29:19.380]change the width of it. So we can go
[00:29:21.080]default. Default is the default
[00:29:22.840]size that you uploaded the image at.
[00:29:24.780]Wide is full width.
[00:29:25.900]And then these are kind of your
[00:29:28.140]how it's
[00:29:30.920]aligned and how it offsets with the text
[00:29:32.920]on your page.
[00:29:34.140]So there's left and offset. Centered and
[00:29:36.920]offset.
[00:29:37.320]Floated left and then floated
[00:29:42.800]right. I think floated right typically
[00:29:44.800]looks the best because
[00:29:46.080]it doesn't bump the text out
[00:29:48.820]on the left. To me, it seems the
[00:29:50.780]most readable.
[00:29:51.340]You can add other stuff in here too.
[00:29:54.480]You can add a
[00:29:55.900]hard return and
[00:29:58.680]you can add all kinds of stuff.
[00:30:00.420]If you have text
[00:30:02.460]links, you can add buttons and things like
[00:30:04.760]that.
[00:30:05.120]Remember when I saved
[00:30:08.860]it, there was a little sidebar on the right.
[00:30:10.760]We want to get rid of that. So that was down
[00:30:12.760]under page options. We're going to hide the
[00:30:14.780]sidebar. And then
[00:30:16.740]I think we're going to call this page good for now.
[00:30:18.540]So we'll click save.
[00:30:20.480]And let
[00:30:22.640]this save. And then we can see
[00:30:24.480]our changes.
[00:30:25.040]So again, we changed the height
[00:30:38.480]of that hero. So it's
[00:30:40.300]taller. There's more of the image showing through.
[00:30:42.360]We added another
[00:30:44.340]image and we floated it over to the right.
[00:30:46.100]We added this header.
[00:30:47.060]So this is kind of what I was talking about.
[00:30:50.180]So within BuilderPage,
[00:30:51.960]you can build a page that looks
[00:30:54.120]pretty good, but we're not using
[00:30:56.260]the LayoutBuilder functionality of
[00:30:58.220]this page yet. And so
[00:30:59.800]that is the very next thing I'm going to get
[00:31:02.200]into. We're going to add another page,
[00:31:04.360]a BuilderPage, and
[00:31:06.140]now we're going to go for the next part
[00:31:08.180]of the training into
[00:31:09.920]LayoutBuilder specifically,
[00:31:12.440]which is kind of the advanced
[00:31:13.900]functionality of
[00:31:16.260]the BuilderPage. So let's
[00:31:18.200]just say our
[00:31:19.880]trainers. So we're
[00:31:22.220]going to build a little directory page first. So we're
[00:31:24.180]going to click Save.
[00:31:24.940]And let's come back in here and
[00:31:32.280]add it to our menu, right?
[00:31:34.100]So we'll
[00:31:36.260]put this in the menu.
[00:31:37.740]Click
[00:31:42.160]Save.
[00:31:42.760]Oh, we want to get rid of this
[00:31:49.580]menu too. So we're going to come back in here and we're going to
[00:31:51.720]hide it. So
[00:31:52.600]several things. So we'll hide this
[00:31:55.480]sidebar.
[00:31:57.620]So this is really just to explain this.
[00:31:59.640]If you have
[00:32:01.600]a smaller site
[00:32:02.500]or if you want to add a little more
[00:32:05.240]interior navigation to your site,
[00:32:07.420]you can leave this on and it'll just
[00:32:09.480]show up on pages. It looks kind of like
[00:32:11.260]it looks basically like book page navigation,
[00:32:13.500]but it's just a way for people to navigate
[00:32:15.380]through your site a little easier.
[00:32:17.260]In this particular case,
[00:32:19.360]we don't want it, so we're going to
[00:32:21.280]hide it
[00:32:21.880]and save our page.
[00:32:24.800]And now we're going to go into this layout
[00:32:27.260]tab, which we have not touched on
[00:32:29.320]yet in this training.
[00:32:30.120]So when I open this, you can see there's
[00:32:35.320]a bunch more stuff in here, right?
[00:32:36.860]So this is actually a placeholder.
[00:32:39.500]This box right here
[00:32:41.320]is a placeholder for
[00:32:43.260]the
[00:32:44.540]text field in the edit
[00:32:47.160]tab that we were just in. So if I
[00:32:49.140]had typed something in over there, it would
[00:32:51.140]actually show up here. So
[00:32:52.420]theoretically, you can
[00:32:55.180]do builder pages
[00:32:57.280]that are a combination of both of those
[00:32:59.320]things. Typically, you'll
[00:33:01.280]probably do one or the other. You'll either have
[00:33:03.440]your page that you build in the edit
[00:33:05.280]tab strictly, or you'll have your
[00:33:07.260]builder page that you build in your build
[00:33:08.980]in your layout tab
[00:33:11.240]strictly.
[00:33:12.860]So first, we're going
[00:33:15.300]to go and we're going to add a section.
[00:33:16.840]So you'll know
[00:33:18.920]whenever you're in layout builder and you add
[00:33:21.240]a section, you immediately
[00:33:23.260]get asked what you want
[00:33:25.060]that layout to be within that section.
[00:33:27.460]So think of this as
[00:33:29.100]at a very basic level,
[00:33:31.120]think of it as tables, right? Anytime
[00:33:33.220]you create a new row, then
[00:33:35.300]you have to put columns in that row, and the columns
[00:33:37.460]are your layout. And then in those columns
[00:33:39.480]you can put components, which we're going
[00:33:41.360]to get to in just a second.
[00:33:42.380]In the previous system, I think we called
[00:33:45.500]these rows
[00:33:47.080]bands, you know,
[00:33:48.800]and then you can put stuff in the bands.
[00:33:50.880]However it makes sense
[00:33:53.320]to think about this,
[00:33:54.560]you're creating a horizontal
[00:33:56.980]section where
[00:33:59.400]you're then creating a layout within
[00:34:01.400]that section that you can put different
[00:34:03.640]elements of your site.
[00:34:05.400]So in this particular
[00:34:07.480]case, we're going to choose one column, and again, we're
[00:34:09.440]going to come back into this multiple times as we go
[00:34:11.320]through the training.
[00:34:11.860]So then within each
[00:34:14.560]section, you have all these customization
[00:34:17.120]options. You can add a
[00:34:18.720]heading. You can show that
[00:34:20.620]heading, and you can format the
[00:34:22.580]heading.
[00:34:22.840]Pardon
[00:34:26.600]me. You can
[00:34:28.560]add an anchor ID.
[00:34:29.640]You can change the background and the background
[00:34:32.340]pattern. For this one, I'm going to show lightest
[00:34:34.640]gray, and we'll do landmarks.
[00:34:37.080]And these two things
[00:34:38.700]work together no matter what color you
[00:34:40.640]choose, the background and the background
[00:34:42.700]pattern. So the
[00:34:44.700]container is the width
[00:34:46.380]of this section. So
[00:34:48.640]standard wrapper is kind of
[00:34:50.640]edge of navigation to edge of navigation.
[00:34:52.780]Edge to edge is
[00:34:54.640]browser edge to browser edge. We're just going
[00:34:56.800]to go standard here.
[00:34:57.740]And then
[00:34:59.920]the spacing
[00:35:02.820]is the vertical spacing of this section.
[00:35:04.740]So by default, it's
[00:35:06.920]going to be kind of a nice medium padding that
[00:35:08.880]works for just about everything, but you can remove
[00:35:11.020]the
[00:35:12.300]vertical, you can remove the top,
[00:35:14.840]and this is actually multi-select
[00:35:16.940]so you can do all, you know, you
[00:35:18.560]multi-select all these, you can remove the top
[00:35:20.780]and bottom
[00:35:21.340]and then by
[00:35:24.100]pulling down the command key is how you get
[00:35:26.720]the multi-select or the deselect
[00:35:28.420]once you've selected something, so
[00:35:30.220]you can add extra top spacing
[00:35:32.440]and extra bottom spacing for whatever
[00:35:34.460]reason, if you need to, you can remove the top
[00:35:36.360]spacing and add
[00:35:38.320]extra bottom spacing just depending on what you're
[00:35:40.360]doing with your layout, in this particular case
[00:35:42.520]we're just going to leave it default and we're going to go ahead
[00:35:44.300]and add it.
[00:35:48.480]So now you can see I have this new section here
[00:35:50.660]and it has kind of a light gray background
[00:35:52.360]and then it has this pattern that repeats over the top
[00:35:54.720]of it. So
[00:35:55.820]once you've added a section
[00:35:58.400]then you can add components within those sections
[00:36:00.540]so we're going to add a
[00:36:02.580]component and these are all the components
[00:36:04.700]that you can add.
[00:36:05.520]I'm actually going to click
[00:36:08.700]this more button because I am
[00:36:10.680]going to be adding something
[00:36:12.820]called aggregated
[00:36:14.960]content basically to this so
[00:36:16.680]think of these
[00:36:18.400]components here within this section
[00:36:21.020]as
[00:36:21.680]content that you are going to add
[00:36:24.860]directly to this page.
[00:36:26.220]This more button takes
[00:36:28.940]you to content that is
[00:36:30.620]pulling from other sections of your
[00:36:32.860]site or other sections
[00:36:34.680]of other web applications at the university.
[00:36:37.140]So what
[00:36:38.980]do I mean by that? Well we're going
[00:36:41.040]to add a curated list of people
[00:36:42.840]and this we're building our directory
[00:36:45.120]page here.
[00:36:45.700]So I'm going to
[00:36:48.320]say lead
[00:36:49.780]trainer and I'm going to
[00:36:52.340]display this title and then
[00:36:54.180]person nodes to display. This is again
[00:36:56.200]this is kind of like in the news item
[00:36:58.260]where I'm referencing
[00:36:59.180]a person piece of content
[00:37:02.500]that's already been created
[00:37:03.380]and I'm going to change this view mode to
[00:37:06.360]teaser center featured
[00:37:07.380]and I'm going to click add block.
[00:37:09.860]Alright so you can see
[00:37:15.840]lead trainer here I am.
[00:37:18.240]And we're going to add another section now
[00:37:19.940]just to jump back in here.
[00:37:21.720]Again I'm going to move through this pretty quick.
[00:37:23.980]We're going to go one column.
[00:37:25.100]We're going to keep all this default.
[00:37:26.460]Going to add a section.
[00:37:28.320]Got another component.
[00:37:30.000]Another place here where I can add a component.
[00:37:32.020]I'm going to click this.
[00:37:33.040]I'm going to go more.
[00:37:33.960]Again we're going to add another curated list of people
[00:37:38.040]because we want to include the other people
[00:37:39.880]who are in the session today.
[00:37:42.360]So we're going to say other
[00:37:43.380]trainers.
[00:37:44.540]And then we're going to say
[00:37:47.040]Saren.
[00:37:48.680]And we'll say Bob.
[00:37:49.860]And we'll just leave these as teaser because
[00:37:54.140]I'll show you the difference between what those
[00:37:56.360]look like. There's four different ways you can display
[00:37:58.280]these people.
[00:37:58.880]I did teaser featured
[00:38:02.240]previously. We're doing teaser
[00:38:04.240]regular. Click save
[00:38:06.340]here and then see what this
[00:38:08.320]page looks like when it's saved
[00:38:10.440]out.
[00:38:10.720]All right. So you can see
[00:38:14.220]we add it to our navigation.
[00:38:15.560]We have lead trainer and it's kind of set
[00:38:18.080]apart, has a different background and different color.
[00:38:20.120]And then we've got other trainers here
[00:38:22.260]with their contact information underneath.
[00:38:23.800]So we built a little
[00:38:26.040]directory page.
[00:38:26.860]You could just keep adding sections. So this
[00:38:30.020]is good for maybe if you're building like a department
[00:38:31.960]or unit page where you have
[00:38:33.540]faculty section,
[00:38:35.860]staff section, graduate
[00:38:38.020]student section, you know,
[00:38:39.720]I don't know, visiting artist section
[00:38:42.160]or visiting scholar section, things like
[00:38:44.020]that. You could just keep adding section.
[00:38:46.040]Once you've created the people, you reference
[00:38:48.000]them in there.
[00:38:48.600]It's pulling through my title
[00:38:52.240]here, obviously, and if I click my
[00:38:54.080]name, then it takes me to the page
[00:38:56.220]that I created right at the beginning of the
[00:38:58.100]training. So this is another
[00:39:00.020]example of how this
[00:39:02.040]new system is very modular.
[00:39:03.760]You create one piece of content, you reference
[00:39:06.180]it other places, then
[00:39:08.000]you only have to change it in one place, and then
[00:39:10.120]wherever it's referenced, it would change in all those
[00:39:12.120]places. So, again,
[00:39:14.020]it's very nice.
[00:39:15.960]You don't have to know HTML
[00:39:17.920]JavaScript, and it makes
[00:39:20.200]it pretty slick for building these out.
[00:39:21.900]So we built out
[00:39:23.320]four or five pages on the site, and now
[00:39:26.040]we want to build a front page
[00:39:27.960]to our site, one that's a little more
[00:39:29.480]designed, has a little
[00:39:32.020]bit more of a visual look to it. So
[00:39:33.800]we're just going
[00:39:36.020]to create a welcome page,
[00:39:37.340]and we'll hide the sidebar
[00:39:39.860]here just by
[00:39:42.040]default, because this is going to be a big front
[00:39:43.980]page that welcomes people to our site.
[00:39:47.840]So again, we're going to go into
[00:39:49.680]layout, and this time we're going to
[00:39:51.680]get more into the different components
[00:39:53.580]that you can add to the layout builder page.
[00:39:55.460]So we're going to add
[00:39:57.720]a section here.
[00:39:58.600]Again, we're going to choose one column, and I'll show you
[00:40:01.620]some more of these others when we come back. We're just going to
[00:40:03.620]go default to start.
[00:40:04.740]And now
[00:40:07.660]I can add a component here. So
[00:40:09.420]we're going to choose a
[00:40:11.540]display banner. So a display banner,
[00:40:13.320]again, there's all
[00:40:14.860]explanations of all these components.
[00:40:17.760]And where you can use them
[00:40:19.300]on CMS Docs
[00:40:21.740]website. But a display banner is basically
[00:40:23.820]like a fancy hero.
[00:40:25.140]It allows you to put a big
[00:40:27.720]image on your page.
[00:40:29.340]put some text and maybe even a call to action on it so we're gonna say welcome subhead welcome to
[00:40:38.840]our site we'll choose an image here um let's do this one looks good
[00:40:51.080]um object position that's similar to what i mentioned before where
[00:40:58.620]you know imagine this is a photo behind a matte where you can slide it vertically
[00:41:03.020]we'll just choose this it looks like it's kind of right down the center so you know welcome to
[00:41:10.700]our site where you can learn more about us and what we do
[00:41:17.960]so here's another really cool thing uh within the new system is whenever you're creating a link
[00:41:26.660]within the site
[00:41:27.900]within your internal site whenever there's a url field or component or where whenever you're
[00:41:35.660]creating a link within the WYSIWYG all you really you don't need to know the url of your page
[00:41:42.740]in the previous system you'd have to like go up in the url bar and find it and then copy and
[00:41:48.000]paste it in in this new system if you know the name of the page all you need to do is start
[00:41:53.120]typing it so you know this is a call to action this might be the most
[00:41:57.180]important thing we want people to do so maybe the most important thing people we want people
[00:42:01.700]to do when they come to our site is sign up for training so we know that our web form was
[00:42:05.300]called rsvp so we're going to start typing rsvp you can see rsvp for training is the name of that
[00:42:12.340]page we created i'm going to click it and it automatically creates a link right so
[00:42:17.640]so sign up for training is our text of that link um display option just is where we want
[00:42:26.460]this stuff the headline and the text and the button to float on our image we've got this
[00:42:31.760]tree trunk over here you know and this building over here so the visual information on this photo
[00:42:39.440]is a little bit more to the left i would say so we are actually going to choose
[00:42:42.980]the right to put our text and stuff so we're going to add this block
[00:42:47.480]and you can see we have our big
[00:42:55.740]image with our text and our text is offset to the right which i think is a good choice
[00:43:01.140]because otherwise it'd be kind of over the building here and we'll click save just to
[00:43:06.260]see what it looks like so it looks pretty good but we actually want this to be
[00:43:15.840]full width right at the top of our page and we don't want this page title up here so
[00:43:21.380]first of all we're going to get rid of the page title so that is actually in the
[00:43:25.520]edit
[00:43:25.580]edit tab. We're going to jump back over here. And if you're eagle-eyed, you probably spotted this
[00:43:30.420]earlier when I talked about it, but down by hide sidebar, we can visually hide the page title. So
[00:43:35.860]we're going to do that. We're going to save it. So the gray bar is gone. We've still got this
[00:43:47.000]padding here, and I'll show you how we can get rid of that next. So a couple other things really
[00:43:55.820]quick. You'll see when I move my mouse, if you watch, I'm moving it slowly here. So I move over
[00:44:01.380]this section that I've already created, and there's a small little dotted outline that shows
[00:44:07.040]up whenever I'm over a section that I've created. So whenever I need to edit the section, which is
[00:44:12.900]again, that horizontal band or that row, whatever you want to
[00:44:16.960]think of it as, I'm going to go ahead and do that. So I'm going to go ahead and do that.
[00:44:16.980]think of it like, this is where I configure the section. So similarly, I've added a component to
[00:44:25.920]the section. I've added a display banner. So if I wanted to just edit that, then I hover over
[00:44:31.760]that component and I get this little interface in the upper right-hand side. So I could jump in
[00:44:36.880]and I could configure the display banner on the upper right, just like if I need to configure
[00:44:42.700]the section, it's on the upper left. And in this particular case, we want to configure the section
[00:44:46.940]and we want this to go edge-to-edge and we want to remove that vertical spacing so it's
[00:44:54.240]flush against the navigation. So again, we're just going to click save just to see what it looks like.
[00:44:59.600]I'm a proponent of save early, save often when you're editing pages just to make sure you don't
[00:45:07.260]lose anything. So this is exactly like we want it, right? It's right up against the navigation.
[00:45:11.920]It goes clear edge-to-edge of the browser. I think that looks pretty good. So,
[00:45:16.900]we're going to come back into layout. And we're going to keep building out our front page here.
[00:45:20.980]So we're going to add a section. And this time, we're going to go two column.
[00:45:25.480]And when you add two columns, you have more options in terms of how wide those columns are.
[00:45:33.380]You know, you can make them 50-50. You can make one column wider. And you can put that column
[00:45:37.760]on the left or the right. And then you can do other things with those. But in this particular
[00:45:42.460]case, we're just going to choose 50-50. Again, you can change the background, background path,
[00:45:46.860]pattern. We're going to leave this all default because in what we're doing here, it looks
[00:45:51.980]pretty good. So now, within this new section, you can see that I can add two different components,
[00:45:59.200]right? So I'm going to click add component. And if you're really eagle-eyed, you'll notice
[00:46:05.320]that the components I can add to this layout are just slightly different than the ones
[00:46:12.360]I can add to the full layout. And really, that's just because some things,
[00:46:16.820]visually, look a little bit better, bigger, and you don't want to make them small. And some things
[00:46:21.460]look better small, and you don't want to make them big. Again, there's a list of all the things
[00:46:27.340]you can use and where you can use them on our CMS Docs website. But we're going to put a card in here.
[00:46:32.160]So cards, kind of like, I don't know, a trading card, right? Like a Pokemon card or a baseball
[00:46:40.120]card where you've got an image at the top and a headline and some text, and you can link to other
[00:46:46.780]places. This would be other places, you know, if we're building a website and it's our front page,
[00:46:51.600]this would be other things that we want people to learn about when they're at our website. So,
[00:46:56.140]you know, we could say about our department, right?
[00:47:07.040]Typing's terrible. Okay. So then we have a link here again, and like the other link,
[00:47:15.340]we know we have an about our department.
[00:47:16.740]Page. So we're just going to start typing it. So we're going to type about,
[00:47:20.640]so there it is. It's auto-completing boom. I've created the link.
[00:47:25.540]Let's just say department overline. Again, a lot of these are optional,
[00:47:32.800]so you don't have to fill them out. I'm just filling them out so you can see what they look
[00:47:36.380]like again, another image. So this is going to open media library. We're just going to go ahead
[00:47:44.260]and choose ones that have already been uploaded and pre-published.
[00:47:46.700]Previous trainings. So learn more about what we build and do here. I think you can change the
[00:47:58.560]background color. So we're going to go lightest gray and this card. So we've got this nice visual
[00:48:06.440]here with a headline that links and just to keep it balanced, we're going to go ahead and add
[00:48:11.320]another one on this side. And we're going to
[00:48:16.660]say, you know, meet our people.
[00:48:20.920]So we're going to start typing trainers because that's the name of our page, our trainers we want to link to.
[00:48:26.700]And so we can say trainers, overline
[00:48:30.700]trainers. Let's pop another image in here.
[00:48:46.620]And we're going to change this. And this reminds me,
[00:48:55.340]I am going to remove this link for the headline. And I'm going to show you something.
[00:49:00.300]So you can see I've removed the link for the headline. And now I'm going to scroll down.
[00:49:05.840]And you can see by removing the link for the headline,
[00:49:11.580]I now have the option to add a button in here. So I
[00:49:16.580]am going to this again, I'm going to say, you know, this, we're going to link to our trainers page, right? So we're going to start typing
[00:49:21.820]trainers. And then we can say, you know,
[00:49:26.720]meet our people.
[00:49:28.040]So we're going to go lightest gray and we're going to add this block.
[00:49:36.300]So you can see that by filling out the field on this one, I got a slightly different visual display than
[00:49:46.540]I did on this one, which allowed me to put a button at the bottom. So one of the points I
[00:49:51.940]wanted, and if I were building this in real life, I would keep these similar, right? I wouldn't want
[00:49:56.680]to have these look two different ways right across from each other. I would want both of them to have
[00:50:01.160]buttons or both of them to have their headline as the link. But what I wanted to emphasize with that
[00:50:07.180]was that not only do we have all these different components that you can use while building your
[00:50:12.600]site in Layout Builder, but within the components themselves,
[00:50:16.500]in a lot of cases, there are a lot of different options, display options within the components
[00:50:24.460]themselves. So cards, you can display them differently based on how you choose your
[00:50:29.680]background or where you put your link. We have tandems with three different, very different
[00:50:35.860]visual displays of how those are displayed, which basically is an image and an offsetting text
[00:50:42.200]in that take up one full band. So,
[00:50:46.460]the system is very flexible and it has a ton of different options that you can use within the
[00:50:52.520]components to build out these pages. It's really just, you know, once you start working on the
[00:50:59.280]site, it's really, really good to just start getting in and building pages, you know, and
[00:51:06.380]messing with all the different options. So, on this front page, we're going to add a couple
[00:51:11.820]more things here and then call it good. We're going to
[00:51:16.420]we want to add news, you know, maybe this is our front page
[00:51:19.520]and we want to add news and events. So, we're going to go ahead and add another section here
[00:51:25.860]and then we'll add a component and like the directory, news and events are sort of aggregated
[00:51:40.320]content. They're pulling other stuff that's on the site or other stuff from another
[00:51:46.380]web application at the university. So, we're going to do upcoming events
[00:51:49.880]and in the old system, you actually had to copy and paste JavaScript into your WYSIWYG or into your
[00:51:59.660]HTML view of your page and it was just way trickier than it should have been and the
[00:52:05.940]new system, all you need to do is just type in the name of your events calendar
[00:52:16.340]at UNL and then add it and then it will automatically format and pop in here
[00:52:22.940]nicely. You don't have to know any JavaScript, fortunately, you just have to
[00:52:27.920]know the URL to your events calendar. So likewise, we're going to add our latest
[00:52:34.920]news. If you remember when I added the news item at the very bottom of the news
[00:52:40.460]item that was pulling in all the recent news that had been added to the site, we
[00:52:46.300]were going to go more. We're going to go news aggregation. We'll just change this
[00:52:52.740]to latest news. And then we'll change it to four. And add this block. So you can
[00:53:03.420]see it's pulling in the latest news. Let's just save this page and see how it's
[00:53:07.060]looking.
[00:53:16.260]I think it's looking pretty good. We have our big image here, we have our cards
[00:53:19.680]that will push people into the other sections of our site. Pulling our events
[00:53:24.320]again, we could go in and edit this section to make sure that it goes edge
[00:53:28.440]to edge, because that's really what it should look like. And then we've got our
[00:53:32.360]latest news, you know, we could come in and we could remove some padding in
[00:53:35.540]here, make it look a little cleaner, but overall, it looks pretty good. And it
[00:53:38.880]didn't take us very long to build. So
[00:53:40.440]let's just say we like the look of this page. And we want to use the
[00:53:46.220]most of what's on this page to build another page of our site, since we've
[00:53:49.680]already spent time doing this. So in the new system, we have this handy dandy
[00:53:55.000]button here called replicate. So we're going to replicate this page. And let's
[00:54:04.200]just say we want this to be called academics or something like that. So
[00:54:08.620]we're going to replicate it. And now the
[00:54:16.180]system has completely cloned that front page we created. If I come into edit
[00:54:21.160]here, you can see this is academics is no longer welcome. And if I come into
[00:54:26.620]layout, you know, if I wanted to redesign this very quickly, you know, maybe I
[00:54:31.200]don't want upcoming events on the academics page. So I'm going to remove
[00:54:35.140]that. You know, maybe I don't want latest news on our academics page. So I'm
[00:54:46.140]going to add an image at the top. So I just come over here and I configure
[00:54:48.860]this component and, you know, remove the image and add another image and
[00:54:57.640]scroll down and choose this one and insert that. And, you know, then I call
[00:55:02.340]this learn more about academics. And then I call this academics. I'm not
[00:55:14.160]going to go through everything, but you can see here, you know,
[00:55:16.100]if I just update this and then I click save. And again, you know,
[00:55:24.920]you'd have to adjust all this, but with basically, you know, six clicks,
[00:55:30.040]I've created another page and I've cloned it. And it's very easy to
[00:55:36.060]switch out content. Once you create like a page that you really like
[00:55:39.300]the layout of and replicate that page, switch out the images and the
[00:55:42.580]text. And it just makes it way easier than rebuilding.
[00:55:46.060]It makes it way faster. So I kind of have gone through all these
[00:55:51.980]other tabs now. I just realized I just clicked replicate. So
[00:55:57.280]revisions just shows you all the revisions that have been made to
[00:56:01.720]that page. There's only going to be a couple because I only saved
[00:56:06.840]it twice. But, you know, this is helpful if you have multiple people
[00:56:12.200]editing your site, you can see who all has made changes to
[00:56:16.020]those pages. And if you need to even roll back to a previous
[00:56:19.660]version of the page, you know, like if I wanted to roll back to
[00:56:23.420]the one where I had the previous image, I would just click revert
[00:56:25.860]here and it would revert back. So that's kind of the different
[00:56:29.540]tabs, you know, views, obviously view edit, we've been in there
[00:56:32.380]layouts, layout builder revisions, just what I showed you and then
[00:56:36.120]replicate will duplicate that page. So I'm going to show you a
[00:56:40.480]couple more things really quickly. Before we go into the q&a section,
[00:56:45.980]so content is everything content related. It's where all your pages
[00:56:50.360]live. But it is also where you can add media to your site. So I'm
[00:56:56.840]going to click media. And you know, when I was adding images to
[00:57:01.760]those components, it was opening a little window, which is media
[00:57:06.440]library. So this is really just another way to get to your media
[00:57:09.880]library. It is loading, and I'm getting a buffering
[00:57:15.940]again. So connection unstable. All right, so now we are in our
[00:57:22.580]media library. And this shows you all the different things
[00:57:26.220]that we've uploaded to the site, we have images, we have files, we
[00:57:29.360]have remote video, you've already seen how we add images
[00:57:32.300]to the site. So I'm going to go ahead and show you how to add
[00:57:35.120]files, and remote video, and then how to add those to your
[00:57:39.840]pages. So we're going to go ahead and add a file here.
[00:57:45.900]And I'm going to choose a file. And let's see here.
[00:57:49.780]Upload this. So you'll notice when you upload a file, you get
[00:57:57.960]this little checkbox that says, I certify the following is true.
[00:58:01.540]I've done due diligence to assure that this file meets
[00:58:04.560]accessibility standards. So what does that mean? That means that
[00:58:09.320]if you're uploading either a doc or a PDF to your website, you
[00:58:14.220]should make sure that you have a file that says, I certify the
[00:58:15.860]file. I certify the file. I certify the file. I make sure
[00:58:16.120]that it is accessible. And we have documentation on how you
[00:58:19.840]can do that on our CMS docs website. So what's the benefit
[00:58:24.900]of that? Well, if you have anyone who, well, first of all,
[00:58:31.680]if it's not accessible, anybody who's using like a screen reader
[00:58:36.000]or an assistive device is not going to see it. But I will say
[00:58:39.760]that anytime you upload either a PDF or a doc to your website,
[00:58:45.820]you know, we have, we can see people coming to our website here
[00:58:49.640]and what devices they're using. You know, we are hovering just
[00:58:53.100]under 50% of our total users coming to our website now are on
[00:58:57.060]mobile devices. So I will say that even if you upload something
[00:59:02.520]as a PDF, and even if it is accessible, if you've ever tried
[00:59:07.960]to view a PDF on your phone, it is at best frustrating and at
[00:59:14.340]worst unusable.
[00:59:15.780]So if you have content, therefore, if you have content
[00:59:20.860]that you want everybody who's coming to your website to see
[00:59:25.160]that content should be a web page on your website.
[00:59:29.200]There's really no other way around it. If you want everybody
[00:59:33.300]to be able to see the content on your website, it should be a
[00:59:35.960]web page. I can see some instances where you would upload
[00:59:39.340]a PDF that you might want people to be able to print later
[00:59:43.180]that, you know, print out.
[00:59:45.740]It would be good to maybe have a PDF copy
[00:59:49.000]that they could print perfectly if it needs to be pixel
[00:59:52.160]for pixel. We do have print
[00:59:54.900]CSS on our website, so our web pages do
[00:59:58.120]print pretty nicely.
[00:59:59.200]But again, if you want people
[01:00:04.060]to see the content on your website, it should be a web page.
[01:00:07.160]So having said that, I'm going to check
[01:00:10.040]this. The tagging works very similarly.
[01:00:12.660]You know, this is, let's just say
[01:00:15.700]it's an
[01:00:18.640]example document. So we
[01:00:21.660]don't have, or it's a template document.
[01:00:24.640]Design templates,
[01:00:28.540]you know.
[01:00:29.360]We could say resources is pretty vague.
[01:00:38.800]I don't know if I'd use that, but, you know, we could say
[01:00:42.000]So again,
[01:00:45.660]we're tagging it general to specific.
[01:00:49.100]We're going to save that.
[01:00:50.600]And now we can see that we've uploaded this document to our website.
[01:00:58.580]So similarly, we want to add
[01:01:02.060]a remote video to our website.
[01:01:08.380]We just need to come over here to Media Hub and grab a URL.
[01:01:12.420]We're going to go ahead and add media
[01:01:15.620]remote video.
[01:01:17.720]Let's just do this one.
[01:01:23.000]So we'll add this one.
[01:01:30.100]This is like CB3
[01:01:33.080]and Big Ten
[01:01:37.120]and Research.
[01:01:40.520]And then we'll save that
[01:01:45.580]and we'll go ahead and add
[01:01:46.160]this one.
[01:01:46.180]All right, so we can see
[01:01:56.060]that we added this file
[01:01:57.260]and this video.
[01:01:58.640]So we're going to come back
[01:02:00.300]into our content here
[01:02:01.460]and we're going to come back
[01:02:03.200]into our about page
[01:02:04.720]and add those to our about page.
[01:02:07.940]So here's our about our department page,
[01:02:09.580]the one where we had the
[01:02:10.880]student who's painting the mural
[01:02:12.980]at the very top.
[01:02:13.740]We're going to come in
[01:02:14.640]and we're going to add
[01:02:15.500]this one.
[01:02:15.560]We're going to add the links
[01:02:15.820]to both our document
[01:02:18.880]and then we're going to add
[01:02:20.120]our remote video
[01:02:21.720]to this page as well.
[01:02:22.700]So linking to a document
[01:02:27.800]is very similar to linking
[01:02:29.440]to a page on your website.
[01:02:32.120]If you've uploaded that document,
[01:02:33.720]rather than knowing the URL
[01:02:35.380]to that document,
[01:02:36.240]all you need to do
[01:02:37.180]is click this link button
[01:02:38.400]and start typing the name of that.
[01:02:41.080]So we know that the name of it
[01:02:42.360]was star resources.
[01:02:44.120]So there it is.
[01:02:45.260]I said,
[01:02:45.540]start typing star.
[01:02:46.540]It comes up.
[01:02:48.120]I click it.
[01:02:49.420]I click check.
[01:02:50.300]Boom.
[01:02:51.500]It's created a link
[01:02:52.600]to that document.
[01:02:54.240]Likewise,
[01:02:55.880]if I want to come down here
[01:02:57.160]and add a video
[01:02:58.080]at the bottom of the page,
[01:02:59.060]I click this little media button
[01:03:01.060]and we're in our image tab.
[01:03:04.800]We need to switch over
[01:03:05.640]to our remote video tab
[01:03:07.200]to load those up.
[01:03:08.140]And this takes a second
[01:03:15.520]to switch out
[01:03:17.920]and load those media up.
[01:03:19.100]So you can see here,
[01:03:22.060]big impact research.
[01:03:24.740]We're going to insert that.
[01:03:27.800]And this formatting a remote video
[01:03:31.780]is very similar to formatting an image.
[01:03:34.160]You know, you can offset it,
[01:03:35.920]offset it, float, whatever,
[01:03:37.800]make it narrow, default.
[01:03:39.780]So default is going to be full width.
[01:03:41.860]I think video looks better big.
[01:03:43.780]So I'm going to go ahead and go default.
[01:03:45.500]Click save.
[01:03:46.400]And then now we can see as we scroll down,
[01:03:57.980]I can hover over this
[01:03:59.700]and it's pointing to that PDF.
[01:04:01.040]And we got a big image or a big video.
[01:04:04.500]We might want to make that smaller
[01:04:06.320]or adjust this a little bit,
[01:04:08.080]but you know, we've added our image to our page.
[01:04:11.300]So that is how you add images and video.
[01:04:15.480]And link to those.
[01:04:16.380]I want to touch on two more things quickly,
[01:04:19.500]and then we'll go into training.
[01:04:20.960]So if you, I don't know,
[01:04:24.640]some of the people in here
[01:04:25.500]were probably are building their own site.
[01:04:27.660]And some of the people in here
[01:04:29.220]have probably been handed a site
[01:04:30.800]and given access to a site that already exists.
[01:04:33.740]So to see who has access to your site,
[01:04:39.320]that is in the people tab.
[01:04:41.540]And this shows all the people
[01:04:43.900]who have access to the site.
[01:04:45.460]And then what their access level is.
[01:04:47.060]So if you need to add people to a site,
[01:04:49.540]you can click import a user.
[01:04:51.160]You can search by either their name
[01:04:58.920]or their UNL username.
[01:05:01.060]Import them.
[01:05:05.160]First, you have to import them.
[01:05:06.900]And then once you've imported them,
[01:05:11.160]it will show them.
[01:05:12.780]And once you've imported them,
[01:05:15.440]Once you've added them, it'll typically look like this, and you have to assign them a role.
[01:05:18.720]So the different roles that I have a little bit higher access level, so you won't be able
[01:05:23.880]to see all of these, but the three roles that we're going to talk about today are site admin,
[01:05:29.420]editor, and viewer.
[01:05:30.620]So site admin is kind of the default, and the site admin has access to do pretty much
[01:05:36.400]anything on the site.
[01:05:37.420]They can add content.
[01:05:39.400]They can edit content.
[01:05:40.980]They can delete content.
[01:05:42.160]They can add users.
[01:05:43.760]They can remove users.
[01:05:45.000]They can even come up in here to the configuration system, basic site settings.
[01:05:50.740]So this is, you know, when your site is set up, it's going to have a name and a default
[01:05:56.840]front page and stuff.
[01:05:57.760]So if for whatever reason you need to change the name of your site, you can change it right
[01:06:01.600]here.
[01:06:01.900]If you need to add an affiliation, you can do that right here.
[01:06:07.700]So the affiliation is the little line that is above your site title that can link to
[01:06:13.080]something else.
[01:06:13.680]So.
[01:06:14.060]On this particular site, it's university communication.
[01:06:18.780]That is the affiliation.
[01:06:20.200]You can see it right here.
[01:06:22.240]And for some reason, if you need to change your home, your default front page, you can
[01:06:26.500]do that here.
[01:06:27.040]So a site admin can do all of those things.
[01:06:31.780]They can do anything that somebody could do on a website.
[01:06:34.100]And that's kind of what we've been default giving people.
[01:06:37.760]Um, editor is one step down from site admin.
[01:06:43.960]They can add content and edit content, but they cannot delete content.
[01:06:52.040]They can't do any of that site configuration stuff I just mentioned, and they can't add
[01:06:56.340]or remove other users.
[01:06:57.620]So editor is kind of what it says.
[01:07:00.240]They can add content and they can edit content.
[01:07:02.240]And that's a good role for people who might be helping with the site, but you don't want
[01:07:06.260]them to do any other administrative stuff with the site.
[01:07:09.440]Viewer is the third role.
[01:07:13.440]And that is another step down, even from those other two.
[01:07:16.920]So why would you even give somebody viewer access?
[01:07:23.080]Well, for instance, we could like to call this the approver role, right?
[01:07:28.820]So maybe your supervisor doesn't want anything to do with the website.
[01:07:34.580]They just want to give you the thumbs up or thumbs down on whether pages look good enough
[01:07:39.440]to go live and be public.
[01:07:40.780]So in that particular case.
[01:07:42.980]You know, what you would do is you'd give somebody the viewer role right here and that
[01:07:48.680]viewer can edit or they can view content on your page in whatever status that it is in.
[01:07:55.700]So if I were to go add content builder page right here.
[01:07:59.420]And when I'm adding a builder page, so by default, when you create a page and you click
[01:08:07.720]save, it is published.
[01:08:08.940]And when it's published, if it's.
[01:08:12.820]Included in the navigation, or if it is being linked to anybody can see that page, whether
[01:08:18.200]they have access to the site or not.
[01:08:19.580]There's also two other statuses here.
[01:08:22.320]When you build a page, you can click unpublished and you can click save.
[01:08:27.780]And then that page will not be publicly viewable to anyone who does not have access to the
[01:08:33.240]site.
[01:08:33.500]Likewise, if you have a page that you've already created and you want to create a new draft
[01:08:39.400]of that version.
[01:08:40.060]A draft is like a.
[01:08:41.640]Not quite.
[01:08:42.800]Not quite public version of the same page.
[01:08:45.740]So you'll have a public version of the page and then you'll have a draft, which is theoretically
[01:08:50.380]what you want your page to be after it is approved.
[01:08:53.140]So say you have a supervisor who says, I need three new pages on the site and they need
[01:09:00.400]to be in this section and here's the content.
[01:09:02.340]Make sure nobody can see them until I say so.
[01:09:05.680]What you do is you give them, you give that person viewer access is all to your website.
[01:09:12.780]You would create those pages and make sure that they're saved as unpublished.
[01:09:17.020]And if they were unpublished, you could still share the URL.
[01:09:20.680]It's going to still have a URL.
[01:09:22.440]So, you know, test page unpublished, right?
[01:09:26.680]Test.
[01:09:29.600]So I'm going to save this page.
[01:09:33.140]And even though this page is unpublished,
[01:09:41.700]it's going to, the system is going to create a URL for it.
[01:09:45.440]And then you could share that URL with somebody with a viewer role.
[01:09:49.120]So test page unpublished right here, right?
[01:09:51.920]That's the URL.
[01:09:53.240]If I were to open a private window,
[01:09:55.900]so this is a private browser window.
[01:09:58.520]I am not logged in here.
[01:09:59.740]If I click this, it's going to load.
[01:10:03.840]And it says, I do not have authorized.
[01:10:05.700]I am not authorized to access this page because it's unpublished.
[01:10:08.880]But if that person,
[01:10:11.780]we're given the viewer role,
[01:10:12.760]they could see the page in any status that it has.
[01:10:16.200]So that's kind of the last thing I want to touch on,
[01:10:19.300]on the CMS right now.
[01:10:21.260]I want to touch on one other thing really quick,
[01:10:23.080]and then we'll go to questions.
[01:10:24.020]So what is the process for all this?
[01:10:28.060]Well, if you're in this training,
[01:10:30.760]you have already taken part in the first part of this process.
[01:10:35.720]So this is cms.unl.edu.
[01:10:38.900]And here we have these three boxes, right?
[01:10:41.560]So these are kind of the three steps to get your site live.
[01:10:43.660]Get started is attend a training.
[01:10:45.880]You learn about how to do this thing.
[01:10:47.600]So step two is request a site and start building.
[01:10:51.320]So here you can request any site.
[01:10:53.040]And here's the documentation for all that.
[01:10:55.440]Some of you, you know, maybe all of you already have access to a site
[01:11:00.040]or have already largely built a site
[01:11:02.360]or been handed access to a site that was already built.
[01:11:04.540]So if that's the case, you don't need to worry about this.
[01:11:06.980]The third step is your site is ready.
[01:11:11.520]You're ready to go.
[01:11:11.540]I want to make this my new public version of my site.
[01:11:14.920]Then you'd fill out this form here.
[01:11:16.960]And this just says, hey, the new version of my site
[01:11:20.380]and NextGen CMS is the one that I want to make it public.
[01:11:23.000]And you fill this out.
[01:11:26.660]Here's the CMS site address.
[01:11:28.780]Here's your public site address.
[01:11:30.740]So this would be something like your site.unl.edu.
[01:11:34.640]And then date to go public.
[01:11:37.240]You can put a date in there ASAP or whatever.
[01:11:39.800]And those are typically reviewed every two days
[01:11:41.520]and then they are made live.
[01:11:43.680]So that is sort of the process for it.
[01:11:46.940]Again, the key important dates on all this are December 12th.
[01:11:52.880]December 12th is when we will automatically start
[01:11:58.260]switching subdomains from the Drupal 7 sites,
[01:12:02.620]which is the current CMS, to the NextGen CMS site.
[01:12:06.040]So we will start switching those subdomains
[01:12:11.500]on sites who have had the least amount of activity.
[01:12:14.720]So we're going to give people from the 12th through the 19th
[01:12:19.080]to basically keep chipping away at their sites
[01:12:22.200]before we make them live.
[01:12:23.260]So don't let perfect be the enemy of launched or good.
[01:12:28.380]If your site is really, really close,
[01:12:30.740]go ahead and fill out this form and make it live
[01:12:33.280]because you can keep chipping away at it.
[01:12:34.820]So I said the 12th is when we will automatically
[01:12:38.360]start moving over those subdomains.
[01:12:41.480]At 10 a.m., roughly, I don't know,
[01:12:43.500]it might take a little longer,
[01:12:44.580]is when the old CMS will actually go offline.
[01:12:49.720]So that is UNL CMS, that is Drupal 7,
[01:12:54.820]whatever people refer to it as,
[01:12:56.400]that is when it will go offline.
[01:12:57.960]So we have that week buffer
[01:13:02.640]where we're going to start switching
[01:13:03.700]all those subdomains automatically.
[01:13:05.220]And the 19th then is when it will go offline.
[01:13:11.460]That is pretty much everything I have for my training today.
[01:13:14.240]If you have more specific questions
[01:13:17.120]that have not been answered in the chat yet,
[01:13:19.580]we can go ahead and answer those now.
[01:13:22.540]All right, we got a question that says,
[01:13:35.140]when creating a web form,
[01:13:36.160]is there a timeframe setting, i.e. RSVP window?
[01:13:39.540]So yeah, in the new system,
[01:13:41.540]I'm still sharing my window here, right?
[01:13:42.940]So if we come in here, content,
[01:13:45.280]that's one of the really cool things
[01:13:47.140]about our new web forms.
[01:13:48.960]So if I come in here,
[01:13:52.380]you can see this web form that I've created, right?
[01:13:55.560]RSVP for training.
[01:13:56.640]If I edit this,
[01:13:57.860]and this is the web form page.
[01:14:03.020]This is where we've attached the fields to already.
[01:14:05.080]So you can see here, we've had these settings.
[01:14:07.960]It's by default, it's open.
[01:14:09.240]You can actually close it, open and close.
[01:14:11.420]It manually.
[01:14:11.860]You can also schedule it.
[01:14:13.760]So this is exactly what you're talking about there, right?
[01:14:15.800]You could schedule your web form to be open
[01:14:18.500]from a certain time period, right?
[01:14:20.060]So this specifically to answer Amber's question,
[01:14:24.540]yes, in future or now,
[01:14:26.620]you can schedule a web form to be open
[01:14:29.320]from a certain time period.
[01:14:30.300]So we have another question on the design pieces for layout,
[01:14:34.760]like background colors and graphics.
[01:14:36.280]Are those set limited to what we saw in training?
[01:14:38.380]Are those customizable?
[01:14:39.740]They are limited.
[01:14:41.400]They are limited to what we have in the training.
[01:14:43.040]So we are trying to add more functionality in the future.
[01:14:50.940]You know, all the time we're kind of expanding our components
[01:14:54.380]and expanding what we can do with those.
[01:14:56.760]One of the things we have talked about
[01:14:58.420]is the ability to add a custom background image.
[01:15:03.260]We're just trying to figure out the best way
[01:15:05.040]to make sure that it is accessible.
[01:15:07.400]So that is something that might be coming in the future.
[01:15:11.380]But yeah, we're kind of always working
[01:15:16.320]on building these things out
[01:15:18.480]and making them more flexible for designers and developers.
[01:15:21.260]All right.
[01:15:31.820]Any other questions, feel free to type them in
[01:15:35.400]or even just speak up.
[01:15:36.400]We can answer them.
[01:15:37.400]We don't have tons of people in here.
[01:15:41.360]All right.
[01:15:52.580]Provided that's everything,
[01:15:56.040]I guess we will call this good for today.
[01:15:59.380]If you have any other questions,
[01:16:02.140]oh, the one other thing I would mention is
[01:16:04.240]if you sign up for a site
[01:16:09.060]and typically I'll just create that site
[01:16:11.080]and say,
[01:16:11.340]and when you create that site,
[01:16:13.240]I will give you access to our
[01:16:15.160]UNL web developers Slack channel.
[01:16:18.180]So there's,
[01:16:18.960]I think there's 450 some people in there now.
[01:16:21.980]So there's a lot of discussion of
[01:16:23.620]how can I build this or what can I do
[01:16:26.060]or options and things like that.
[01:16:27.880]So if you were handed a site
[01:16:30.180]and you don't have access to that Slack channel,
[01:16:32.000]just drop me an email if you want to have access.
[01:16:35.180]There's just some good discussion in there.
[01:16:37.380]And if we have announcements or things like that,
[01:16:39.880]we put them in there.
[01:16:40.580]So,
[01:16:41.320]if you do not have access to that Slack channel
[01:16:43.700]and you want it,
[01:16:44.600]please send me an email.
[01:16:45.860]My name's Aaron Coleman.
[01:16:47.240]Once again,
[01:16:47.960]I will make sure this video is uploaded to Media Hub
[01:16:55.280]and captioned.
[01:16:56.560]And then I will send that out a little bit later today
[01:16:58.960]to everybody who took the training
[01:17:00.420]if you want to rewatch it.
[01:17:01.660]There's also a slightly advanced training video
[01:17:06.400]on that CMS Docs website where I take...
[01:17:09.400]So, this training,
[01:17:10.080]we kind of just create a site.
[01:17:11.300]We create a site from scratch.
[01:17:11.920]In the advanced training,
[01:17:14.060]I talk about taking an existing site,
[01:17:17.080]looking at how it was built,
[01:17:18.880]and then basically transferring that content
[01:17:21.420]into existing components within the new system.
[01:17:24.080]So, it's just slightly advanced.
[01:17:25.640]It's just another way to think about it.
[01:17:27.980]But, yeah.
[01:17:31.360]So, 15 seconds.
[01:17:34.800]Any more questions here?
[01:17:36.120]I think we have a question by Jenny.
[01:17:41.280]I'm not sure if you answered this or not.
[01:17:43.520]Can you close a web form when it reaches a certain number of people?
[01:17:48.460]Her question.
[01:17:49.900]That's a good question.
[01:17:53.600]That might be in structure views.
[01:17:56.080]So, sorry, structure web forms.
[01:17:58.740]Let me look.
[01:18:00.160]I think there is a way to do that.
[01:18:02.100]So, if you go, there's a lot of different stuff in here.
[01:18:05.180]So, if I go build.
[01:18:06.220]So, this is the RSVP one that we attached to.
[01:18:11.260]To our page.
[01:18:12.100]And this is where you would customize the fields.
[01:18:14.280]And there's a lot of different options that you can customize.
[01:18:18.440]I'm not like a pro at web forms.
[01:18:20.500]But I have helped some people with some things.
[01:18:23.360]So, there are settings here.
[01:18:24.960]So, there's build.
[01:18:25.820]This is where you put all the fields.
[01:18:27.140]Settings.
[01:18:28.740]This gives me another opportunity.
[01:18:32.040]This is where you set up custom emails.
[01:18:34.240]So, this is where if you, the form is submitted and you want it to email people.
[01:18:39.800]This is under here.
[01:18:41.460]Right?
[01:18:41.600]So, if I want, when this form is submitted, I want it to email certain people within my department.
[01:18:46.760]That is where I would add that as email handlers.
[01:18:49.380]So, I'm guessing what you're asking about is maybe under submissions.
[01:18:55.920]I might not be right here, but we're going to see what's in here.
[01:19:00.360]I think there's a way to limit how many submissions there are.
[01:19:11.220]Maybe not.
[01:19:11.920]Oh, yes, here we go.
[01:19:14.680]So, submission limit settings.
[01:19:17.520]So, total submissions.
[01:19:18.840]So, here's where you could change that.
[01:19:20.660]By default, it's going to be open to however many people can fill it out.
[01:19:26.620]But here is where you would set that.
[01:19:28.160]So, again, this is in your, under structure, web form.
[01:19:34.000]You'd select the web form that you're editing.
[01:19:35.920]You'd choose settings, submissions, and then you scroll down here
[01:19:41.200]scroll, scroll, scroll, and then submission limit settings.
[01:19:44.700]And then this would allow you to not only change the total overall
[01:19:50.240]submissions, but this would allow you to limit how many submissions a
[01:19:56.900]single, I guess, you know, user could submit.
[01:20:02.120]So, per user right here, right?
[01:20:04.180]So, there's a lot of different stuff in here.
[01:20:07.440]And, again, I have not gone through all this stuff in web forms, but
[01:20:10.540]there's a ridiculous amount of stuff in here.
[01:20:11.180]There's a ridiculous amount of customization you can do.
[01:20:14.000]Like, you know, you can set your own confirmation message and all kinds of
[01:20:18.200]stuff like that.
[01:20:18.800]So, maybe 2025 is when we can have the super advanced web form training.
[01:20:27.120]So, anyway, that is possible.
[01:20:31.620]So, are there any other questions?
[01:20:41.160]All right.
[01:20:47.560]With that, we will go ahead and end this training for today.
[01:20:51.480]Thank you all for joining and have a good rest of your day.
[01:20:55.460]I'll send the recording around later.
[01:20:56.800]Thanks a lot.
[01:20:57.660]Bye.

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

November 19 Next-Gen CMS Training

Description

Searchable Transcript

Comments icon comment

Related Channels

Comments