Blog

Publishing Blend4Web Applications on Facebook

2017-03-07

Facebook is a popular social network that unites dozens of countries and millions of users all around the world. Of course, we simply cannot walk past it without explaining how to publish Blend4Web apps on its pages. So have patience and prepare to absorb a lot of useful information.

The Most Simple Case

Every Facebook user knows that there is a news feed where you can publish messages, photos, videos, links… but, sadly, no applications. This is understandable, as allowing users to publish their own application can lead to numerous security breaches. So all third-party programs are moved outside of the news feed.

You are probably thinking that I will now go on buzzing about getting developer account… and you are right, but not this time. First, I will explain how you can manage without a developer account and how to use features that Facebook offers to a common user.

The social network allows us to create so-called pages. These pages are a rather popular solution for providing company info, creating various communities, personal portfolios and many other things. Pages are, in essence, the keystone of the Facebook universe. And these pages have their own tools which you can use to make them more attractive and easy to use.

The simplest way to add your application to a page is to write a post with a link to it. But after a while the post will move down and disappear into the abyss.

The second way is to add a button that will always be present above the page’s header. This looks much more interesting, so let’s take a look on how it can be done.

Facebook has various page styles, and I will assume that you are using the default option. If this is not the case, some elements we will need might be located differently.

To add a custom button, you have to press the Add Button button that can be found right below the header of the page.

Figure 1

Press it, and you will see a large menu with numerous templates for your button. You can, for example, select the Download App or Game option and Play Game sub-option. Then, the next window will appear, and there you will need to set the address of a web page that you need.

Figure 2

This solution is perfect when you want to invite a user to a specific web page, the home page of your company, for example. But if you want to remain in the social network and play your application within it, then you will have to work much harder that this.

Facebook does have methods of publishing and distributing in-built applications. You most likely already encountered some of them. If you like a game or any other application you have found on Facebook, you can add it to your account and make a link to it in the so called tabs. The number of these tabs is not limited, and they look attractive. Tabs are usually located at the back sides of a page and remain in the field of view when the page is scrolled.

We need to use Iframe to embed an application to the Facebook environment. What is it and how to work with is is described in my previous article. There is only one requirement: the page address should start with the https.

The HTTPS protocol is an extension of the regular HTTP, and it is used to tighten up security by encrypting your connection. To use it, you first have to acquire an SSL certificate. How you can get this certificate and how to add it to your web site is described here.

And so your application is fully prepared for publishing. An SSL certificate is set, and you are ready to conquer Facebook. There are two ways of doing so: you can get yourself a developer account, ot you can use a third-party application. Let’s start with the latter.

Using Third-Party Software

The social network includes tens of thousands various programs, and among them are some that can be used to alter the appearance of user’s pages. You don’t need to be a Facebook developer to do this, all you have to do is install and configure a helper program. Let’s take a look at one such program.

Open your Facebook account and search for the Static HTML: iframe tabs application. The easiest way to do it is to use the main search tool on your main page.

Figure 3

Press the Use Now button. Doing this will open the application page, where you will have to confirm your intent to install the program. Then you will need to select a page to which a new tab will be added.

Figure 4

After this, a new entry called Welcome will be added to the tab menu on your page. Follow this link, and you will encounter a singular button titled Set up Tab.

Figure 5

The most important part starts here. Press the Embed your website button and enter Iframe code with the link to your application. Then press the Save&Publish button.

You will also need to edit the name of the tab and to change its icon. This can be done by selecting a specific entry from the Action menu.

Figure 6

I Am My Own’s Master

But if for some reason you don’t like working with third-party software, then it is the time to talk about personal developer account.

You will have to undergo a simple registration procedure to be able to publish your applications in the Facebook environment. Just open the social network and follow this link. I will not describe the registration itself, as it is very self-explanatory and will only take mere minutes.

So, first you will need to initialize your application by pressing the Add a New App button and filling the parameter fields.

Figure 7

Then, the window for setting a new application will open. Select the Settings entry, then Basic, and then press the Add Platform button.

Facebook offers you a number of options to publish an app in its environment. We only need one of them, the Page Tab option that allows us to create a most basic application form and attach it to a tab on a page.

Figure 8

Remember that you have to set a path to the application page without any iframe elements in the Page Tab form settings.

Figure 9

You can enable publishing in the App Review window that can be open by pressing the eponymous button in the application settings. But don’t count on the program appearing on your page on its own. This you will have to do yourself.

The developers of Facebook are known for their curiosity and will to always change everything, even on the working version of the system. So let me tell you about one inside method of creating tabs that doesn’t require any frills with the interface.

To do this, you will need an Id number of the program (App ID) and your “Secure Page Tab URL” (fig. 9).

Type this to the browser’s address field:

http://www.facebook.com/dialog/pagetab?app_id=APP_ID&next=YOUR_URL

Here, APP_ID is the program’s ID-number, and YOUR_URL is it’s web address.

A window like one on the Figure 4 will appear. Confirm your request, and the application will be added to the tab list.

On my page you can find out how it will look.

Comments
27 nov. 2023 12:26
We take care of the whole process of app development: from Planning to launch - mobile development and consulting
04 jan. 2024 16:20
Reply to post of user rmqumbra
Let us handle the whole process of app development: from business analysis to launch - mobile development and consulting


Wow, this is an insightful guide on publishing Blend4Web applications on Facebook! The step-by-step instructions make the process seem so straightforward. It's great to see how Blend4Web can seamlessly integrate with one of the biggest social media platforms
. Kudos to the author for breaking down the technicalities and providing clear explanations. I can't wait to try this out and share my Blend4Web creations with friends and followers on Facebook. This tutorial is a game-changer for anyone looking to showcase their interactive 3D content on a broader platform. Thanks for sharing this valuable information!
22 feb. 2024 11:00
在选择英文Essay代写 http://www.proessay.cn/our_service1.php 机构的时候,可以适当的挑选超出自己水平的,但是最好不要过高,否则就很容易被查。
07 mar. 2024 00:27
Thanks!
31 aug. 2024 12:04
Business loans and cash credit are essential financial tools for businesses seeking to manage their cash flow and fund growth. A business loan provides a lump sum of money for specific purposes like expansion, equipment purchase, or working capital needs. Cash credit, on the other hand, is a revolving credit facility that allows businesses to withdraw funds as needed up to a specified limit, helping them manage short-term liquidity issues. Both options offer flexibility, but it's important for businesses to assess their financial needs and repayment capacity before opting for either. https://wealthbuilders365.com/
31 aug. 2024 13:37
Publishing Blend4Web applications on Facebook is a great way to reach a wider audience and engage users in an interactive experience. It's exciting to see how this platform can enhance the visibility and accessibility of web applications, making them more enjoyable and shareable! Digitizer Embroidery
01 sep. 2024 09:52
<a href=" https://game888b.org/">888b</a> là casino online hàng đầu về cá cược, nổi bật với nhiều trò chơi đa dạng như cá cược thể thao, casino trực tuyến, và các trò chơi giải trí khác. Với giao diện thân thiện, bảo mật cao và dịch vụ khách hàng chuyên nghiệp, 888b mang đến trải nghiệm cá cược tuyệt vời và uy tín cho người chơi.
Thông tin chi tiết:
Website: <a href="https://game888b.org/">https://game888b.org/</a>
Địa chỉ: 16c P. Cổng Đục, Hàng Bồ, Hoàn Kiếm, Hà Nội, Việt Nam
Email: bet888b.com@gmail.com
Phone: 0987770128
#888b, #nha_cai_888b, #casino_888b
<a href="https://x.com/bet888bcom2">https://x.com/bet888bcom2</a>
<a href="https://vimeo.com/bet888bcom2">https://vimeo.com/bet888bcom2</a>
<a href="https://www.pinterest.com/bet888bcom2/">https://www.pinterest.com/bet888bcom2/</a>
<a href="https://www.tumblr.com/bet888bcom2">https://www.tumblr.com/bet888bcom2</a>
<a href="https://www.facebook.com/bet888bcom2/">https://www.facebook.com/bet888bcom2/</a>
<a href="https://www.twitch.tv/bet888bcom2/about">https://www.twitch.tv/bet888bcom2/about</a>
<a href="https://www.reddit.com/user/bet888bcom2/">https://www.reddit.com/user/bet888bcom2/</a>
<a href="https://circleten.org/a/309592?postTypeId=whatsNew">https://circleten.org/a/309592?postTypeId=whatsNew</a>
<a href="https://my.archdaily.com/us/@888b-casino-online-hang-dau-ve-ca-cuoc">https://my.archdaily.com/us/@888b-casino-online-hang-dau-ve-ca-cuoc</a>
<a href="https://roomstyler.com/users/bet888bcom2">https://roomstyler.com/users/bet888bcom2</a>
<a href="https://www.myminifactory.com/users/bet888bcom2">https://www.myminifactory.com/users/bet888bcom2</a>
<a href="https://www.speedrun.com/users/bet888bcom2">https://www.speedrun.com/users/bet888bcom2</a>
<a href="https://www.metooo.io/u/bet888bcom2">https://www.metooo.io/u/bet888bcom2</a>
<a href="https://www.deviantart.com/bet888bcom2">https://www.deviantart.com/bet888bcom2</a>
<a href="https://www.intensedebate.com/people/bet888bcom2">https://www.intensedebate.com/people/bet888bcom2</a>
<a href="https://coub.com/bet888bcom2">https://coub.com/bet888bcom2</a>
<a href="https://www.metooo.es/u/bet888bcom2">https://www.metooo.es/u/bet888bcom2</a>
<a href="https://www.zubersoft.com/mobilesheets/forum/user-44421.html">https://www.zubersoft.com/mobilesheets/forum/user-44421.html</a>
<a href="https://youbiz.com/profile/bet888bcom2/">https://youbiz.com/profile/bet888bcom2/</a>
<a href="https://portal.myskeet.com/forums/users/bet888bcom2/">https://portal.myskeet.com/forums/users/bet888bcom2/</a>
<a href="https://blacksocially.com/bet888bcom2">https://blacksocially.com/bet888bcom2</a>
<a href="https://www.mazafakas.com/user/profile/4665571">https://www.mazafakas.com/user/profile/4665571</a>
<a href="https://sorumatix.com/user/bet888bcom2">https://sorumatix.com/user/bet888bcom2</a>
<a href="https://qa.laodongzu.com/?qa=user/bet888bcom2">https://qa.laodongzu.com/?qa=user/bet888bcom2</a>
<a href="https://question-ksa.com/user/bet888bcom2">https://question-ksa.com/user/bet888bcom2</a>
<a href="https://mel-assessment.com/members/bet888bcom2/profile/">https://mel-assessment.com/members/bet888bcom2/profile/</a>
<a href="https://influence.co/bet888bcom2">https://influence.co/bet888bcom2</a>
<a href="https://www.metal-archives.com/users/bet888bcom2">https://www.metal-archives.com/users/bet888bcom2</a>
<a href="https://os.mbed.com/users/bet888bcom2/">https://os.mbed.com/users/bet888bcom2/</a>
<a href="https://forum.kryptronic.com/profile.php?section=personal&id=197202">https://forum.kryptronic.com/profile.php?section=personal&id=197202</a>
<a href="https://data.world/bet888bcom2">https://data.world/bet888bcom2</a>
<a href="https://triberr.com/bet888bcom2">https://triberr.com/bet888bcom2</a>
<a href="https://hcgdietinfo.com/hcgdietforums/members/bet888bcom2/">https://hcgdietinfo.com/hcgdietforums/members/bet888bcom2/</a>
<a href="https://imgcredit.xyz/bet888bcom2">https://imgcredit.xyz/bet888bcom2</a>
<a href="https://www.blackhatprotools.info/member.php?197156-bet888bcom2">https://www.blackhatprotools.info/member.php?197156-bet888bcom2</a>
<a href="https://nextion.tech/forums/users/bet888bcom2/">https://nextion.tech/forums/users/bet888bcom2/</a>
<a href="https://linkr.bio/bet888bcom2/store">https://linkr.bio/bet888bcom2/store</a>
<a href="http://www.innetads.com/view/item-2974941-888b-Casino.html">http://www.innetads.com/view/item-2974941-888b-Casino.html</a>
<a href="https://gitlab.com/bet888bcom2">https://gitlab.com/bet888bcom2</a>
<a href="https://www.magcloud.com/user/bet888bcom2">https://www.magcloud.com/user/bet888bcom2</a>
<a href="https://www.slideserve.com/bet888bcom2">https://www.slideserve.com/bet888bcom2</a>
<a href="https://www.mapleprimes.com/users/bet888bcom2">https://www.mapleprimes.com/users/bet888bcom2</a>
<a href="https://besayaeuropa.es/profiles/bet888bcom2/activity">https://besayaeuropa.es/profiles/bet888bcom2/activity</a>
<a href="https://jobs.asoprs.org/profiles/5181198-888b-casino">https://jobs.asoprs.org/profiles/5181198-888b-casino</a>
<a href="https://www.8a.nu/user/888b-casino">https://www.8a.nu/user/888b-casino</a>
<a href="https://muare.vn/shop/bet888-68/832133">https://muare.vn/shop/bet888-68/832133</a>
<a href="https://experiment.com/users/bet888bcom2">https://experiment.com/users/bet888bcom2</a>
<a href="https://www.wikidot.com/user:info/888b-casino">https://www.wikidot.com/user:info/888b-casino</a>
<a href="https://anyflip.com/homepage/fmkes#About">https://anyflip.com/homepage/fmkes#About</a>
<a href="https://australian-school-holidays.mn.co/members/27781388">https://australian-school-holidays.mn.co/members/27781388</a>
<a href="https://pubhtml5.com/homepage/lythq/">https://pubhtml5.com/homepage/lythq/</a>
<a href="https://www.weddingbee.com/members/bet888bcom2/">https://www.weddingbee.com/members/bet888bcom2/</a>
<a href="https://gab.com/bet888bcom2">https://gab.com/bet888bcom2</a>
<a href="https://reedsy.com/discovery/user/888bcasinoonlinehang">https://reedsy.com/discovery/user/888bcasinoonlinehang</a>
<a href="https://forum.codeigniter.com/member.php?action=profile&uid=121795">https://forum.codeigniter.com/member.php?action=profile&uid=121795</a>
<a href="https://pxhere.com/en/photographer/4354264">https://pxhere.com/en/photographer/4354264</a>
<a href="https://leetcode.com/u/bet888bcom2/">https://leetcode.com/u/bet888bcom2/</a>
<a href="https://www.creativelive.com/student/888b-casino-online-hang-u-v-ca-c-c?via=accounts-freeform_2">https://www.creativelive.com/student/888b-casino-online-hang-u-v-ca-c-c?via=accounts-freeform_2</a>
<a href="https://www.silverstripe.org/ForumMemberProfile/show/171343">https://www.silverstripe.org/ForumMemberProfile/show/171343</a>
<a href="https://fliphtml5.com/homepage/syndq/888b-casino-online-h%C3%A0ng-%C4%90%E1%BA%A7u-v%E1%BB%81-c%C3%A1-c%C6%B0%E1%BB%A3c/">https://fliphtml5.com/homepage/syndq/888b-casino-online-h%C3%A0ng-%C4%90%E1%BA%A7u-v%E1%BB%81-c%C3%A1-c%C6%B0%E1%BB%A3c/</a>
<a href="https://sketchfab.com/gamebai888b">https://sketchfab.com/gamebai888b</a>
<a href="https://www.reverbnation.com/artist/bet888bcom2">https://www.reverbnation.com/artist/bet888bcom2</a>
<a href="https://www.theexeterdaily.co.uk/users/bet888bcom2">https://www.theexeterdaily.co.uk/users/bet888bcom2</a>
<a href="https://www.angrybirdsnest.com/members/bet888bcom2/profile/">https://www.angrybirdsnest.com/members/bet888bcom2/profile/</a>
<a href="https://mecabricks.com/en/user/bet888bcom2">https://mecabricks.com/en/user/bet888bcom2</a>
<a href="https://metaldevastationradio.com/bet888bcom2">https://metaldevastationradio.com/bet888bcom2</a>
<a href="https://public.tableau.com/app/profile/888b.casino.online.h.ng.u.v.c.c.c/vizzes">https://public.tableau.com/app/profile/888b.casino.online.h.ng.u.v.c.c.c/vizzes</a>
<a href="https://connect.garmin.com/modern/profile/008e60ff-87fc-4959-8f0e-50f3334cd41d">https://connect.garmin.com/modern/profile/008e60ff-87fc-4959-8f0e-50f3334cd41d</a>
<a href="https://peatix.com/user/23701114/view">https://peatix.com/user/23701114/view</a>
<a href="https://www.producthunt.com/@bet888bcom2">https://www.producthunt.com/@bet888bcom2</a>
<a href="https://www.walkscore.com/people/116604189133/888b-casino-online-h%C3%A0ng-%C4%91%E1%BA%A7u-v%E1%BB%81-c%C3%A1-c%C6%B0%E1%BB%A3c">https://www.walkscore.com/people/116604189133/888b-casino-online-h%C3%A0ng-%C4%91%E1%BA%A7u-v%E1%BB%81-c%C3%A1-c%C6%B0%E1%BB%A3c</a>
<a href="https://pastebin.com/u/bet888bcom2">https://pastebin.com/u/bet888bcom2</a>
<a href="https://qiita.com/bet888bcom2">https://qiita.com/bet888bcom2</a>
<a href="https://www.credly.com/users/888b-casino-online-hang-d-u-v-ca-c-c.539aec81">https://www.credly.com/users/888b-casino-online-hang-d-u-v-ca-c-c.539aec81</a>
<a href="https://tupalo.com/en/users/7357279">https://tupalo.com/en/users/7357279</a>
<a href="https://www.scoop.it/topic/888b-casino-online-hang-au-ve-ca-cuoc">https://www.scoop.it/topic/888b-casino-online-hang-au-ve-ca-cuoc</a>
<a href="https://www.mountainproject.com/user/201905601/888b-casino">https://www.mountainproject.com/user/201905601/888b-casino</a>
<a href="https://www.threadless.com/@bet888bcom2">https://www.threadless.com/@bet888bcom2</a>
<a href="https://yoo.rs/useroverview/235336">https://yoo.rs/useroverview/235336</a>
<a href="https://link.space/@bet888bcom2">https://link.space/@bet888bcom2</a>
<a href="https://www.longisland.com/profile/bet888bcom2">https://www.longisland.com/profile/bet888bcom2</a>
<a href="https://allmy.bio/bet888bcom2">https://allmy.bio/bet888bcom2</a>
<a href="https://certified.heartmath.com/user/888b-casino-online-h%c3%a0ng-%c4%90%e1%ba%a7u-v%e1%bb%81-c%c3%a1-c%c6%b0%e1%bb%a3c/">https://certified.heartmath.com/user/888b-casino-online-h%c3%a0ng-%c4%90%e1%ba%a7u-v%e1%bb%81-c%c3%a1-c%c6%b0%e1%bb%a3c/</a>
<a href="https://qna.habr.com/user/bet888bcom2">https://qna.habr.com/user/bet888bcom2</a>
<a href="https://www.foroatletismo.com/foro/members/bet888bcom2.html">https://www.foroatletismo.com/foro/members/bet888bcom2.html</a>
<a href="https://www.outdoorproject.com/users/888b-casino-5">https://www.outdoorproject.com/users/888b-casino-5</a>
<a href="https://makersplace.com/gamebai888b/about">https://makersplace.com/gamebai888b/about</a>
<a href="https://www.pub100s.com/members/bet888bcom2/">https://www.pub100s.com/members/bet888bcom2/</a>
<a href="https://www.snipesocial.co.uk/bet888bcom2">https://www.snipesocial.co.uk/bet888bcom2</a>
<a href="https://safechat.com/u/888b.casino.845">https://safechat.com/u/888b.casino.845</a>
<a href="https://pitchwall.co/user/bet888bcom2">https://pitchwall.co/user/bet888bcom2</a>
<a href="https://git.qoto.org/bet888bcom2">https://git.qoto.org/bet888bcom2</a>
<a href="https://bet888bcom2.livejournal.com/profile/">https://bet888bcom2.livejournal.com/profile/</a>
<a href="https://participation.lillemetropole.fr/profiles/888b_casino/activity">https://participation.lillemetropole.fr/profiles/888b_casino/activity</a>
<a href="https://www.prosebox.net/book/67837/">https://www.prosebox.net/book/67837/</a>
<a href="https://sahityapedia.com/user/gamebai888b/">https://sahityapedia.com/user/gamebai888b/</a>
<a href="https://veganfooduk.co.uk/profile/bet888bcom2/">https://veganfooduk.co.uk/profile/bet888bcom2/</a>
<a href="https://atelierdevosidees.loiret.fr/profiles/888b_casino/activity">https://atelierdevosidees.loiret.fr/profiles/888b_casino/activity</a>
<a href="https://macro.market/company/888b-casino-online-hang-dau-ve-ca-cuoc">https://macro.market/company/888b-casino-online-hang-dau-ve-ca-cuoc</a>
<a href="https://lu.ma/user/bet888bcom2">https://lu.ma/user/bet888bcom2</a>
<a href="https://www.vevioz.com/bet888bcom2">https://www.vevioz.com/bet888bcom2</a>
<a href="https://gitlab.pavlovia.org/bet888bcom2">https://gitlab.pavlovia.org/bet888bcom2</a>
<a href="https://befilo.com/profile/bet888bcom2/about">https://befilo.com/profile/bet888bcom2/about</a>
<a href="http://forums.visualtext.org/member.php?action=profile&uid=1256021">http://forums.visualtext.org/member.php?action=profile&uid=1256021</a>
<a href="https://iszene.com/user-236088.html">https://iszene.com/user-236088.html</a>
<a href="http://school2-aksay.org.ru/forum/member.php?action=profile&uid=284838">http://school2-aksay.org.ru/forum/member.php?action=profile&uid=284838</a>
<a href="http://compcar.ru/forum/member.php?u=123966">http://compcar.ru/forum/member.php?u=123966</a>
<a href="http://forum.cncprovn.com/members/194998-bet888bcom2">http://forum.cncprovn.com/members/194998-bet888bcom2</a>
<a href="https://ficwad.com/a/bet888bcom2">https://ficwad.com/a/bet888bcom2</a>
<a href="https://anantsoch.com/members/bet888bcom2/">https://anantsoch.com/members/bet888bcom2/</a>
<a href="https://www.anibookmark.com/user/bet888bcom2.html">https://www.anibookmark.com/user/bet888bcom2.html</a>
<a href="https://matkafasi.com/user/bet888bcom2">https://matkafasi.com/user/bet888bcom2</a>
<a href="https://www.fundable.com/bet888b-com2">https://www.fundable.com/bet888b-com2</a>
30 oct. 2024 04:58
Top论文网凭借其专业的服务团队、严格的质量控制、完善的隐私保护以及多样化的服务选项,成为了许多留学生网课代修 https://www.lunwentop.net/wangkedaixiu/ 的首选平台。在帮助留学生应对语言和文化障碍、管理时间、提升学术表现等方面,Top论文网的服务价值不言而喻。通过合理使用该平台提供的学术支持,留学生不仅能够获得优异的成绩,还能提高自信心和学术技能,为未来的学术生涯奠定坚实基础。
Please register or log in to leave a reply.