UNL CMS Training March 18
Aaron Coleman
Author
03/18/2025
Added
8
Plays
Description
Learn the basics of building a site in UNL CMS, including content types, components, media library and more.
Searchable Transcript
Toggle between list and paragraph view.
- [00:00:00.000]So it is now recording. If you have questions as we move through the training
- [00:00:06.820]that are specific to what I'm talking about during the training, you can ask those in the chat and
- [00:00:12.440]either Eric or Saron will answer those. If you have more specific questions that aren't necessarily
- [00:00:18.360]related to what I'm talking about in the training, hold those to the end and we'll have, we should
- [00:00:25.460]have some time left over at the very end to answer those questions. So I'm going to share my screen
- [00:00:30.680]now and we will get going. So let's go with, all right, can everybody see my browser with all the
- [00:00:42.340]students running out of the tunnel? Yep. All right. So I don't know how many of you are going to be
- [00:00:51.340]building sites or how many have been given a site and are now taking over
- [00:00:55.380]everything. So I'm going to share my screen now and we will get going. So let's go with,
- [00:00:55.440]editing duties. But this is just to kind of, as you get through the training, you should have a
- [00:01:01.020]pretty good idea of how things are put together either way, either if you've been given a site
- [00:01:06.920]or you've been asked to build a site. So I gave you the address so you could follow along. And
- [00:01:14.540]it's kind of like the old system where you log in up here. And then once you log in and you've
- [00:01:20.160]been given access to a site, you'll see this administrative toolbar at the top of the page.
- [00:01:25.360]And then you'll see these tabs over here at the upper right-hand side of every page that you're
- [00:01:30.400]on. So the biggest difference between this new system and the old system is that this is a no
- [00:01:36.980]code environment. So you don't have to know HTML. You don't have to know CSS. You don't have to know
- [00:01:42.960]JavaScript. In the old system to add, you know, an events calendar, you had to know JavaScript and
- [00:01:48.880]do some editing there. Or, you know, sometimes we ask people to put CSS on their pages,
- [00:01:55.280]just because we just didn't have those controls in place. In the new system, it's all about your
- [00:02:02.200]content. So, you know, we're trying to make it much easier for people who know their content best
- [00:02:07.960]to simply update that content and update it more often. So the new system is really nice in that
- [00:02:15.000]regard. Once you've logged in, if you're familiar with the old system, all this stuff is going to
- [00:02:20.260]look pretty similar. All the content that you add to your site is under this content tab.
- [00:02:25.340]So add content. I'm going to click this just so you can kind of see what these different pieces
- [00:02:29.800]of content are. So in the old system, it was basically we had a basic page. Or if your site
- [00:02:37.620]had been customized slightly, there might have been a few other content types. But the page that
- [00:02:42.500]you used the most probably was a basic page. And if you look through this list, you'll see that
- [00:02:47.080]the basic page is not even there in the new system. Well, the basic page has been replaced
- [00:02:52.480]by the builder page as the page that you'll probably use the most. So if you look through
- [00:02:55.120]this list, you'll see that the basic page is not even there in the new system. Well,
- [00:02:55.160]the basic page has been replaced by the builder page as the page that you'll probably use
- [00:02:55.260]the most. And the builder page is kind of like two pages in one. And I'll get to that
- [00:03:00.320]as we go through the training, but it's kind of like a basic page on one hand. And it's
- [00:03:05.540]also this really expanded version called a builder page where you can use this thing
- [00:03:13.240]called layout builder to build these really complex layouts, again, without knowing any
- [00:03:17.180]HTML. So some of the other content types are book page, news item, person, and web form.
- [00:03:23.360]So we're going to roll through all of these.
- [00:03:24.900]Let's talk about a few other things.
- [00:03:27.800]So you can get to this page just by going to content and clicking add content.
- [00:03:33.860]You'll get to this page.
- [00:03:34.860]And then you can click one of these to add new ones, or you can hover over this, hover
- [00:03:38.620]over add content, and then go down here.
- [00:03:40.780]So we're actually going to start with person.
- [00:03:44.520]And I'm going to build this site kind of from the ground up.
- [00:03:49.700]So there's all these different pieces of content.
- [00:03:51.700]And I think the other biggest difference between this new system and the
- [00:03:54.840]old system is that this new system is a little bit more modular.
- [00:03:59.820]So you can create pieces of content and embed them on other pages and take that content
- [00:04:05.220]and pull it through to other pages on your site.
- [00:04:09.920]I will show a working example of what I mean by that here several times before we finish
- [00:04:15.320]the training.
- [00:04:16.320]So I'm adding a person page here and I'm just going to fill out a couple fields to show
- [00:04:21.120]you kind of what happens.
- [00:04:24.780]This is the display name.
- [00:04:26.780]This is actually a directory reference field.
- [00:04:29.120]So you'll see that it's going to auto complete as I type my name in here and I'm just going
- [00:04:33.420]to choose my name and then you'll see that it shows my university ID and then I'm going
- [00:04:37.980]to click save.
- [00:04:38.980]So I'm not going to add any more data to this page before I save it.
- [00:04:47.140]And even though I only filled out two fields, you'll see that it pretty much built a little
- [00:04:50.740]page for me with a photo.
- [00:04:54.720]My job title and department and all of my contact information.
- [00:04:59.140]So that second field I filled out, which was the autocomplete field, the directory reference,
- [00:05:07.300]all of this information and this photo are actually pulling from directory.
- [00:05:11.620]So in this new system, again, things are connected with not only interconnected, not only within
- [00:05:19.320]this CMS system, but it's connected much more closely with our
- [00:05:24.660]other web applications like events and directory or data, which is also very nice.
- [00:05:31.360]So we're going to come in here and I'll show you just a couple of things to this.
- [00:05:36.000]And again, most of the stuff I show you is going to be a little bit surface level.
- [00:05:39.500]And once you get in here more, you'll see that all this stuff is very expandable, but
- [00:05:46.820]on a person, you'll see that, you know, I just filled out these two fields, but there's
- [00:05:50.780]all these other fields.
- [00:05:51.780]So I can say, you know, Aaron develops.
- [00:05:54.600]Websites and training and other stuff.
- [00:06:07.360]So then we have these optional, you know, directory overrides.
- [00:06:10.860]So let's say for today's purposes, I want to be a lead trainer.
- [00:06:18.520]And then you can fill out all these other fields.
- [00:06:20.180]Maybe I don't like the photo from directory.
- [00:06:22.100]I want something more casual, like, you know, I'm wearing today.
- [00:06:24.540]So I could upload a new photo from that.
- [00:06:27.480]I could, if my phone number isn't correct, I could change that.
- [00:06:30.800]You know, a lot of times people's job titles in directory are a little bit messy anyway.
- [00:06:34.640]So this is just the field that you'd fill out to override that.
- [00:06:38.040]This is also good in the rare instance that you need to add a person to your site
- [00:06:44.620]that isn't in UNL directory.
- [00:06:46.320]You know, maybe you have somebody visiting campus, and you need to make a person
- [00:06:52.300]page for them in that case.
- [00:06:54.480]And fill out this field, the UNL directory reference, you would just fill out all these
- [00:06:58.260]fields here.
- [00:06:58.800]Then this, this is also very useful for somebody who might have a dual role on
- [00:07:06.000]campus.
- [00:07:06.440]And you want to pull some of their directory reference directory information, but maybe,
- [00:07:12.940]maybe they're the head of a committee, right?
- [00:07:16.980]And so you have a committee website or something like that.
- [00:07:20.760]And so for the committee, maybe they're the president of that committee.
- [00:07:23.760]So you'd
- [00:07:24.420]say, you know, in here you'd put president, right?
- [00:07:26.660]So this is just a different way of adding those fields.
- [00:07:33.680]Again, you can fill out education, additional social media.
- [00:07:37.260]There's all kinds of stuff you can fill out here.
- [00:07:39.260]So now you can see it added a little bit of bio information and it overrode my
- [00:07:45.820]title, which is senior web developer with lead trainer.
- [00:07:48.260]So that's kind of the basics of the person content type.
- [00:07:51.840]And now we are going to go in.
- [00:07:54.360]And we're going to add a news item.
- [00:07:55.600]All right.
- [00:08:00.480]So we'll say news item for March 18 training.
- [00:08:06.300]And again, you know, this is like the person content type, there's these
- [00:08:11.740]fields and there's no HTML, so we're just filling in these fields and then
- [00:08:15.480]the system's going to design it all for us with the internal templates.
- [00:08:19.760]And it's going to look nice.
- [00:08:20.580]So you'll notice here for the image, I get a button.
- [00:08:24.300]Called add media.
- [00:08:25.380]So this is going to pop open this thing called media library.
- [00:08:29.100]So media library, if you worked in the old system, uh, you'll know that when
- [00:08:36.660]you managed images in files, you had to go into this thing called like the file
- [00:08:42.060]system, and it was basic Levy where you would, you could create folders in that
- [00:08:48.240]file system and then upload images or files into those folders, or you could
- [00:08:52.060]create folders within those folders.
- [00:08:54.240]Folders within folders and within folders, and then put files in there.
- [00:08:57.260]And then you had to figure out the URL to reference them and things like that.
- [00:09:01.120]This is totally different.
- [00:09:03.120]This is all one big library of files and images.
- [00:09:07.300]And then the way you find them again is through tagging and through
- [00:09:11.880]how you have named that file.
- [00:09:13.320]So it is important to do both correctly and well, so we have some documentation, not only on
- [00:09:24.180]best practices for naming your files and images, but also best practices for tagging your images
- [00:09:31.440]and files, and Eric or Saren could drop those links into the chat, and we could share those
- [00:09:36.480]again later, but I'll show you what this process looks like.
- [00:09:39.000]So again, we're adding an image to a news article here.
- [00:09:43.160]So let's find a nice image to upload here.
- [00:09:54.120]So alternative text, anytime you upload an image, you have to put alt text in there.
- [00:09:59.840]Otherwise, it will just simply not load onto your website.
- [00:10:02.460]So again, this is for accessibility reasons, you know, and then anytime you use that images
- [00:10:08.760]on the site, it will automatically have alt text attached to it, which is nice.
- [00:10:12.020]So we can say to students in school holding laptop with code.
- [00:10:24.060]Custom application displayed on screen.
- [00:10:35.540]So tags, I mentioned this in the documentation, but I like to think about tags as very general
- [00:10:41.160]to very specific to that image.
- [00:10:44.820]Again, this is just a way that you will find these images in the future if you need to
- [00:10:49.180]on your website.
- [00:10:50.940]So let's just say these are students, right?
- [00:10:52.920]So let's start typing students.
- [00:10:54.000]So this gives me an opportunity to show you what not to do.
- [00:11:00.360]So you can see here I have a tag for student.
- [00:11:02.400]I also have a tag for students.
- [00:11:04.000]I also have a tag for student life, which could be argued is a little bit different
- [00:11:08.560]than students or student, but you should never have something so close like student and students
- [00:11:15.120]because think of it as maybe, you know, maybe you're looking for a certain photo and you
- [00:11:22.940]tagged it student.
- [00:11:23.940]But you also have a tag for students, which has different photos of students.
- [00:11:28.680]It might be hard to find that photo in the future.
- [00:11:31.160]So again, you should kind of keep these tags that are similar, should probably just be
- [00:11:37.280]one tag.
- [00:11:38.420]So we're going to go student here, students, sorry.
- [00:11:43.760]And then we'll say, you know, Rick's school.
- [00:11:46.700]So you can see what happens if there's a tag that already exists, it will auto complete
- [00:11:53.880]and I can select that tag.
- [00:11:56.240]If there's not a tag, then I'm creating a tag right now and put a comment in between
- [00:12:01.240]it and you can keep adding more tags.
- [00:12:04.940]So in this particular case, we might want to put a year as well.
- [00:12:09.580]So down the road, maybe we can find all the photos that were taken a certain year.
- [00:12:13.880]Maybe we need to clear some out for some reason, because they're just simply old because we
- [00:12:17.340]know students have graduated and left, left the university.
- [00:12:20.580]So we're going to go ahead and tag that 2025.
- [00:12:23.260]So we've got three tags.
- [00:12:23.820]Here, we're going to insert this.
- [00:12:30.660]So we have a cut line, which is a description of that photo, it's a little bit different
- [00:12:34.720]than the alt tag.
- [00:12:35.720]So this is where we could get more specific.
- [00:12:37.440]So this is where we could say, name of student and name of student
- [00:12:50.180]who are made this major.
- [00:12:53.760]Holding a laptop with the find you app they created.
- [00:13:06.380]So this credit would be whoever took the photo.
- [00:13:09.940]So we're going to say Jordan Popp, University Communication.
- [00:13:18.140]Byline is who wrote the article.
- [00:13:20.120]Again, some of this stuff is optional.
- [00:13:23.700]Byline is optional.
- [00:13:25.920]Image cut line and image creditor are optional.
- [00:13:28.180]But we're going to fill them all out so you
- [00:13:29.400]can see what they look like.
- [00:13:31.440]So we're going to say--
- [00:13:32.280]and rather than watching me type by several paragraphs,
- [00:13:42.140]we're just going to create them in a lorem ipsum generator
- [00:13:45.700]so I can copy them.
- [00:13:47.060]I don't know why this isn't working.
- [00:13:49.860]Anyway.
- [00:13:53.640]Whether-- we'll just copy this and paste it several times.
- [00:13:58.180]All right.
- [00:14:12.340]And so here's a person reference.
- [00:14:13.740]And this is kind of what I talked about before
- [00:14:15.660]with the modular ability of the new site.
- [00:14:17.400]You'll see what this does.
- [00:14:18.480]So this is a person reference.
- [00:14:20.180]If I've entered a person on the site, I can reference them here.
- [00:14:23.580]So this is myself I added earlier in the training.
- [00:14:27.440]And then related links is--
- [00:14:30.340]this is links that will be added into the news article
- [00:14:32.920]that are related to the news article.
- [00:14:36.180]So we know this is Rakes.
- [00:14:37.700]We're going to add our link to the Rakes School.
- [00:14:39.620]You can add another one.
- [00:14:45.700]Maybe we can add--
- [00:14:53.520]So then we'll save this and see what it looks like.
- [00:15:02.760]So you can see here, here's our title, byline, date, cut line,
- [00:15:15.700]photo credit.
- [00:15:17.060]Our image is loaded in here nice.
- [00:15:19.600]Here's the base.
- [00:15:20.460]Here's the body of the story.
- [00:15:22.120]We've got some share.
- [00:15:23.460]Icons over here.
- [00:15:25.560]Again, here's this person reference I added myself.
- [00:15:28.900]So if you have somebody on your site
- [00:15:33.040]who's going to be a contact for your news releases,
- [00:15:36.200]you can add them as a person, and then you
- [00:15:37.900]can reference them here.
- [00:15:39.580]And then here's the related links that I added in.
- [00:15:43.000]And then at the bottom of every news story,
- [00:15:45.260]it automatically loads the most recent four news stories
- [00:15:47.860]that were added to the site.
- [00:15:49.840]So again, no HTML.
- [00:15:51.860]It looks nice.
- [00:15:52.500]It looks like something you'd
- [00:15:53.400]see on Nebraska Today.
- [00:15:55.440]And that is a news story.
- [00:15:57.680]So now we are going to go in here,
- [00:15:59.080]and we are going to go to web form.
- [00:16:01.820]We're going to say RSVP for training.
- [00:16:13.260]And you'll see this little dialog box here.
- [00:16:16.180]Web forms must first be created before referencing them.
- [00:16:19.160]So that might seem a little bit confusing or counterintuitive.
- [00:16:23.340]But this is one of the bigger differences in how
- [00:16:26.080]the two--
- [00:16:26.760]between the two systems.
- [00:16:28.720]On the old site, you just create a web form, and that was that.
- [00:16:31.920]In the new system, the fields--
- [00:16:33.980]pardon me-- the fields that you're collecting and the fields
- [00:16:42.360]that you are designated for the information that you're
- [00:16:44.660]collecting are separate than the page they are attached to.
- [00:16:50.120]So I'm going to go ahead and say--
- [00:16:53.280]RSVP here-- and I'm going to select--
- [00:16:55.960]this is a web form that was created in a previous training.
- [00:16:58.500]And I'm going to click--
- [00:16:59.700]these fields were created in a previous training.
- [00:17:01.740]And I'm going to show you what this looks like when I save it.
- [00:17:05.380]So you can see all these fields are already
- [00:17:08.580]attached to this web form.
- [00:17:10.500]And I said that it's kind of two separate things.
- [00:17:13.620]So what is the benefit of that?
- [00:17:14.900]Well, in the old system, people would often ask us,
- [00:17:17.260]can I just clone a web form?
- [00:17:19.300]And in the old system, you couldn't.
- [00:17:21.280]You'd have to recreate it every time.
- [00:17:23.220]But in the new system, because these things are separate,
- [00:17:27.920]you wouldn't need to clone it.
- [00:17:29.280]You would simply have the fields for the information
- [00:17:32.100]that you're collecting,
- [00:17:34.080]and then you would create a new page
- [00:17:36.380]and attach those fields to that page.
- [00:17:39.320]So what is the benefit of that?
- [00:17:40.720]Well, if you have events that reoccur,
- [00:17:45.720]you know, maybe you have monthly events
- [00:17:48.040]or quarterly events or even yearly events,
- [00:17:50.760]and you don't want to recreate the web form every time,
- [00:17:53.160]you would just have, you'd create these web form fields,
- [00:17:56.820]and then you would just create a new page
- [00:17:59.380]and attach those web form fields to that page.
- [00:18:02.220]And then once they're attached,
- [00:18:04.560]it basically works the same way.
- [00:18:05.880]So you can see, you know,
- [00:18:07.560]if I wanted to see the results of this web form,
- [00:18:10.040]I would click results tab here.
- [00:18:12.380]Again, nobody's filled it out.
- [00:18:13.700]We just built it, but this is a web form.
- [00:18:17.260]This is the web form page with the web form fields attached.
- [00:18:21.880]Well, how do you create the fields
- [00:18:23.100]themselves that attach to the page?
- [00:18:26.940]That is actually in--
- [00:18:28.900]so you can see here the last question,
- [00:18:30.640]do you enjoy the cold?
- [00:18:32.280]So to add more fields to that, you actually
- [00:18:36.220]go to structure and web forms.
- [00:18:38.080]So RSVP is the one we attached, so we're going to build this.
- [00:18:44.360]We're going to work on this one, and we're
- [00:18:48.320]going to add a new element.
- [00:18:53.040]And let's just say radio.
- [00:18:56.100]So we'll add a radio element at the bottom.
- [00:18:58.620]And we'll say, how much snow will we get tomorrow?
- [00:19:10.760]None.
- [00:19:22.980]All right, so we're adding these radio buttons to our web form.
- [00:19:29.460]We're going to save this.
- [00:19:30.720]We're going to save it.
- [00:19:35.020]And now you can see we've added this new field to our web form.
- [00:19:40.900]And now if I go back to content, again, content is where you go
- [00:19:46.620]if you want to see any of the pages that you've created.
- [00:19:49.060]So you can see these ones that we've created, right?
- [00:19:52.920]The person, the news item, and then our web form.
- [00:19:56.060]And then some of this stuff is from older training.
- [00:19:57.940]So we're going to go back into this web form.
- [00:19:59.840]If I scroll to the bottom, you can see,
- [00:20:05.400]because those fields are attached to this page,
- [00:20:08.700]you can see this new field that I just added
- [00:20:11.900]when I went in through structure web forms.
- [00:20:15.120]And then I added more this other field to the RSVP web form.
- [00:20:19.560]So that is web forms.
- [00:20:22.860]That's kind of the benefit of separating those two things out.
- [00:20:25.920]Now I will go to,
- [00:20:30.700]actually, rather than adding a book page,
- [00:20:33.920]I just want to talk about what a book page looks like
- [00:20:36.220]because they're basically the same as the old system.
- [00:20:38.660]This is the Web Developer Network website.
- [00:20:43.960]Underneath documentation,
- [00:20:47.740]if you click UNL CMS documentation,
- [00:20:49.940]so UNL CMS is what we're having,
- [00:20:52.800]training for today.
- [00:20:53.580]So these documentation pages are book pages.
- [00:20:58.060]So you can see this is a book
- [00:21:02.900]called Introduction to UNL CMS.
- [00:21:05.280]All these pages or chapters
- [00:21:08.600]or whatever you want to refer to them as
- [00:21:11.160]are underneath this book
- [00:21:13.800]and they're all kind of nested within here
- [00:21:15.900]and you can nest things multiple layers deep.
- [00:21:19.440]So we have a section called content types.
- [00:21:22.740]And these are some of the ones we've talked about, right?
- [00:21:25.580]And then if I click builder page,
- [00:21:27.500]you can see all of these components
- [00:21:30.120]that you can add to a builder page
- [00:21:31.940]and we're going to get into that in the very near future.
- [00:21:34.280]But basically a book page is really great
- [00:21:38.020]for adding content to your site
- [00:21:39.880]where you want to have this navigation
- [00:21:44.880]that's always off to the right hand part of the screen.
- [00:21:47.760]So it's ordered, it's structured
- [00:21:50.640]and you want that navigation to always be
- [00:21:52.680]there.
- [00:21:52.960]So as you can see, it's very good for documentation.
- [00:21:56.660]It's very good for bylaws and things like that
- [00:22:02.740]where you have information that you want people
- [00:22:06.900]to go through in a certain order.
- [00:22:08.140]I've also seen people use this for building year end reports.
- [00:22:12.360]They can say 2024 annual report would be the title of the book
- [00:22:17.360]and then you would have an introduction
- [00:22:18.900]and you would have data points or whatever you have
- [00:22:22.620]in your annual report.
- [00:22:23.540]But a book page, it works the same way it does in the old system.
- [00:22:28.140]This is what it looks like rather than going through it in the new system.
- [00:22:32.220]I will just point you here and refer you to this UNL CMS documentation,
- [00:22:37.500]not only to see what it looks like, but also because UNL CMS documentation,
- [00:22:41.380]even past today's training, has a ton of information on it
- [00:22:45.900]for building your website.
- [00:22:47.380]So back to UNL CMS.
- [00:22:52.560]So we are now going to go into builder page.
- [00:22:55.500]So builder page, as I mentioned before, it's kind of like two pages in one.
- [00:23:01.200]And we're going to use both of those functionalities here, kind of in a row.
- [00:23:06.400]So we're going to say about our department, we're going to kind of use
- [00:23:13.180]the basic page functionality of the builder page to build this page.
- [00:23:17.060]So we're going to add a new hero.
- [00:23:20.480]Again, this is very similar
- [00:23:22.500]to, so a hero is a big image at the top of the page.
- [00:23:27.100]When I added the hero, it's going to ask me to add media.
- [00:23:30.480]So that's very similar to the news item.
- [00:23:32.280]It's going to want me to upload an image, or I can use an image
- [00:23:35.720]that's already been added to our site.
- [00:23:37.840]So let's just say we want to add, let's use this one.
- [00:23:45.320]And because we've already added alt text when we uploaded this image originally, it's just going
- [00:23:52.440]to pop right in there.
- [00:23:53.400]So the object image, object position, really these first six numbers are the only ones
- [00:24:01.380]you have to worry about.
- [00:24:02.280]So think about the object position as a way, so if you think about the hero image, think
- [00:24:10.740]about it as an image, a photo, or a print behind a mat within a frame.
- [00:24:16.940]And that photo can move around behind there, and the mat will
- [00:24:22.380]kind of cut off parts of it.
- [00:24:23.740]So in this particular case, on the hero, the top and bottom part of the image are always
- [00:24:30.200]going to be a little bit cut off.
- [00:24:31.640]So what this object position does is it determines what part of that image is cut off.
- [00:24:38.620]So maybe you have a portrait of a bunch of people, like a group photo, and their heads
- [00:24:43.820]are right at the top of the photo, and you don't want that cut off.
- [00:24:46.640]In that particular case, you'd choose 50%, 0%, because 0%
- [00:24:52.320]is going to say, okay, 0% is the top of that photo.
- [00:24:55.060]I want it locked to the top of the mat so that their heads
- [00:25:00.560]aren't cut off. And so think about these percentages
- [00:25:04.600]on the right in these first six as if you were
- [00:25:07.900]percentage-based divisions
- [00:25:12.480]of a photo vertically, and then what part of that photo you want to be
- [00:25:16.640]shown automatically. So by default, it's going to be
- [00:25:20.800]the center of the photo.
- [00:25:22.260]So if you can think of a horizon line right down the middle of a photo,
- [00:25:25.980]that is what's going to be right in the center by default.
- [00:25:29.040]Like I said, if you have a group photo with a bunch of people's heads at the top, you want to choose this.
- [00:25:33.680]If you have something where the visual
- [00:25:38.340]information is more at the bottom of the photo, that's where you might want to choose
- [00:25:42.220]50%, 100%. Sorry.
- [00:25:52.200]I was gesticulating too much and knocked my headphone port out.
- [00:25:54.960]I'm going to fill out some of these fields.
- [00:26:00.520]Again, a lot of these are optional, but we're going to fill them out so you can see what they look like.
- [00:26:04.460]You can see this image might work right down the middle. We'll see. We might have to adjust it.
- [00:26:16.560]We're going to create that hero.
- [00:26:22.140]And then we're going to come back over here. We're going to copy this.
- [00:26:25.000]And we're going to paste some text in here.
- [00:26:30.720]Okay.
- [00:26:33.520]So we have our hero. We have our text.
- [00:26:37.120]And we're just going to save it and see what it looks like.
- [00:26:40.140]It's probably not going to look like much.
- [00:26:43.400]All right.
- [00:26:49.080]So this actually looks pretty good.
- [00:26:50.860]We see most of the image.
- [00:26:52.080]Coming through.
- [00:26:52.600]Maybe we want to make it a little bit taller so we can adjust that.
- [00:26:55.320]We've got a little space over here on the right.
- [00:26:58.420]So let's get rid of that.
- [00:27:00.720]And let's add this page to our navigation and do a few other things.
- [00:27:04.400]So we're going to go into the edit tab.
- [00:27:07.280]And we're going to make our image a little bit taller.
- [00:27:13.760]So medium.
- [00:27:19.820]Again, this is kind of.
- [00:27:20.960]This is kind of.
- [00:27:22.060]If I was speaking again about a print or a matte,
- [00:27:25.080]this is kind of determines the matte size, right?
- [00:27:27.660]So small is going to mean not much of the photo showing through.
- [00:27:30.600]Medium is going to be medium.
- [00:27:31.760]And large is going to mean that a large amount of that photo is showing
- [00:27:35.980]through.
- [00:27:36.220]So we're going to update that.
- [00:27:37.340]We're going to put it in the menu.
- [00:27:40.880]So over here on the right is a bunch of administrative stuff related to
- [00:27:44.680]the page.
- [00:27:45.200]We are going to add this to the menu.
- [00:27:47.700]Again, wait.
- [00:27:51.520]Just kind of.
- [00:27:52.040]Determines where that is in the menu.
- [00:27:53.800]URL redirects.
- [00:27:57.280]This is if you have a old URL for a page that you're creating for a new
- [00:28:01.020]page.
- [00:28:01.360]Do you want that old URL to redirect to the new one?
- [00:28:03.620]You can add a redirect.
- [00:28:04.940]Alias by default,
- [00:28:07.700]the system is going to create a nice alias for you,
- [00:28:10.020]but if you want it to be something very specific,
- [00:28:11.900]you can uncheck that and create your own alias.
- [00:28:15.100]Authoring information just tells who created the page.
- [00:28:18.960]Promotion information.
- [00:28:22.020]Promotion is something that we just don't use.
- [00:28:23.560]It's just in there.
- [00:28:24.740]It might be something we use in the future,
- [00:28:26.340]but you won't use that for now.
- [00:28:28.620]And then page options is a place where you can hide the page title
- [00:28:35.080]or hide the sidebar.
- [00:28:36.640]So that little space that was in there that you couldn't see anything
- [00:28:41.760]is actually if you add pages to your navigation
- [00:28:45.260]and then you add pages under those pages in the navigation,
- [00:28:47.880]you get a little sidebar navigation that's very similar to a book,
- [00:28:52.000]navigation.
- [00:28:52.600]We're going to hide this.
- [00:28:54.620]We're going to actually come in here and do a little bit more formatting.
- [00:29:00.060]So we're going to add a header to.
- [00:29:03.320]And again, the WYSIWYG is just kind of like it used to work on the old site,
- [00:29:09.200]pretty much the same way.
- [00:29:10.440]You can add bullet lists.
- [00:29:11.560]You can add hard returns.
- [00:29:12.700]Maybe we want another photo in here.
- [00:29:15.900]So I'm going to go into the media library, pop that open.
- [00:29:21.980]Maybe find another one that we've already uploaded.
- [00:29:25.520]So I've got another image here.
- [00:29:28.420]And then this determines kind of how the image is formatted.
- [00:29:32.660]So narrow is going to be how wide it is.
- [00:29:35.460]So narrow is going to be about half the viewport width.
- [00:29:37.820]Wide is going to be the whole viewport width.
- [00:29:41.440]And then this is just how it offsets with text.
- [00:29:44.860]So left offset, center offset, left float, right float.
- [00:29:51.280]I think right.
- [00:29:51.960]Float looks pretty good.
- [00:29:52.940]We've got it added to the navigation.
- [00:29:54.500]We removed the sidebar and we're going to click save.
- [00:29:57.780]All right.
- [00:30:03.980]So you can see this is visually, we made the hero taller.
- [00:30:07.440]It looks pretty good.
- [00:30:08.380]We added another header in here and we floated this image.
- [00:30:13.800]So this page looks pretty good.
- [00:30:15.060]We added to the navigation.
- [00:30:16.220]So this is kind of the basic page functionality of a builder page.
- [00:30:21.940]You can create a page and make a pretty nice looking one without even using layout builder.
- [00:30:28.360]But now we are going to get into layout builder.
- [00:30:33.840]So we're going to do another builder page.
- [00:30:35.820]And we are going to do a splash page.
- [00:30:41.340]So we're going to do a front page to our site.
- [00:30:43.540]And we're going to go ahead and click save.
- [00:30:46.060]All right.
- [00:30:52.320]So now we're going to go into the layout tab.
- [00:30:55.740]So in the layout tab, you'll see, there's a lot more stuff in here.
- [00:31:06.600]This is actually a placeholder for the edit tab.
- [00:31:10.860]So when we were in the previous tab, if I would have put text in there,
- [00:31:13.500]it would have shown up here again.
- [00:31:15.840]This is just the placeholder for that menu that will show up by default.
- [00:31:18.820]These just, you don't really kind of need to worry about this stuff if you're just
- [00:31:21.900]building a page in the layout tab.
- [00:31:24.460]But we're going to go ahead and add a section.
- [00:31:28.660]So if you think about a layout in Layout Builder,
- [00:31:35.140]think about it as rows with columns in them.
- [00:31:39.460]At a very basic level, you're building things in a table.
- [00:31:43.840]You're creating rows, and then you're putting columns in them.
- [00:31:47.520]Or in the old system, I think we referred to them as bands.
- [00:31:51.880]These are called sections, and then we're
- [00:31:53.580]putting layouts in them.
- [00:31:54.780]It's all the same thing.
- [00:31:57.120]So when you add a section, then you
- [00:31:58.760]choose a layout for that section.
- [00:32:00.220]In this particular case, we're going to choose a one column.
- [00:32:04.200]So once you've choose the layout for that section,
- [00:32:06.660]then you have a bunch of other options.
- [00:32:08.240]You can add headings.
- [00:32:11.100]You can format that heading.
- [00:32:13.360]You can choose backgrounds, background patterns.
- [00:32:15.760]You can choose a--
- [00:32:21.860]container and spacing.
- [00:32:29.800]So the container is kind of the width.
- [00:32:31.900]And the spacing is the vertical padding.
- [00:32:34.260]In this particular case, we are going to use lightest gray.
- [00:32:42.440]And then we're just going to use landmarks.
- [00:32:44.920]So we're going to save this.
- [00:32:46.240]And now you can see, any time you add a section,
- [00:32:51.840]it automatically gives you the ability
- [00:32:53.300]to add another section, both above and below it.
- [00:32:56.440]So I'm going to add a component here.
- [00:32:59.100]And we're going to build a directory page.
- [00:33:01.600]So this is kind of a--
- [00:33:03.380]there's-- so when you add a component,
- [00:33:07.600]there's kind of two levels of components
- [00:33:09.640]that you're adding to a layout builder page.
- [00:33:14.280]I like to tell people to think about it this way.
- [00:33:16.820]So this stuff on this first section
- [00:33:19.120]here is all for content.
- [00:33:21.820]This is content that you're adding directly to this page.
- [00:33:25.600]So you can actually click More here.
- [00:33:27.520]And when you click More, this is actually
- [00:33:30.520]content that might be coming from somewhere else on the site
- [00:33:33.580]or from some other web application entirely.
- [00:33:38.780]So we're going to build a people list.
- [00:33:40.440]We're going to actually build a curated list of people.
- [00:33:42.660]And we'll say Lead Trainer.
- [00:33:51.800]And we're going to do Teaser Feature.
- [00:34:03.220]I'm going to add that.
- [00:34:06.420]And so you can see this is displaying me here.
- [00:34:15.180]And then I'm going to add another section.
- [00:34:17.360]And we're going to go one column.
- [00:34:18.780]And I'm going to roll through this quick because you don't really
- [00:34:21.780]mess with this.
- [00:34:25.000]Add component, more.
- [00:34:28.600]I'm going to add another people list, other trainers.
- [00:34:33.760]And we'll add Saren and Eric, who
- [00:34:39.960]were added in previous trainings.
- [00:34:41.900]We'll make them teasers and we'll add them.
- [00:34:46.380]All right.
- [00:34:47.660]We're going to save this.
- [00:34:48.960]And I messed up a little bit.
- [00:34:50.260]I said we were building a welcome page
- [00:34:51.760]and we're actually building a person page.
- [00:34:55.220]So we're going to edit this and we're going to say--
- [00:35:00.340]we're going to make this our people, our trainers.
- [00:35:04.720]So we're going to save this and we're
- [00:35:06.140]going to put it in the navigation.
- [00:35:09.600]Maybe move it over a little bit.
- [00:35:10.980]All right.
- [00:35:17.800]So you can see we added this to our navigation.
- [00:35:20.300]We have a page called Our Trainer.
- [00:35:21.740]We've got Lead Trainer, which is myself.
- [00:35:25.320]And we put this background on it.
- [00:35:27.260]And then we have other trainers, Saren and Eric.
- [00:35:29.960]So they're displaying in a slightly different way.
- [00:35:34.180]So this is if you have a directory page
- [00:35:37.120]and you want to build it out so that maybe you
- [00:35:40.500]have a section for faculty, staff, graduate students,
- [00:35:44.760]support staff, things like that.
- [00:35:46.380]This would be a good way to add those sections in once you've
- [00:35:50.420]added the people to your site.
- [00:35:51.720]And then you just have to add them in.
- [00:35:53.780]The other nice thing about it is this
- [00:35:55.440]is something that came up the other day.
- [00:35:57.100]I'll show you.
- [00:35:57.740]So within the person section of the Layout tab--
- [00:36:08.520]come on.
- [00:36:13.540]Maybe my connection's a little slow here today.
- [00:36:20.960]All right.
- [00:36:21.700]So you can come in here, and you can configure these.
- [00:36:27.340]So maybe I need to add--
- [00:36:28.800]so maybe I need to add--
- [00:36:30.880]I have anybody else in here?
- [00:36:36.460]Oops.
- [00:36:36.960]No.
- [00:36:41.180]Anyway, so if you need to rearrange these people,
- [00:36:49.260]these are actually draggable.
- [00:36:50.500]So you can actually just drag.
- [00:36:51.680]You can drop an update and save it.
- [00:36:56.840]So we built a little basic directory page here.
- [00:37:06.940]So now we're going to go back, and we're
- [00:37:08.560]going to add our welcome page.
- [00:37:09.960]I kind of jumped the gun there.
- [00:37:11.220]But we're going to go back into the Layout tab,
- [00:37:12.920]and I'm going to talk about that a lot more.
- [00:37:15.380]So we're going to add our welcome page,
- [00:37:17.260]and we're going to click Save.
- [00:37:21.660]And then again, we're going to go back into Layout, which you've
- [00:37:26.740]already saw a little bit of.
- [00:37:28.040]So we're going to add a section here.
- [00:37:30.280]Again, we're going to do one column.
- [00:37:32.420]We'll just keep all this for now.
- [00:37:36.080]And then we're going to add a component here,
- [00:37:38.740]and we're actually going to do these components.
- [00:37:41.180]We're going to add a display banner, which
- [00:37:42.920]is kind of like a fancy hero, basically.
- [00:37:44.780]It's a big image, and you can add buttons and text and stuff
- [00:37:48.480]like that on it.
- [00:37:49.320]So I'm going to fill these all in.
- [00:37:51.640]And then I'm going to call it out again.
- [00:37:53.300]Some of them are optional.
- [00:37:56.460]So again, we're going to add an image.
- [00:38:03.280]So again, rather than uploading, we're
- [00:38:04.940]just going to choose one that's already been there.
- [00:38:08.700]So we'll do this one.
- [00:38:09.680]Yeah, you can change the object position there.
- [00:38:16.580]So more about our department.
- [00:38:21.620]And do-- so these are call to action links.
- [00:38:29.120]So these are buttons that will show up in your hero.
- [00:38:31.120]So these would be the things that you want.
- [00:38:33.040]If you're going to put anything in here,
- [00:38:34.700]this should be the most important things
- [00:38:37.420]that you want people to do when they come to your site.
- [00:38:39.840]So in the old system, if you wanted to link a page,
- [00:38:44.740]you had to know the exact URL of that page.
- [00:38:46.880]In the new system, it's so much easier.
- [00:38:48.700]All you need to do is start typing the name
- [00:38:51.600]of that page.
- [00:38:52.500]So here, again, we created this web form.
- [00:38:55.460]So maybe the most important thing we want people to do
- [00:38:57.760]are sign up for training.
- [00:38:59.080]So we're going to link that web form, and I just created a link.
- [00:39:02.080]I started typing the name of the page,
- [00:39:03.720]and then I selected that page.
- [00:39:05.980]And UNL CMS just creates an internal link.
- [00:39:10.100]So it'll say, sign up for training.
- [00:39:13.480]And then the display option, this just determines where the text floats on this image.
- [00:39:20.490]By default, it's going to be left.
- [00:39:22.430]You can see here, these are the, you know, by this image is probably going to float kind
- [00:39:26.390]of right down in here, which is good because it's not going to cover anybody's faces.
- [00:39:30.330]So we're going to go ahead and add this and we'll click save.
- [00:39:42.450]So you can see we've got some issues here.
- [00:39:44.750]We've got their heads are cut off and we've got all this space around here and maybe we
- [00:39:50.890]want to get rid of the page title.
- [00:39:52.510]So if you remember, let's just knock all these things out.
- [00:39:56.490]So if you remember previously, when we were in the edit tab, I showed you down the right
- [00:40:01.950]hand side, you can get rid of the page title here.
- [00:40:05.230]So we're going to hide the page title and we want to get rid of some of this space.
- [00:40:12.450]So we're going to get rid of the spacing and we also want to fix the image.
- [00:40:14.850]So to get rid of the spacing, you'll see when I'm actually moving around in the layout tab,
- [00:40:21.410]let me show you this.
- [00:40:28.470]One of the nice things about there's a consistent interface here.
- [00:40:33.170]So when I'm rolling my mouse around, you'll see when I'm over hovering over the section,
- [00:40:39.570]which is kind of the.
- [00:40:42.450]Container for this content.
- [00:40:46.830]Then I can configure that in the upper left hand part of the screen.
- [00:40:52.030]If I've already added a component to that section.
- [00:40:55.730]If you hover over the component, you get a little edit in the right upper right hand
- [00:40:59.830]part of that component.
- [00:41:01.210]So first we're going to get rid of the spacing.
- [00:41:04.230]And in here, we're actually going to remove the default vertical spacing.
- [00:41:08.910]This over here is actually a multi select.
- [00:41:10.910]So if I hold down my command key.
- [00:41:12.450]I can remove the default and add an add.
- [00:41:17.190]I could add extra bottom, you know, if you wanted to.
- [00:41:22.890]You could remove the top and the bottom.
- [00:41:25.810]And if you hold down the command key, it'll give you the option to both multi select and
- [00:41:31.390]deselect.
- [00:41:32.390]So we are going to choose to remove the default vertical.
- [00:41:42.450]Now you can see that space that was there before is gone.
- [00:41:45.890]We also want to configure the object position a little bit on this photo.
- [00:41:52.490]So again, I mentioned if you think of a photo as a percentages, vertical percentages, so
- [00:41:58.770]you can see here their heads are getting cut off.
- [00:42:00.930]If I were to visually divide this photo, you know, their heads are probably about 20%,
- [00:42:06.850]25% of the way down.
- [00:42:09.090]So we could say 20% this might be good enough.
- [00:42:12.450]Let's see what happens.
- [00:42:13.250]Top of their heads might be cut off still.
- [00:42:16.770]This looks pretty good.
- [00:42:19.250]The people in the foreground are not cut off.
- [00:42:22.050]Oh, and then also we want it to go side to side.
- [00:42:24.210]So we're going to configure this section and we're actually going to go edge to edge.
- [00:42:27.490]So, all right.
- [00:42:30.450]There we go.
- [00:42:32.050]Let's save it one more time.
- [00:42:33.410]Save early, save often.
- [00:42:34.850]It's always a good thing.
- [00:42:35.810]Oh, it's still cut off.
- [00:42:39.490]I might need to clear the cache on my site.
- [00:42:41.810]So that's enough.
- [00:42:42.450]Another good thing I'll mention, but I'll show you that here after a bit.
- [00:42:44.850]We could see it in the preview that it looked pretty good.
- [00:42:50.050]So we're going to go back in here and we're going to add some more
- [00:42:54.930]information to our page.
- [00:42:56.930]So we're going to add another section here with the two column layout.
- [00:43:01.250]So by default, all the padding is pretty nice.
- [00:43:04.770]So we're just going to leave that default padding in there.
- [00:43:07.650]We're going to do a new component.
- [00:43:09.570]We're going to do a card.
- [00:43:13.090]And visually, that kind of looks like what you'd expect,
- [00:43:15.250]like a baseball card or a Pokemon card or whatever.
- [00:43:18.130]It's a photo at the top with some information below it.
- [00:43:21.250]So we're going to say "Apartment."
- [00:43:24.930]This is a link here.
- [00:43:31.250]So again, if I want to create a link, I just start typing.
- [00:43:35.010]We'll do "About Overline."
- [00:43:42.450]We'll put a photo in here.
- [00:44:12.450]We'll use a background for that card.
- [00:44:13.970]So we're going to do "Lightest Gray," and there's that.
- [00:44:19.250]So let's keep this balanced.
- [00:44:21.010]Let's add another card over here,
- [00:44:23.250]and we'll say "About People."
- [00:44:29.250]And I'm going to skip this link
- [00:44:31.970]because I want to show you something here.
- [00:44:33.250]So we'll say "People Overline," "People Subhead."
- [00:44:38.930]Again, some of these are options.
- [00:44:41.250]The ones that are required
- [00:44:42.450]have a little red star next to them.
- [00:44:45.010]So let's just do...
- [00:44:50.450]So here, you'll notice
- [00:45:09.410]I didn't fill this headline link in here.
- [00:45:12.450]And now I have the option to add buttons
- [00:45:14.610]at the bottom of this cart.
- [00:45:15.730]Again, there's a URL field.
- [00:45:18.450]So I'm gonna start typing trainers.
- [00:45:21.090]So our trainers, we're linking to our trainers page.
- [00:45:25.170]People, and we'll just do a light gray,
- [00:45:31.010]lightest gray, and save that.
- [00:45:33.730]And then we'll come up here.
- [00:45:39.410]Yep, it loaded.
- [00:45:42.450]Then we'll save our page.
- [00:45:43.570]So you can see here,
- [00:45:51.170]I added a link to the title field,
- [00:45:58.050]and it created a title link.
- [00:45:59.570]I skipped it on this one,
- [00:46:01.330]and then I had the ability to add a button link.
- [00:46:03.970]So I think if I were designing this for real,
- [00:46:08.290]I would make the styles of these match.
- [00:46:11.330]So I'd make both of them,
- [00:46:12.450]the headline title links,
- [00:46:14.850]or both of them use the button links.
- [00:46:16.610]The main reason I did this was to show you that
- [00:46:20.210]in addition to having all these different components
- [00:46:23.090]that you can use on your website,
- [00:46:24.530]within the individual components,
- [00:46:27.970]there are also a bunch of options.
- [00:46:29.810]So there's these options for cards.
- [00:46:32.290]We have a component called Tandem
- [00:46:35.490]that has a bunch of different options for display.
- [00:46:38.050]The hero obviously can move the text around
- [00:46:41.090]and do some other things like that.
- [00:46:43.010]But the system is very flexible in terms of
- [00:46:45.490]how many different display options it'll allow,
- [00:46:48.210]not only with the different components,
- [00:46:50.770]but within the components themselves.
- [00:46:52.290]So let's add some events to our site.
- [00:47:01.090]So we're going to come in here, one column.
- [00:47:04.050]I'm going to kind of roll through this quick here,
- [00:47:06.050]kind of closing in on the end.
- [00:47:07.810]So we're going to add a component.
- [00:47:10.690]And again, think about this as in, well,
- [00:47:12.450]is this content going to be living on this page,
- [00:47:15.650]or is this content that I'm pulling from another page?
- [00:47:18.230]In the events case, we are actually
- [00:47:20.430]pulling from the event system.
- [00:47:21.850]So we're going to click More.
- [00:47:23.770]And we're going to click Upcoming Events.
- [00:47:25.430]So then this is something I mentioned previously,
- [00:47:31.090]where when you're adding events to your website,
- [00:47:36.970]you had to know JavaScript and CSS.
- [00:47:39.770]In this new one, all you have to know is your event.
- [00:47:42.450]So we're going to go ahead and add the events calendar URL.
- [00:47:46.110]So we're going to add this block.
- [00:47:47.910]And you can see it's automatically
- [00:47:51.790]populating with events from our system.
- [00:47:54.590]When we added that news item, we had those most recent news
- [00:47:58.570]items pulling in at the bottom of it.
- [00:48:00.630]Since this is our front page, we want those news items as well.
- [00:48:03.510]So we're going to go ahead and add a column here.
- [00:48:12.450]We're going to go More because, again, that's pulling content
- [00:48:17.090]from elsewhere on the site.
- [00:48:18.210]So we're going to do News Aggregation.
- [00:48:21.410]And we'll do Latest News.
- [00:48:24.350]So by default, it's going to say 8.
- [00:48:26.770]I think 4 is just the kind of looks good across there.
- [00:48:30.910]So we're going to add this block so you can see latest news,
- [00:48:37.490]coming events.
- [00:48:39.070]So we'll save this layout.
- [00:48:42.450]And you can see we have a pretty--
- [00:48:47.270]we could fix some of the spacing here and there.
- [00:48:51.350]But otherwise, we have a pretty nice looking front page.
- [00:48:56.650]So I will touch on this, why these people are cut off here
- [00:49:01.310]right at the very end, because it takes a little bit
- [00:49:03.050]to do this thing.
- [00:49:04.210]But I want to touch on a couple other tabs here.
- [00:49:07.330]So we've been View.
- [00:49:08.770]We're viewing the page.
- [00:49:10.510]We've been in the Edit tab.
- [00:49:12.050]We've been in the Layout tab.
- [00:49:13.250]We've built several pages with Layout Builder.
- [00:49:15.590]Revisions is exactly what it says it is.
- [00:49:18.470]This will show you all of the revisions
- [00:49:20.990]that have been made to a page, and then
- [00:49:23.070]who made those revisions.
- [00:49:26.790]So this is nice, not only if you have multiple people editing
- [00:49:30.110]your site to see who made edits to a page,
- [00:49:33.110]but also if, for whatever reason, maybe you make an edit
- [00:49:38.030]and you realize, oh, I screwed that up.
- [00:49:41.650]I need to just roll it back to what it was previously.
- [00:49:44.710]You can actually revert back to a previous version.
- [00:49:48.650]So that's the Revisions tab.
- [00:49:50.950]The Replicate tab is a new feature on the new site.
- [00:49:56.230]And so say I really like this layout of this page,
- [00:49:58.770]but I don't want to rebuild the whole thing.
- [00:50:00.770]Maybe I want to use just parts of it.
- [00:50:03.130]So rather than rebuild it, you just click Replicate.
- [00:50:06.610]So maybe we're going to call this new page Academics.
- [00:50:11.250]Click Replicate, and then very quickly, we have a new page.
- [00:50:20.970]So this is our new page called Academics.
- [00:50:24.390]We can go into the layout.
- [00:50:26.170]Maybe we don't want all this stuff at the bottom,
- [00:50:28.470]but we want these big images at the top.
- [00:50:30.490]So we can come into the Layout tab very quickly.
- [00:50:35.470]Just say, OK, we don't want events on our Academic page.
- [00:50:40.850]Maybe we don't want news on our Academics page,
- [00:50:45.210]so we're going to remove that.
- [00:50:48.430]We want this to look different, so you can come in here.
- [00:50:51.070]Again, editing the component, you roll over it,
- [00:50:54.250]you go to the upper right.
- [00:50:55.690]So we're going to configure this.
- [00:50:58.630]We're going to remove that.
- [00:51:01.410]We can say, Academics, subhead, Academics,
- [00:51:10.450]I can add a new image, maybe just something down here.
- [00:51:15.010]Different information, change the link,
- [00:51:24.770]whatever it's going to be.
- [00:51:26.150]And then we can save it.
- [00:51:40.050]So you can see here, if I'm going to add text,
- [00:51:45.410]it'd probably need to be a little bit more there
- [00:51:47.410]because it's stretching out.
- [00:51:49.250]That looks kind of odd.
- [00:51:50.250]But anyway, so that's a really easy way to duplicate a page.
- [00:51:53.630]And then I could switch out these images
- [00:51:55.590]and switch out this text, and then we'd have a different page.
- [00:51:58.330]So the Replicate tab is really nice.
- [00:52:00.030]Maybe if you build a layout that you really like
- [00:52:02.470]and you want to have the same layout across several pages
- [00:52:05.590]of your top level, your site, create the first one,
- [00:52:09.050]then replicate it.
- [00:52:09.930]Change the information.
- [00:52:12.070]So previously, I showed you how to add images
- [00:52:18.550]to the media library when you're adding a component.
- [00:52:22.110]If you go to Content and go to Media here,
- [00:52:31.130]this is the other way that you can add images and files
- [00:52:37.790]to your website.
- [00:52:38.610]So this interface--
- [00:52:39.810]this interface shows you all the media on your website.
- [00:52:41.890]So we can see these images that--
- [00:52:44.650]this image that I uploaded today,
- [00:52:46.030]and you can see some of this old stuff.
- [00:52:47.610]So we're going to add a file now.
- [00:52:49.630]We're going to add a media, and we're going to add a file.
- [00:52:52.630]So choose a file.
- [00:52:59.370]Let's see here.
- [00:53:00.170]So we're going to upload that.
- [00:53:09.690]And you'll see this checkbox that you need to check before you upload a file.
- [00:53:16.270]So this checkbox just says, I've done due diligence to assure this file meets
- [00:53:20.530]accessibility standards.
- [00:53:22.590]So this just means if you're uploading a PDF or a Word document or PowerPoint or
- [00:53:28.110]something, you need to make sure that that document is accessible before you
- [00:53:32.310]upload it.
- [00:53:33.530]So we have some information on that documentation site that I shared earlier
- [00:53:38.350]about how you can create
- [00:53:39.570]accessible PDFs and accessible Word documents.
- [00:53:44.050]Having said that, I will say that if you want information on your site to be
- [00:53:50.010]viewable by everybody who's coming to your site, then that information should be
- [00:53:54.150]a web page.
- [00:53:56.550]The reason I say that is because we have a board over here that shows the traffic
- [00:54:00.750]coming to our website and the traffic coming to our website is almost 50% mobile.
- [00:54:05.690]So if you have ever tried to view a PDF on your
- [00:54:09.450]phone, you will know that it is difficult.
- [00:54:13.370]Well at best, the experience is usually difficult and at worst it is unusable.
- [00:54:21.130]So PDFs are really not great if they are the single source of content on your website
- [00:54:27.490]for certain content that you want people to see because by definition, you know, a lot
- [00:54:34.170]of people are going to have struggle seeing it and if it's inaccessible, there are some
- [00:54:39.330]people who simply won't be able to see it.
- [00:54:41.410]So I will say again, if you have to, if you have information on your site that you want
- [00:54:48.990]viewers of your website to see, all of your viewers, it should be a web page.
- [00:54:56.650]So tagging is very similar to images, I would say work general to specific.
- [00:55:02.070]So this is a leadership, again, there's no tag there, it didn't auto complete.
- [00:55:09.210]Student life.
- [00:55:12.150]There's a tag there, someone selected, and this is from 2025.
- [00:55:16.110]So we will search that and we will save it.
- [00:55:24.870]So now we are in our media library, and we can see this image that or this document that
- [00:55:30.670]we uploaded.
- [00:55:31.930]And now we're going to add a remote video.
- [00:55:34.210]So a remote video is very easy to add.
- [00:55:39.090]Let's just say we're going to add a remote video.
- [00:55:54.490]So to add a remote video, all you need to know is the URL for that remote video.
- [00:56:03.290]So we're going to put this in here.
- [00:56:05.130]It's like it's rake school.
- [00:56:08.970]And what is this design studio in 2025?
- [00:56:23.810]So we'll save that.
- [00:56:31.890]So we've added a file and a video to our website.
- [00:56:34.930]How do we add those to our pages?
- [00:56:36.090]Well, we are going to come in here to content.
- [00:56:38.850]And we are going to go into our about our department page.
- [00:56:44.730]And we're going to edit this.
- [00:56:51.990]So adding a link to a file is as simple as adding a link to a page in the new system,
- [00:56:57.750]rather than knowing having to know the URL structure for that file, all you have to do
- [00:57:02.650]is click the link button and start typing the name of it.
- [00:57:05.230]So we know that that's student life.
- [00:57:06.730]And we can see here.
- [00:57:08.730]I click that, click the checkmark and boom, we've created a link to our file.
- [00:57:15.250]Similarly, adding a video is as easy as adding an image.
- [00:57:19.570]We just come up here to the media library, pop that open, and then we click the remote
- [00:57:27.330]video tab and it takes a second to switch over to the remote videos and we scroll down
- [00:57:38.610]here.
- [00:57:39.610]Choose this file, insert it.
- [00:57:44.210]And then formatting that video is as simple as formatting the image.
- [00:57:47.630]So again, float left, float center.
- [00:57:51.610]We could offset it with text.
- [00:57:53.530]We could make it very large.
- [00:57:57.630]And then we could save it.
- [00:58:08.490]What's going on here?
- [00:58:09.450]This looks like, Sarah, this is something we'll have to look into.
- [00:58:26.130]Yeah.
- [00:58:27.050]I think it might be happening because of some new update we made recently.
- [00:58:32.590]I'll check it out.
- [00:58:35.210]At any rate, we'll remove this link for now.
- [00:58:37.730]Looks like that.
- [00:58:38.370]It's causing an issue, but we'll look into that.
- [00:58:41.470]So let's save the page.
- [00:58:45.750]You can see our huge video.
- [00:58:57.490]If we want to make it smaller, we can go in and edit that.
- [00:59:00.670]But that is how you add content and add files and images to your site.
- [00:59:06.070]There's a couple of really quick things I want to touch on.
- [00:59:08.250]And then we will take some questions.
- [00:59:13.690]So we're going to come back in here to Content, back into Welcome.
- [00:59:20.290]So when you're on your site, sometimes you
- [00:59:23.310]might have run into something like this where
- [00:59:25.190]you change the vertical position.
- [00:59:26.570]You can see it.
- [00:59:27.650]Or something isn't just displaying properly.
- [00:59:29.550]This is a good way to clear out the site
- [00:59:33.750]and make sure things are looking right.
- [00:59:35.650]We're going to do flush all caches.
- [00:59:37.650]This takes about--
- [00:59:38.130]about a minute.
- [00:59:41.410]So if you have any questions now, we can answer those.
- [00:59:45.730]See if these questions got answered in the chat.
- [00:59:48.010]All right.
- [00:59:53.850]So CMS documentation, MS WordPress.
- [00:59:55.890]So there's a question.
- [01:00:00.250]How do you add it without the version showing up?
- [01:00:02.930]I add PDFs and always get a version added to the saved
- [01:00:06.550]file.
- [01:00:07.550]OK.
- [01:00:08.010]I will answer that question as soon as this cache is done
- [01:00:12.290]clearing.
- [01:00:12.790]It should be 10 or 15 seconds here.
- [01:00:16.610]So there's a way in your media library
- [01:00:23.710]to replace a file rather than keep re-uploading
- [01:00:27.250]new versions of that file.
- [01:00:29.770]And I will show you that now.
- [01:00:30.970]And that way, it will keep the same URL.
- [01:00:34.270]It will just replace the file.
- [01:00:35.630]And again, once you replace that file,
- [01:00:37.090]you might need to clear the cache.
- [01:00:37.890]So this is something you can see.
- [01:00:40.810]I flushed the cache.
- [01:00:42.270]And now this position changed.
- [01:00:44.050]Looks good.
- [01:00:45.390]So that's just something to keep in mind.
- [01:00:48.650]So to answer Sherry's question, if you click Media,
- [01:00:56.730]to go into the Media Library, come on.
- [01:01:05.750]So say you wanted to change this.
- [01:01:07.770]This PDF, for instance.
- [01:01:10.330]But you don't want to keep adding a new one.
- [01:01:12.510]You can actually come in here to Edit.
- [01:01:14.550]And say there's a new version of this file,
- [01:01:19.950]but I don't want to upload that new version.
- [01:01:22.450]See here, you can actually replace the file.
- [01:01:25.690]So you would edit that file.
- [01:01:27.890]You would choose the new version of that file.
- [01:01:29.970]And then you would make sure this button is checked,
- [01:01:32.230]Overwrite Original File.
- [01:01:35.190]And then you'd save it.
- [01:01:36.150]So it would overwrite the original file.
- [01:01:37.650]With your new PDF.
- [01:01:38.810]And then it wouldn't put -1, -2, -3, -4
- [01:01:42.530]at the end of that URL.
- [01:01:43.730]'Cause in that case,
- [01:01:44.570]you're just uploading new versions of the file.
- [01:01:46.230]And eventually it's gonna get kind of cluttered.
- [01:01:48.530]So if you have a file you're updating
- [01:01:51.490]and you don't want that URL to change,
- [01:01:53.610]this is the best way to do that.
- [01:01:55.270]And once you've done it to make sure that everybody sees it,
- [01:01:57.650]again, I would flush all the caches just to make sure
- [01:02:01.650]that that new version is that one that everybody is seeing.
- [01:02:04.450]There's a couple more things I wanna talk about.
- [01:02:07.530]I wanna touch on really quick
- [01:02:09.210]before we go to more questions.
- [01:02:12.350]So people, if you are in this training,
- [01:02:15.250]you may or may not have access to a site.
- [01:02:17.530]If you click this people tab,
- [01:02:20.870]you can see everybody that has access to a site.
- [01:02:25.350]So if you need to add a new person,
- [01:02:28.490]so these are all the people who have access to this site.
- [01:02:31.790]If you need to add a new person,
- [01:02:37.410]you can search either their name
- [01:02:41.650]or their UNL username here,
- [01:02:44.370]and then it will pull them up and you can import them.
- [01:02:48.190]And when you import them, it adds them to the site.
- [01:02:52.290]Now by default, they are just gonna load like this
- [01:02:54.930]and they're not gonna have a role.
- [01:02:56.250]So you need to give them a role
- [01:02:57.570]once they've been added to the site.
- [01:02:59.790]So these are the three roles
- [01:03:01.730]that you will be able to give people.
- [01:03:02.970]I have a little bit more access,
- [01:03:04.130]so I'm seeing a few more things here.
- [01:03:06.170]So site admin,
- [01:03:07.290]site admin is somebody who can do everything
- [01:03:09.830]that I did today.
- [01:03:11.610]They can add content,
- [01:03:12.870]they can edit content,
- [01:03:14.190]they can even delete content.
- [01:03:16.050]They can add new users,
- [01:03:17.630]they can remove new users,
- [01:03:21.930]and they can even change site configuration.
- [01:03:24.110]So, you know, here in the site configuration,
- [01:03:27.830]let me show you really quick what this is.
- [01:03:31.830]So this is the site configuration.
- [01:03:37.170]Let's go back here.
- [01:03:40.670]So site configuration is the site name,
- [01:03:52.830]the affiliation, and then the front page of the site.
- [01:03:55.930]For some reason,
- [01:03:56.770]if you need to change the front page of the site,
- [01:03:58.910]you can see here, this is the affiliation,
- [01:04:00.790]this is the site title,
- [01:04:02.430]and then this determines what the homepage
- [01:04:06.090]or the front page of that site is.
- [01:04:07.050]Not only what you get when you go to yoursite.unl.edu,
- [01:04:11.430]but if you click the title of the site,
- [01:04:13.150]it will take you back there.
- [01:04:14.550]So a site admin can do all those things.
- [01:04:20.270]An editor is one step down from that,
- [01:04:24.630]and an editor can add new content and edit content.
- [01:04:29.630]They can't delete content,
- [01:04:31.530]they can't add or remove users to the site,
- [01:04:34.730]and they can't do any of that site configuration stuff
- [01:04:36.930]that I showed you.
- [01:04:37.770]So, a viewer is the third role.
- [01:04:41.830]And a viewer is something we like to refer to
- [01:04:46.030]as the approver role, because the viewer,
- [01:04:48.810]the only thing they can do is view content on the site,
- [01:04:53.350]regardless of its published status.
- [01:04:56.730]So what I mean by that is,
- [01:04:58.510]by default, when you create a page,
- [01:05:02.270]it is published on your site.
- [01:05:04.230]That means it's live,
- [01:05:06.810]it's live to anybody who has the URL,
- [01:05:10.210]or anybody can see it if it's in the navigation, obviously.
- [01:05:14.270]So there are other states
- [01:05:16.850]that you can change your pages to,
- [01:05:20.270]including draft, which would be a new version of this page
- [01:05:25.690]that is not yet published, or unpublished,
- [01:05:29.150]which means that you can just kind of work on your page
- [01:05:31.630]in the background.
- [01:05:32.710]So for instance,
- [01:05:36.690]let's say you have a supervisor
- [01:05:39.170]who doesn't want to work on your website at all.
- [01:05:41.690]They just want to be able to look at stuff
- [01:05:43.310]and give you the thumbs up before it goes live.
- [01:05:45.710]So in that case, you would come in
- [01:05:50.750]and you would add content, you know, you'd add your pages,
- [01:05:54.030]and then you would make sure
- [01:06:00.350]that those are saved as unpublished.
- [01:06:03.030]So any page, like maybe your supervisor says,
- [01:06:05.930]"I want you to create
- [01:06:06.570]three pages on blah, and before they go published,
- [01:06:10.830]I want to see them."
- [01:06:12.030]So you'd create those pages, save them as unpublished,
- [01:06:15.170]and then if you give somebody the viewer status,
- [01:06:18.510]they could still view those unpublished pages
- [01:06:21.510]if they were logged into the site, if they had that role.
- [01:06:26.810]So those are the different roles
- [01:06:29.930]that you can give people to the website.
- [01:06:31.930]One more very, very quick thing,
- [01:06:35.490]and then we'll call this good,
- [01:06:36.450]so anything CMS related,
- [01:06:41.450]obviously you're familiar with this site
- [01:06:44.590]if you came to this training today,
- [01:06:46.870]because this is where you sign up for training.
- [01:06:49.470]So CMS, this is everything related to the CMS.
- [01:06:52.450]So obviously you were down here in this first box,
- [01:06:55.410]you attended a training.
- [01:06:56.670]If you have to request a new site,
- [01:06:59.430]that is in the second box.
- [01:07:00.870]If you need to see documentation,
- [01:07:03.970]we link to documentation from the second box.
- [01:07:06.330]If you have a site that you've built
- [01:07:09.810]and you want that site to go public,
- [01:07:11.790]which means, you know,
- [01:07:13.270]pardon me, if you sign up for a new site,
- [01:07:18.590]typically what happens is I will send you a URL
- [01:07:22.670]that's something like cms.unl.edu/your-site-whatever.
- [01:07:27.670]You work on that site, make sure it looks good to go.
- [01:07:34.370]And then you know that you want
- [01:07:36.210]a site called widgets.unl.edu, right?
- [01:07:41.170]So when you want your site to be live at widgets.unl.edu,
- [01:07:46.170]then you'd click this button and fill out that form.
- [01:07:49.770]Now, if you don't have a previous site
- [01:07:52.490]called widgets.unl.edu,
- [01:07:54.030]and you need to request that subdomain,
- [01:07:56.490]that is another form to fill out.
- [01:07:59.710]And then that is reviewed by the governance board,
- [01:08:01.810]and then that is approved or not.
- [01:08:06.090]Kind of all the steps in building a site.
- [01:08:08.410]Now, some of you may have been given access
- [01:08:12.210]to an existing site, in which case you probably now
- [01:08:15.710]know your way around the CMS a little bit better.
- [01:08:18.210]Also, we have a web developer network Slack channel.
- [01:08:24.430]So this is just a discussion channel
- [01:08:27.010]where everybody is chatting
- [01:08:28.470]about the development they're doing,
- [01:08:30.150]any issues that they're running into.
- [01:08:32.890]People ask questions about how they could build something
- [01:08:35.410]or do something,
- [01:08:35.970]or do something in a certain way
- [01:08:36.830]and hopefully get responses in a decent amount of time.
- [01:08:40.130]But there are, you know,
- [01:08:41.110]I think there's 400 people in there now,
- [01:08:43.950]kind of all exchanging ideas.
- [01:08:45.910]If you do not have access
- [01:08:47.630]to the web developer network Slack channel
- [01:08:52.030]and you would like it,
- [01:08:53.510]please just send me an email.
- [01:08:54.750]My name is Aaron Coleman, acoleman@unl.edu.
- [01:08:58.550]And I will make sure you get added to that.
- [01:09:01.030]Okay, we've got a couple of questions
- [01:09:02.630]and now we're at question time.
- [01:09:04.090]So let's answer these questions.
- [01:09:05.850]We haven't made any changes since I started six months ago,
- [01:09:10.270]but I will be handling the site now.
- [01:09:12.530]How do I get signed up as the admin?
- [01:09:14.790]Does my supervisor have to do that?
- [01:09:18.210]So, Jan, Jan or Jan, you could do it either way.
- [01:09:24.510]Whoever, if somebody has access to the site now,
- [01:09:31.930]they could add you, you could message me and I could add
- [01:09:35.730]you.
- [01:09:35.990]It's really just like, you know, if somebody already has
- [01:09:39.530]access to the site, just ask them and ask them to give you
- [01:09:42.390]either editor or site admin access so you can work on that
- [01:09:46.570]site or I can get it for you.
- [01:09:48.670]So we used to be able to add pop-up.
- [01:09:55.530]So the other question is from Jess.
- [01:09:57.690]We used to be able to add pop-up banners at the top of our
- [01:10:01.350]pages.
- [01:10:01.690]Example, health laboratory.
- [01:10:05.610]Currently a temporary transition page.
- [01:10:07.830]Is there a component similar to that in the CMS?
- [01:10:09.950]We like that feature to update patients on inclement weather
- [01:10:13.790]hours.
- [01:10:14.390]We do not have a pop-up banner currently in our current
- [01:10:20.710]components.
- [01:10:21.430]We found that it was being kind of, you know,
- [01:10:27.930]those main usage of those pop-ups is kind of a temporary status.
- [01:10:32.170]And we found that people were just leaving them up.
- [01:10:35.490]Which isn't really a good user experience.
- [01:10:38.630]So we have not added these pop-up components to our site yet.
- [01:10:42.570]There's a couple of different ways you could do that.
- [01:10:46.150]For instance,
- [01:10:48.150]I can show you kind of what passport office says,
- [01:10:53.450]because this is something kind of similar to what you might be wanting to
- [01:10:56.350]do.
- [01:10:56.590]So, you know, passport office.
- [01:10:59.970]So one of the components in the new,
- [01:11:05.370]new system is called a node include where you can basically include another
- [01:11:10.590]page within your page.
- [01:11:11.990]So the passport office,
- [01:11:15.170]they are often closed for holidays and things like that.
- [01:11:17.970]So they, by default, they have this page that looks like this, right?
- [01:11:22.690]So let me show you kind of what this looks like.
- [01:11:26.170]This is kind of a specific to your question.
- [01:11:28.050]It's going to be hard for me to find this, but so this is their front page and
- [01:11:35.250]you can kind of see what that looks like.
- [01:11:36.490]I'm going to go into their content.
- [01:11:38.930]They have the default hours hero, which is what you see by
- [01:11:45.130]default on their front page, right?
- [01:11:46.970]So, and then they have this closure notice hero, which looks like, and let
- [01:11:57.370]me show you really quick here and go back so you can see this is here, so you
- [01:12:05.130]can see default hours hero, right?
- [01:12:07.230]So this is a whole page, but it is actually included at the top of this page.
- [01:12:12.330]So if they have a closure notice, they actually, in their layout
- [01:12:17.490]within here,
- [01:12:25.950]they can actually configure this.
- [01:12:35.010]And you'll see that a note include is just kind of like a link
- [01:12:39.030]where you're referencing another piece of content.
- [01:12:41.410]So they're referencing the default hours hero right now,
- [01:12:44.330]but then they have this closure notice, right?
- [01:12:47.890]So this is a whole separate hero.
- [01:12:49.890]So when they have a closure, they actually come in here
- [01:12:53.510]and then they just start typing closure, right?
- [01:12:58.110]So then they would switch that.
- [01:13:00.490]So I think something like this could work really well for what you're talking about.
- [01:13:04.890]Where you'd have kind of a default hero at the top of the page.
- [01:13:10.270]And then you'd have a closure hero.
- [01:13:12.830]And then you would include that in your main page.
- [01:13:17.250]So what that means is you have three separate pages.
- [01:13:19.590]And two of those pages are really just the top part of the page.
- [01:13:22.710]And you have your main page and you, by default, include one.
- [01:13:27.930]And then when you have a closure or whatever else,
- [01:13:30.350]then you would just switch that and you would save it.
- [01:13:32.910]And it would be, you know,
- [01:13:34.770]closure hero.
- [01:13:35.470]I don't know if that makes sense.
- [01:13:37.270]Hopefully that makes sense.
- [01:13:38.630]But if it doesn't, just drop me a message
- [01:13:41.110]and I can kind of walk through that with you again, Jess.
- [01:13:43.950]But that's kind of what I would suggest for you to,
- [01:13:47.570]for what you're talking about.
- [01:13:49.210]All right.
- [01:13:53.730]A question from Sherry.
- [01:13:54.710]On our page, EHS,
- [01:13:56.210]we have a hero with our director's message to the left.
- [01:13:58.670]Is there a way to make the director's message
- [01:14:00.770]maybe a third of the area it is on
- [01:14:04.650]and the hero a bit larger?
- [01:14:06.130]Let's see.
- [01:14:10.050]There's a few of these things.
- [01:14:16.330]So this is using a component called a,
- [01:14:26.110]I mentioned it before,
- [01:14:27.950]but this is a tandem.
- [01:14:30.710]So there's a couple different ways you could do it.
- [01:14:34.530]You could do a tandem,
- [01:14:35.090]but typically they are split about 50-50.
- [01:14:37.670]So there's not a great way to,
- [01:14:39.530]you couldn't make this so the director's message is less.
- [01:14:49.830]You could come in here
- [01:14:54.010]and you could change kind of how it looks.
- [01:14:55.870]Again, the tandem is kind of what I mentioned before,
- [01:15:02.850]where there's a lot of different looks,
- [01:15:04.410]where you could make this, I think it's called a float.
- [01:15:08.690]And it might give you a slightly different look
- [01:15:12.230]that might be something
- [01:15:13.650]that you feel looks a little bit better.
- [01:15:15.950]See here, I don't know why this isn't working for me.
- [01:15:21.490]So, I don't know why this is not working.
- [01:15:26.490]So something's acting weird for me on this site.
- [01:15:32.230]So for some reason I'm not able
- [01:15:34.290]to edit it, I might have to just clear the cache.
- [01:15:36.710]The short answer, Sherry, is no,
- [01:15:40.350]you can't make that like one third.
- [01:15:42.670]You would just kind of have to mess
- [01:15:44.930]with the tandem component and see if there's maybe one
- [01:15:47.290]of the visual displays that would work
- [01:15:48.850]a little bit better for you.
- [01:15:50.250]Are there any other questions for today?
- [01:16:04.170]All right.
- [01:16:09.370]Like I said, I will share this video a little bit later today.
- [01:16:14.390]I'll send it around to everybody.
- [01:16:16.570]If anybody needs access to the Web Developer Network Slack
- [01:16:20.250]channel, just send me an email.
- [01:16:22.770]Again, acolman@unl.edu.
- [01:16:26.970]OK, let me see.
- [01:16:27.790]I'm going to give this one more last shot
- [01:16:29.110]before we hop out of here.
- [01:16:30.810]So I'm going to edit this.
- [01:16:33.090]Oops.
- [01:16:34.050]Let's go back into Layout.
- [01:16:35.370]And if you wanted to remove this little gap here,
- [01:16:42.330]you configure this and remove the default vertical space.
- [01:16:46.490]Oops.
- [01:16:46.990]Remove the default vertical spacing.
- [01:16:51.810]And that way, that would be right up against the top.
- [01:16:54.810]So we could configure this.
- [01:16:57.490]And this is what I mentioned before when
- [01:17:02.730]I was talking about the cards.
- [01:17:03.930]So we can do all these different things with them.
- [01:17:08.050]So I'm not going to save the changes,
- [01:17:10.450]just because I'm not sure if that's what Sherry wants.
- [01:17:12.850]But so again, this is like a slightly different display
- [01:17:16.670]version.
- [01:17:17.790]You could take this message and center it and float it right
- [01:17:20.490]as well.
- [01:17:21.490]Looks like for this to look good,
- [01:17:24.150]you'd probably want that image crop better,
- [01:17:26.010]because it's covering the end.
- [01:17:27.390]So I'm not even going to save this.
- [01:17:30.830]I'm actually just going to completely back out of here.
- [01:17:33.810]Start my changes.
- [01:17:34.510]Confirm.
- [01:17:40.630]All right.
- [01:17:42.190]So that didn't even remove the topspacing.
- [01:17:44.330]But if you want to remove that, that's just in the section.
- [01:17:48.890]So again, you might have to crop the image different.
- [01:17:51.390]Crop it so the end's on the left.
- [01:17:52.990]But there's a couple different display options within Tandem
- [01:17:55.450]that might work a little bit better or might not.
- [01:17:57.590]So anyway, that's how you would do that.
- [01:18:02.030]Any other final questions?
- [01:18:03.690]Any other questions before we close this for today?
- [01:18:05.850]If not, thank you all for joining this morning
- [01:18:12.930]and please enjoy the Nebraska
- [01:18:14.810]up and down weather this week.
- [01:18:16.910]Thanks a lot.
- [01:18:17.830]Have a good one.
- [01:18:18.670]- Thank you.
- [01:18:19.510]- Thank you.
- [01:18:20.350]- Thank you.
- [01:18:21.190]- Thank you.
- [01:18:22.030]Thank you.
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.
Log in to post comments
Embed
Copy the following code into your page
HTML
<div style="padding-top: 56.25%; overflow: hidden; position:relative; -webkit-box-flex: 1; flex-grow: 1;">
<iframe
style="bottom: 0; left: 0; position: absolute; right: 0; top: 0; border: 0; height: 100%; width: 100%;"
src="https://mediahub.unl.edu/media/24339?format=iframe&autoplay=0"
title="Video Player: UNL CMS Training March 18"
allowfullscreen
></iframe>
</div>
Comments
0 Comments