BeWelcome / rox

:earth_africa: BeWelcome lets you share a place to stay, connect with travellers, meet up and find accommodation on your journey. It is and will always be a free, open source, non for profit, democratic community.
https://www.bewelcome.org
GNU General Public License v2.0
187 stars 53 forks source link

Lack of preview when posting BW 'www' on social media #218

Closed subacultured closed 3 years ago

subacultured commented 3 years ago

These days, almost every website encourages visitors to share its pages on social media. BeWelcome is no different. We want people to say

"I joined bewelcome.org" "I am looking for a host in Berlin. My profile is XX" "I have a new trip...host me on my trip to Europe" "I have a pub crawl in Berlin on te 25th. Join us"

At moment, when posting BW links on social media, it remains a hypertexted link. it doesn't tell the viewer what BW is, what it does, and doesnt generate new views/members" It doesn't communicate anything about BW.

Word-of-mouth, is one of the most effective ways for BW to gain awareness.

When users choose to share these links, it is tasked to the web developer to make sure that the associated web pages are properly prepared, for the largest social platforms like Facebook and Twitter (whatspp, telegram, LinkedIn)

We can prepare for basic links "www.bewelome.org" but think about wat happens when members post a (1) Basic Link to Bewelcome.org (2) their Profile (3) An activity /event (4) A trip

Of course, it can be a complex endeavour if we seek 1-4

Links https://developers.facebook.com/tools/debug/?q=www.bewelcome.org https://www.d-hagemeier.com/en/articles/generate-social-media-preview-images/#h-generate-html-template https://knowledge.hubspot.com/social/featured-image-not-displaying-correctly-in-social-preview https://www.addtoany.com/ext/meta-tags/

subacultured commented 3 years ago

I have created code here https://pastebin.com/5n9cL2tG

A preview picture of what it might look like after is here - https://bayimg.com/eAOHaaaGh

The description is already in a translation ID, but might be updated. A picture would need to be unloaded to server, Code copied into website Help create a pull request would be appreciated.

thisismeonmounteverest commented 3 years ago

@subacultured Unfortunately the information for twitter in the pastebin was wrong other than that this is now implemented. Please test (on beta).

ghost commented 3 years ago

I tested on Facebook, but it doesn't seem to work. When I paste the link for BW homepage in my post (so, in editing mode) it shows me the preview picture, but after publishing no preview displays on my wall. And when I post a link to my profile it just displays "BeWelcome - login", though I was logged in at the same time. I tried a link to beta or to www (being logged in both) with the same result.

thisismeonmounteverest commented 3 years ago

@gbenouville Did you try https://beta.bewelcome.org? Any other link will currently fail as only the homepage on beta has the tags.

ghost commented 3 years ago

Ok, for the link to profile I did test with beta and it didn't work, but for the homepage I tested only with www. With beta it works.

subacultured2 commented 3 years ago

Checked on FB, twitter, WhatsApp. All good. . Maybe 2-4 can be future issue...links to profiles, trips and activities. .

thisismeonmounteverest commented 3 years ago

I made a small change adding the webpreview information also to the /login page. This way even deep links will show the preview as they all would end up on /login.

Please check.

ghost commented 3 years ago

It works on Facebook (I tested links to activities and profiles).

subacultured commented 3 years ago

Worked on facebook - Chrome/Edge. Position and size fine.

subacultured commented 3 years ago

Whats app didnt work with wither beta.bewelcome.org or https://beta.bewelcome.org/

crumbking commented 3 years ago

Checked on whatsapp. Worked for me with https://www.bewelcome.org and https://bewelcome.org. Only www.bewelcome.org or bewelcome.org did not work. But I think whatsapp does not recognize last two as valid URL links.

Therefore close as being introduced with last release. New requirements should go into a follow up.