Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member
Okay so I showed you how you can search for third-party apps and install them like a contact form or your LinkedIn page in the earlier video in this chapter. And then in another video that I just did, I showed how you can create your own app from scratch by becoming a Facebook developer sort of, and filling in a bunch of stuff, and essentially you had to create your own web page and then point to it, as we did to show the sample videos. So if I click this there is my own custom app that I created.
However, that developer page, those steps about entering your canvas URL and all sorts of things, might scare some people off. So I wanted to show you a happy medium between third-party apps and doing your own app, and that is using a third-party app that lets you create an iFrame app. So it's kind of like creating your own iFrame only with somebody to help you along the way. There are still a couple of things that you need to do before you install this app and I'll get to that part in a second. First of all, you still need to have your content ready to pull into the app.
So for example you might want to create a web page, that's either 520 or 810 pixels wide. But what you don't need to do is upload it to your own server, as I've done here. You just need to create the web page. It can be on your Desktop. It needs to use absolute URLs, meaning it can't just say something is inside of a folder. You have to always start every link with HTTP inside it. Let's look at the source, so you know what I'm talking about. So you have to use URLs like this, full URLs, also known as absolute URLs.
Then what you're going to do is essentially just Copy all of this mark up to the clipboard and you're going to Paste it into the app that you'll install and they will serve it for you. However, if you're linking to any images, if you have anything in here that is not being served at a secure server, you're going to have to take care of that. As I mentioned in the previous video, anything that you put in an app has to be available from a secured server. Meaning it has to be available if you are surfing with HTTPS turned on in Facebook.
While third-party iFrame apps do host the text content, they don't host the actual images that you might be linking to. Those have to be elsewhere and those have to be in a secure site. So I mentioned earlier that you might want to set up an account on a shared host that has secured hosting available, like DreamHost.com is what I use. It's not free usually, it does cost some money. Here you see it costs $15 a year for SSL Secure Certificate, which is what you need, but it also requires a unique IP address, which normally doesn't come with most shared hosting plans.
And that cost is right here; it's $4 a month. I've heard that Dropbox, which is a wonderful free utility, also comes in a paid version. In their public folder, which is kind of like a public access FTP folder, that's secure, and that you could put your images in there if you needed to. But I'm going to leave that up to you to figure out and we can discuss other solutions on the Social Media Marketing Facebook page. But let's say you have everything set up. Your next step is to download and install one of these iFrame hosting apps.
So let's install this on our Bliss No.5 site. I'm going to jump back over here to Chrome. What you need to do is Search in this field for the app. Now the one that I recommend is called Static HTML:iFrame tabs. You can see there's a whole bunch that sound somewhat alike, but the one that I like is this one, Static HTML iFrame. Look at how many users it has, 67 million users; it can't be wrong. Let's click there and it says it makes it simple to create powerful custom iFrame tabs.
They are the largest provider of custom tabs on Facebook. So you click this button to add it to your page and then after you add it, go to your page and click on the Welcome Tab to start editing. It's written by these two guys, very nice guys. They also have their own Facebook page. I'm going to right click here and open that in a New Tab, so we can save that for later. But let's go ahead and add this to our page. Where do you want to add it? We want to add it to this one right here, add that app. Now you see this changed to a 1, and there it is down there.
It's possible with this app to create Fan-only content. What that means is if somebody comes to your page and they go to the app that you're creating right now. If they Like your page, if they are a fan, they would see this content. If they're just visiting, they would see that content. And so this content might be, hey Like our page and we'll love you so much. This one might be, Welcome to the page. Here is what's new. That's pretty cool that you can do that. But I'm going to come back up here and choose Preview. So apparently, we have a problem with the link here.
It's probably not an absolute URL; it's probably a relative URL. I'll go back and it's telling us that we do have an error. You have some relative URLs in your code. You'll need to change them to absolute URLs and it is that one, lynda-logo-on-blk.gif. But once you have that fixed, you're able to save your changes and Publish. If you click on the FAQ in the Help center, they answer a whole ton of questions. One thing that people ask a lot is, are you able to change this icon? And yes, you can, and they show you how to do it.
Are you able to do more than one page? Yes, you can. I think you're able to create up to 12 different apps using that one install. On their Facebook page, that's pretty cool, they have a 166,000 Likes and they're very active on the page with support and new features. Whether or not you change this icon for your custom page, remember, you can always use this Pencil thing to Switch Position. So maybe I want it in the top row and close that up. And as I said you can populate each of these, the photos one has to stay here, but each of these can be populated with a custom app, and if you use a third-party program like Static HTML iFrames, it's much easier to do.
Get unlimited access to all courses for just $25/month.Become a member
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.
Your file was successfully uploaded.