Original subtitles

All right.

So right now, let's go ahead and carry on with the rest of the changes.

Now we're going to use ChatGPT to write content for us in this way.

Now, over here, we have our mission statement.

I'm going to go ahead to ChatGPT and I'm going to say.

We are an agency or a news blog, and I want you to write a mission statement to impress our readers.

So it's going to go ahead and write down a mission statement.

And I'm just going to copy that mission statement.

Hopefully, it doesn't make it big.

All right.

So this one is pretty cool.

So I'm going to go back to my elementor here and I want you to just click here, click on this text.

It's Alarme ipsum text.

So we're going to we're going to replace that by real text.

And over here, instead of our Explore the World, we're going to say our mission statement and I'm

going to go and fetch an image kind of like that looks kind of like this.

Now let's go to Canva here.

And first off, I'm going to click on this section and I want to know exactly what is the size of this

image.

So I'm going to go to style here on the section to see kind of like what the image that they have used

is over here.

It doesn't really appear So I'm going to click here, click on the section again, and let me go to

style.

Okay, So this is the image.

Now, this image is a 1920 pixels by 800 pixels.

So what I'm going to do here is I'm going to go and I'm going to open up a new canva.

So it's 1000 and 920 by 800 pixels.

Now I'm going to go ahead and find something like that.

So I already have my images up here.

You can see that this is the image.

But I need to add a reporter here on the right hand side as well, or on the left hand side.

I'm going to go ahead and remove this image first.

Come back over here, remove this image, and then let me search for news, the topic of news.

So let me just come back over here.

Let's click.

So we have a lot of images up here, but let me just search for it again.

And over here, I want to find something pretty cool.

So let's go down.

All right.

So this is the image and I'm going to set this up as a background image.

And what I'm going to do is I'm going to up this a little bit like this.

And I want to go ahead and look for a person.

So this person I'm not going to make it like this.

I'm going to make it into an animation.

So what I'm going to do, I'm going to download this image as is, and later on we're going to add another

image and I'm going to try to do that.

So I'm going to download this and let me go back to Elementor Up here, click on upload files.

The image was downloaded.

I can see it there.

And so here I'm just going to paste it.

Okay.

So let me wait, wait, wait, wait, wait.

All right.

So there you go.

That's our image.

So I want to take that and simply insert it, insert that media into that.

No longer images, take a little bit of time to curate or to for treatment.

So I'm going to click insert and over here, just don't do anything because normally, normally you'd

have to go to position and attachment, but because we have imported it ready to go website, everything

is set up for us now over here we need to add something.

So I'm going to go and try something crazy.

So I'm really hoping this will work.

So what I'm going to do is I'm going to go ahead and just add.

An image down here.

Right.

So I'm going to go for image, add it down here.

And in that image I'm going to add a person.

So I'm going to go to Canva here and I'm going to resize this kind of like to a 512 by 512.

I don't need the image of the person to be that big actually.

Now maybe the height needs to be bigger and so I'm just going to keep that height 512 by 800.

Let me see what that will get us.

I'm pretty sure we're going to get a pretty good result.

So and I'm going to go ahead and search for this particular reporter and we'll definitely use Dall E

two because we need to complete his body.

But first off, let's just try and find something.

So here.

Reporter Right.

Reporter Now we have a bunch of reporters up here now, right?

So we have this guy and if we scroll down, we have this guy, right?

This guy.

So I think I think we're just going to add this guy up here and I'm just going to edit his image background

remover, and I want to flip his image for his hand to point in the right hand side where we have our

text, the mission statement, and let me show you what I'm going to do.

This is going to be fun, trust me.

So the background is still getting removed.

Let me just wait until it's removed.

All right.

So background was removed.

But the problem is still this shows up in here.

So what I'm going to do, I'm going to crop him just a little bit like that and that will be it.

And so I'm going to click on my image Flip.

Flip horizontally and crop some more.

And over here I'm going the crop.

Now the hand does not show.

So the hand is also.

The hand was also taken out.

So what I'm going to do, I'm going to crop it as well.

I have no choice and I'm going to make this image bigger.

Like this.

And let me show you the power of artificial intelligence.

So I'm going to download this image as it is with a transparent background, and we'll go to chat to

not chat GPT, but to Dall E two, which is chat GPT.

Other.

The other product of OpenAI, including ChatGPT.

So here, let's search for Dall e two.

Or Dolly.

Dolly two is the newest version of Dolly.

Here is.

Video of an elephant.

Now, over here, let me just go to open.

Click on Try Dali.

And right here, let me show you what we're going to do.

Magic.

So let me upload my image and we're just going to complete that image now.

Downloads.

This is the image.

Click add and now skip cropping.

And I want to take this frame.

I'm going to put it right here.

And I'm going to say journalist.

Generate.

And so right now, what it's going to do, it's going going to go ahead and complete the stuff that's

missing from this image by using artificial intelligence so that we can have our guy in a way that looks

kind of similar to this person or in a way similar to kind of how we completed this person's profile.

And so because we want our guy to be a complete human being standing in here and pointing in the direction

of the mission statement, that's how we care or how much we care about the website design.

So over here it generated four propositions.

I'm going to go with the first one because I think the first one is pretty cool.

I'm going to accept it and I'm going to expand more by adding another generation frame up here.

And click generate once more because I want to get the full view of the person.

I want to get his entire body.

That way we have a perfect website.

People will go to the website and they'll be impressed.

Now many people have great design skills but are lazy with these details and I advise you not to be.

So here we have some images.

I think this one here would do well.

I'm going to accept, but right now I'm going to go ahead and download this and I'm going to take it

here.

All right.

I'm going to go back here.

I'm just going to delete this image.

I'm going to go to uploads, upload files, and then I'm just going to upload this recently created

image with artificial intelligence and you guess what I'm going to do to it.

You know exactly what I'm going to do to it.

I'm just going to remove the background off of it.

And first of all here, let's crop this part here.

Okay to make it simpler.

And let me just click edit the image background remover.

So right now we have an entire journalist standing up there.

So we started off from an image that looked nothing like what we have right now.

But with artificial intelligence, we can really achieve impressive results.

Now over here you can see that we have this camera kind of bothering the view.

So I'm going to crop that.

Now, the problem is that the camera is actually, you know, bothering us really now.

But I think if we keep the camera, it wouldn't really look so bad.

Let me just see mean I can remove the camera if I want to, but if we just keep it, it's not really

going to be that bad.

So I'm just going to keep the camera up there.

I'm just going to make my image bigger.

To fill the space.

And I'm going to download this image right now with a transparent background.

And let's go ahead and do some magic.

First of all, let's close these windows.

Let me go back over here.

And on this image, I'm going to upload upload files, select files, and there we go.

Let's do the magic.

So here we have our image.

Perfectly created insert.

And so right now we have our guy.

But let's just take our guy to the top.

Now, I'm going to, first of all, go to content here and I'm going to make the image medium because

I want to make it smaller.

Maybe let's try with Medium here.

All right.

So this one is pretty good.

And I'm going to go ahead to advanced here.

And the margin side, the top, it should be -350.

And in the left hand side, we're going to make it -350 as well.

Now, that's not so much.

Let's make it -800.

And you can see that this is pretty good.

Now, the only issue is that the image is really small.

So maybe if we get it back to its original size, this will look pretty neat.

So right now we have this except for the fact that the button now looks a little distanced.

So I'm going to move it right here.

And you can see the magic happened.

Now, this is pretty cool, isn't it?

So if I update right now, this will look pretty awesome and I'm going to click on my section here and

I'm going to go to Advanced.

Now, over here in the padding, I'm just going to make it 50 by 50.

And let's try it this way and see what this will give us.

50 by 50.

Right.

So I think that this kind of padding is pretty good and update.

So right now, we have created a pretty good pretty good stuff here.

Right.

And I think this is pretty awesome.

This is going to impress our readers.

Now, over here, if you notice, if I go to my other website, this is a little bit different here.

We have an about us.

Now, I'm just going to copy this text because there's no reason for me to go back and ask ChatGPT to

create it for me.

And over here I can delete these images.

I don't need them.

I'm just going to keep one image.

So I'm going to delete this this column over here, delete and delete this column here as well.

Or this image.

Right?

Delete this image and I'm going to keep one image.

I'm going to come in here and instead of this Lorem ipsum not useful text, I will add my text and over

here I need to add the about us copy.

And over here I'm going to add it.

So I'm just going to come in here, add that and right here I need to add a different image.

Now.

This time I'm thinking of a mic.

But first off, let's go and get the background image for the entire section.

So let me go to Canva here, close this window and let me go back to Elementor.

Now, I want to check up here.

I want to check the size of.

This background.

Now let's just try to use the same size of the previous image.

1800.

By how much?

By 900 or something.

So let's just check.

Now, this is 1200.

Let's resize this to 1900 by, let's say 630 or 700 maybe, and copy and resize.

And so let's go now and add an image that has something to do with photography.

Okay?

So we need something to do with photography with the camera, kind of like showing the camera there.

And so I'm going to go to elements here and let me search for news.

Filming, Right?

So here, let's just try to find something interesting here.

Photos.

Let me go and try to find something here.

Okay.

So we have some images, but not really.

Not really what we want.

So let me try the keyword news photo to see what we're going to get.

Right.

No, nothing.

Now let's try photography.

And hopefully we can find some pretty good images there.

Photography, photography, photography.

Right.

No image kind of impressed me here.

Let me just go ahead and.

Right.

Maybe this one here, but this one is not.

I mean, we can add a layer of blue to it.

So I'm going to set these as background and later on I'm going to add a layer of blue.

So let's just download this kind of like it.

And over here I'm going to scroll down, I'm going to click on my section up here, I'm going to go

to Style and I'm going to go over here to classic click image.

Let's upload an image from background and let's give it an overlay of with a shade of blue to kind of

make it flow with the flow of the website.

So that's not really big deal.

Let's just insert media.

It's going to be a little darker, but I'm going to make it a little bluer.

Now, like I said before, it takes a little bit of time.

All right, So that's added.

And let me scroll down over here to the background overlay.

And there is no background overlay here, so we're going to add one.

So here instead of this black color, we're going to add a dark blue color kind of like this.

We have one more issue here.

This text is black, so we're going to make it white.

I'm going to check here, make it white, and I'm going to make this text as well.

White.

Right.

And so here when it comes to this image, I'm going to go and find an image this time that should be

512 by 512, and it should be an image of a mic floating.

So here.

512 by five.

12.

And let me just copy and resize this.

Let me go and look for a mic.

And it should be similar to this mic over here.

Write about us.

Everything should be perfect.

I've been doing web design for a long time, and I know that you need to really, really bring your

A game if you want to create impressive websites that people will stay on and read the content over

here.

Let's look for Mike.

Mike.

Mike.

Mike.

Not Mike Tyson, actually, just Mike.

Mike with a hand.

So let's just add a keyword of Mike with a hand.

And we have these, right?

So we have this one.

This one right.

We have a couple of ones over here.

So I'm thinking I'm thinking let's just try to find something.

Pretty cool.

Here we have this one, so I'm just going to go back.

I saw an image that I liked, so I'm just going to go back to it.

I think that will do well and right.

So this is the image and I'm just going to set this up as my background image.

Now, unfortunately, this couldn't be really set as good background, so I'm just going to detach it

and I'm just going to make it a little bit bigger, kind of like this.

Rotate it a bit, kind of like this, and then make it a little bit bigger.

Move the hand just like this.

Make sure that the hand doesn't really appear.

Or the missing part of the hand appears neat.

And so I think this is cool.

Maybe we can add a little bit of contrast.

So I'm going to go for a little bit of contrast here and download this image.

Okay.

So perfect.

Make sure to download it as a transparent background.

And if you don't have Canva Pro, go ahead and use the website.

I've shown you remove.bg and take the background off of it.

So I'm going to click my image over here and I'm going to go here and change this image from this image

to my lovely image.

So over here we have our image.

It's downloaded, Let's add that and we're going to make it.

Pretty cool here.

So if I go here, you can see that my image there is a difference here.

I don't want that difference.

I want my image to kind of look attached to the screen.

So I'm going to go to Advanced over here and I'm going to go to margin.

And on the left hand side, I'm going to add a positive margin of maybe 50.

Well, still.

Still.

So let's just try to add negative margin doesn't really solve the problem.

Now let's add a right margin margin of minus maybe 20.

All right.

So this actually solved the issue.

So when you add the minus margin, that kind of solves the issue.

So right now, we have our image.

We have our about us.

So right now, we have designed our entire home page.

It's pretty good.

So what we're going to do right now is we're going to go ahead and optimize our image for mobile.

So in order to optimize your home page for mobile, you have to click here responsive mode and click

on tablet.

So there is tablet view.

Now tablet, tablet view always be good.

There's not going to be something bad going with the tablet view.

And so for the mobile view is where we're going to do most of the work.

So I'm going to click the mobile view and let me go ahead and optimize this for mobile.

Mainly we're just going to be editing this stuff, so let's go ahead and just improve.

Right.

So Mobile View, this title is pretty huge, so let's click on it.

And let's just make it a little less.

Now, when you change the size of it for mobile, it doesn't affect how it looks on desktop.

So here I'm going to make it 30, for instance.

And I'm going to click this image right here.

Now, unfortunately, here the image is pretty big.

So I'm going to perhaps at the top make it a minus.

200 or.

No.

-200 didn't do it.

Now, the problem here.

All right, So I made a mistake.

So I'm going to go back a little bit and I'm going to click my image here and to make sure that I'm

uncheck the values of here.

And so this guy right now, we have to change everything.

So -200.

And over here at the left hand side, -150.

Or -50 or something.

All right, so let's try with -250.

All right.

So I think I think we should just keep him at the bottom here because there's no real reason why he

should be up there.

And besides, we've tried and it didn't really work.

Now, over here, we can hide these columns, but there's no point.

The newsletter kind of looks a little bit small, but I feel like it's.

It's pretty good.

It's not really.

It's not really bad.

Here, this one needs to go down a little bit, so I'm going to click on it and go to typography here

and the size, I'm going to make it 30.

And I'm going to click on it here and go to Advanced.

I'm going to add a little bit of a padding to it.

Now 225 padding should do it.

And if I scroll down, this looks pretty cool.

There's no reason for us to change that.

But in this case, over here, we have a pretty unfortunate thing.

And so I'm just going to go click the image here and I'm going to go to Advanced Responsive, and I'm

going to hide it from Mobile right now.

When we hide it from mobile, that kind of changes stuff.

So here if I click on my column.

Right.

So I need to click the column here.

So click.

The problem here is that I can't quite click it right, so I can click it here now.

Here if I go to style.

Layout.

The vertical align is, let's say the middle.

Let's keep it to default.

Or maybe we can just keep it as it is because we don't want to crash the website here or the about us

looks pretty cool.

This one also looks pretty cool.

And so I think this is all for mobile optimization.

We've done the best that we could.

And so if a tablet, it looks pretty good.

Right.

Let's see how it looks for desktop here.

And so we've quite optimized this for mobile.

Now what we're going to do is we're going to add some more responsiveness.