In this video, we're gonna be adding a Facebook widget
to our WordPress website.
It's basically just a little thing that shows off your page
and your number of likes,
In fact, it looks just like this.
There you go, it's one of those,
and I will show you how you can add that
to your WordPress site in this video,
so let's get started.
(gentle music)
Hello, it's Alex here from WPEagle, thanks for dropping by.
As I said, in this video we're gonna be adding
a Facebook widget to our WordPress website.
You can basically add one of these anywhere.
You can put them inside a page,
you can put them in a side bar, in a footer,
wherever you like, really.
Wherever you can paste some code, that's fine.
Anyway, I'm gonna take you through it step by step.
So let's get on the computer and get going.
Okay so I'm over on the website that I'm gonna be adding the
Facebook page widget to.
It's this particular page, in fact, the About Us.
I just wanna add it over here.
It's quite a straightforward process.
What we're gonna do is head over to Facebook,
get a bit of code, and basically copy and paste it.
The page you want to go to, I'm just gonna go to Google
and type in "Facebook page widget" and press Enter,
and the first one comes up, it says Page Plugin thingy,
which is what we want.
We want one of these things.
You just gotta fill in some things on here.
You gotta find your Facebook URL,
which you can find
by going onto Facebook and looking at your page,
and type it in.
I know what this one is.
I think it's that one.
Nope, it's that one.
Let's have a look. There we go.
Here is the tabs. Normally Timeline is just fine.
Kinda just shows some of your posts.
If you don't want Timeline,
then just simply remove that out like that.
Then you just get a, let me show you,
just get that sort of thing.
But I think it's nice to have a couple of
posts coming up. Why not?
You can add other things if you want, just add commas.
Events, that sort of thing.
You see you get these kinda tabs, then.
I'm just gonna leave it as Timeline for now.
You can set a width and a height.
I'm just gonna leave that for now and hopefully
it'll just fill the space as it should.
You can reduce the size of the header down if you want,
make that a little bit smaller.
I'll leave it big. It's nice.
You can get rid of it completely, if you want.
Get rid of the cover photo, anyway.
Leave that to adapt, and you can show your friends' faces,
which, we'll not be able to see your friends,
they'll be whoever's looking at your page's friends.
That's quite nice, too.
So once you're done, you go down here and click Get Code.
Rather than this sort of stuff,
which is a little bit more complicated,
we're just gonna go through the iFrame.
So click over here, iFrame,
and then click on this thing here,
and I'm just gonna copy that to my clipboard
with a Control + C, Command + C on a Mac,
which I'm on, so I did a Command + C,
but Control + C on a PC.
You get what I'm saying.
Go back to your page.
Let's click Edit with Cornerstone.
Now I'm using X Theme, which has got a page builder,
visual editor type thing,
but you basically just wanna paste that code
wherever you want it on your site.
Could be into a Widget. A text Widget, for example.
Or you might put it just in the main body of your page,
maybe in a column.
I'm gonna put it down here.
With this page builder,
and your theme may have a page builder, too,
maybe a visual editor, whatever.
I'm just gonna put a text thing in here, like that.
Using the text editor here,
so again, if you're on a page,
make sure that you're in the text and not visual.
Paste that in.
There it is.
Looks a little bit squashed,
but we'll see what it looks like actually when we
come out of this preview.
This also needs a little bit of space.
On my page builder, I've got a gap thing.
Again, it depends on your theme, really.
I'm gonna put that in like that.
Let's click Save.
Let's view the page.
There it is. Now, it is a bit cut off,
so I think I'm gonna have to set a width, which is fine.
Let me just see how wide things are here.
Let me see how wide that image is and we'll go with that.
Two five five, so that's fine.
We get back to the page on Facebook,
go up here again, and we have to put a width in of two...
Hopefully there isn't, the minimal one's 80, so that's fine.
Two five five.
Come down again.
Click Get Code, get the iFrame.
You're gonna have to just adjust width and height
if you need to, if it doesn't look quite right on your page.
Let's quickly edit that again.
For some reason, I can't select it.
I can get around this by going into this editor.
It's just this visual editor thing in X Theme.
It probably won't be a problem for you.
Let's get rid of that iFrame and put the new one in.
Click Save.
Click View Page.
There it is. I think it could be slightly wider.
Let me just see how wide it needs to be,
cause it's gone over to the left
and it doesn't look quite right.
You're just gonna have to play around with it yourself,
in terms of getting your Widget looking right.
It can be a little bit temperamental.
I'm just doing this so I can see how wide it needs to be.
There we go.
It's whenever it stops getting wider.
It looks like it's 290.
Let's go back again, one more time.
Just add 290.
There we go.
Then get the code one more time.
Back and forth, forward... wait.
Close that. Edit with Cornerstone.
Okay, there we go.
I'm sure it's gonna be fine now. Let's have a look.
There we go. So that concludes this video.
Hope you found it useful.
If you've got any questions, please leave them below.
I'll do my best to help you out.
If you like what I'm doing, please click the Like button
and subscribe for more videos.
Until next time, it's bye for now.
Best Education Page #Online Earning
online earning,make money online, earn money online, online earning, online earning sites,
make money online free, online money income, earn money online free, money online, best way to earn money online, online income site, money earning websites, best online earning sites, easiest way to earn money online, earn money payment bkash, online money income site
Posts
No comments:
Post a Comment