Hello, in this ionic video we are going to cover photos. Photos are basically just a small region at the bottom of the bottom of the screen. That's actually the opposite of a header header, the top for truth, the bottom very basic stuff. And for styling it, you can use the exact same classes that you use for a header. So they are right here and they'll be available in the source code. So to add a footer to do do Actually, you know what?

For I even do any of this, I'm going to run the application so similarly looks like we have just the headline is so bad, and then show you what it looks like with a footer added. Okay, okay, so this is loading up. I wish you would load faster. I really do. Oh, They're so loaded up now. Almost done.

Come on. Second now. Here we go. Okay, so we've got our header, our sub header. So now let's add a footer to do that you do a div. Inside the Dave actually, first of all, you add some classes, it's gonna be bar, four dash footer for the footer.

That's the only difference really, you put a footer there instead of header. And now we're going to put bar dash, whatever style we want to use. So I'm going to use oil. So royal and inside, you just put div class equals title. And I'm going to save that and build this on. Snow Boyd build iOS So let's just wait for this to build our project which is essentially just copied or it does all the stuff, we just copied it to the V folder.

Okay, so as we run our application as you can see, we have a footer at the bottom. Now, another cool thing I want to show you is if for example, I've got this footer, and I add a button, we haven't covered buttons yet, I will be covering that in a separate video. So this is an an explanation of the buttons here has component items quickly with fruit code in there sometimes gonna code up a button so bear with me, bear with me, and you'll see something really, really cool that the footer component does in ionic which is fantastic. Now it's gonna call this left, save that and now compile it. Now rerun the application. And see we've got our button.

But it's actually on the left, he is actually anchored to the left is not next to me or anything. And let me show you what happened if I were to put a nonverbal turn after it, I think as you can imagine, it puts it to the right which is a great way of creating your UI without having to do well extra code to style it so you can see what our title, we've got the button on the left and the right and as I said, we're going to cover button buttons from ionic, in more depth in a separate video. So check that out and You'll be able to see how to create a variety of buttons styles. One thing to note is if, for example, I delete all this code, I only have a button here. So if I save, I'm going to leave the text as it is for build this rerun the application.

So as you can see the button on the left but what if we wanted the button on the right without having a title inside the footer. To do that, you just simply add a class of poll, right? And now build it. We run our application as you can see, it's now anchored to the Robert fantastic. Four I want to do is just leave it like so so you can easily modify it. If you have any questions, feel free to post them.

Yeah, I mean, feel free to up. I sort of said it and then at the same time anyway, feel free to post them it familiar. Feel free to post them on our education platform sonar learning Dakota, UK, there'll be a link in the description to that. There also be a link in the description to our GitHub page, which has all the source code from this series. If you liked this video, please do the thumbs up hit that subscribe button and leave a comment. And as usual, thank you fortune and I hope you have a great day.