Creating a social media icon

Question

I've created my own social media icon like so:

<a  href="https://www.facebook.com/sharer/sharer.php?u=example.org" 
target="_blank"><div 
class="containercross">
<div class="cross1">
<div class="cross2"></div>
</div>
</div></a>

Css:

.cross1 {height:30px; 
width: 7px; background- 
color: black; margin-left: 
50px;} 
.cross2 {height:30px; 
width: 7px; background- 
color: black; margin-left:  
50px;transform:ro
tate(90deg);margin- 
left:0px;}

My question is whether u=example.org from the code above will display example.org when sharing or my site name? Otherwise how would it know what my site name was?

You could just have posted `Share` without all the other stuff in a [mcve] — mplungjan, Sep 04 '20 at 11:02
I don’t get what the actual question is supposed to be here. — CBroe, Sep 04 '20 at 11:03
And what is the weird link you had at the end. Smells like backlink spam to me — mplungjan, Sep 04 '20 at 11:04
@Cbroe when you share a link to Facebook it should list your site address as well as a visual rendering. Will it do that with the code above? — Fresh, Sep 04 '20 at 11:05
Why are you asking us, instead of simply testing it yourself? — CBroe, Sep 04 '20 at 11:06

Lionel Rowe · Accepted Answer · 2020-09-04T11:13:50.243

0

Facebook uses the u parameter to know which site to link to, then pulls the displayed information from metadata elements present in that site's head section, such as title and various opengraph meta elements.

See this CSS Tricks article for more info. Examples they give include:

<meta property="og:title" content="European Travel Destinations">
<meta property="og:description" content="Offering tour packages for individuals or groups.">
<meta property="og:image" content="http://euro-travel-example.com/thumbnail.jpg">
<meta property="og:url" content="http://euro-travel-example.com/index.htm">

edited Sep 04 '20 at 11:13

answered Sep 04 '20 at 11:09

Lionel Rowe

5,164
1
14
27

Thanks. So even though it doesn't mention my site title above, amd my site name is not `example.org` it will know which site has directed it there and list that site? – Fresh Sep 04 '20 at 11:12
Nope. You need to change the `u` parameter to your own site. The `Referer` header isn't used (at least not for pulling the information, anyway, though I'm sure Facebook tracks it given how much they love collecting data). – Lionel Rowe Sep 04 '20 at 11:15

Creating a social media icon

1 Answers1