Opening Facebook Mobile App from url OR Link entered in element settings does not publish correctly

Hello! This is the link I’m pasting into a link block as a url.

fb://profile/512904242412423

What gets published instead is:

fb//profile/512904242412423

The colon disappears and the link fails to work because of that. Is this a known issue, and is it a “bug”? I tried replacing the colon with ASCII codes or HTML safe characters and there’s no solution to just get the link to be available the way I type it.

This link will trigger the Facebook App to open on a mobile device when entered into a browser and ask the user if they want to continue using the Facebook app. It may be buggy if the app isn’t installed on the mobile device, but I want to resolve this first before going into custom coding because a Java certification isn’t on my radar in the scope of this project.

I’m going to try an html embed an see if it works.

Thanks.

It’s the facebook link in the footer that appears in *****MOBILE PORTRAIT VIEW…
The element is set to “View None” on every other breakpoint and replaced with identical element with a regular link starting with an “http://” so if you view the project, keep that in mind.

I duplicated the full site with just two pages to illustrate this particular issue.


Here is my site Read-Only:

https://preview.webflow.com/preview/itpopdesign?utm_source=itpopdesign&preview=44f668b93ce102596f59727671525ed1

Link to the published site:
http://itpopdesign.webflow.io/

Solution!

At this time (October 2018) webflow supports only urls in the hypertext transfer protocol… in other words… it’s gotta start with “http”! That means “fb://” is not natively supported BUT!

Using the inspect feature of your chrome browser, you can copy and paste the published draft and substitute the desired link exactly how you like. Then paste this in as an HTML embed.

Problem solved.

Now users viewing content at a Mobile landscape or mobile portrait view on my site will now be prompted in both ios and android to open the link directly in the facebook app (if installed) when the link is tapped. Otherwise, the user will be directed to the facebook link in their browser like the expected behavior of any other link… if that action cant be completed.

This is a lonely post, but I also came across this site in my research for the solution.

They’re called

URLGenius

and what THEY do is host a bunch of script on their servers and let you tell them what you’d like to link (Youtube, facebook, twitter, amazon products, the list goes on). They spit out a link you can use as your “http://” href (no html embed needed!).

When you paste their link in your site or email, their magic detects everything it needs about your device to direct you to the most appropriate app. You customize the android link, the ios link, and the “fallback” link which can be either in the browser or a link to the app store. They give you a total of 5000 clicks free between ALL links you make and then (I feel is steep) a penny per click after. Depends on your volume and conversion really. I’m going to try them out as an email footer and see how it goes. If you have any experience with them please share! I’m not an affiliate with them haha.

Thanks to webflow priority support for the great help on this solution. His name is Dave.

1 Like

I assume this is still the case?

Either way: is there a way to hide the “https://” or “http://” from public view? Ie. in Webflow’s CMS I will always add “https://webflow.com/” but I’d love for only “www.webflow.com” to show to my site’s end user.