close ad
Install the LAtest Updates to Work with CC 2017 and CC 2018
open ad
View Menu

Technical Support Forums

Free, outstanding support from WebAssist and your colleagues

rating

Social Toolkit.

Thread began 5/09/2013 10:25 am by Simon | Last modified 5/10/2013 1:41 pm by Simon | 2331 views | 8 replies |

Simon

Social Toolkit.

Lets say I insert a share button into my page. When I load this onto the server and test, there is a thumbnail picture that appears on Facebook. How can I change this image? Also if I insert a like button and test, the image that shows is a twitter icon, what I would want is a logo for my business appearing in Facebook. Is this possible?

Sign in to reply to this post

Jason ByrnesWebAssist

you can control the image and text used when you like a page by adding custom meta tags, I believe thee are also used by the share script:

<meta property="og:title" content="title" />
<meta property="og:description" content="description" />
<meta property="og:image" content="thumbnail_image" />

Sign in to reply to this post

Simon

Help!

The problem i have is that i new to Dreamweaver and have little experience with the code side, and do most my work in design view.
Could you try to explain to me how to:

Use a specific image so that when people Share/Like/Comment on my site the thumbnail pic has been chosen by me and not FB.
I would be very grateful for any help you can give me.

Regards
Simon Morton.

Sign in to reply to this post

Jason ByrnesWebAssist

add the meta tags into the head of the apge using code view, past them just after the opening <head> tag:

<meta property="og:title" content="title" />
<meta property="og:description" content="description" />
<meta property="og:image" content="thumbnail_image" />


in the og:image meta tag, change the content;
content="thumbnail_image"

to the full URL fore the image:
content="http://mysite.com/images/image.jpg"

Sign in to reply to this post

Simon

I tried to follow your instructions, but i am still getting the wrong image!
here is the code from a test page i created in my site:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta property="og:title" content="title" />
<meta property="og:description" content="description" />
<meta property="og:image" content="http://www.africanbikeadventures.com/images/fbicon.jpg" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>African Bike Adventures</title>
<link rel="stylesheet" type="text/css" href="../webassist/social/wasocial.css"/>
<script type="text/javascript" src="../webassist/social/wasocial.js"></script>
</head>

<body>
<div class="wasocial">

<div class="icons">
<a name="fb_share" type="icon" href="#" onclick="window.open('http://www.facebook.com/sharer.php?u=http://www.africanbikeadventures.com', 'Facebook', 'toolbar=0,status=0,width=626,height=436'); return false;" title="Facebook">
<img src="../webassist/social/icons/facebook.png" />
</a>
</div>
</div>
</body>
</html>

The image that show's location details are as followed:

https://fbexternal-a.akamaihd.net/safe_image.php?d=AQAUwnjJbW9iqBLe&w=100&h=100&url=http%3A%2F%2Fwww.africanbikeadventures.com%2FImages%2FStart%2520Page%2FAdventure.jpg&cfs=1&upscale

Regards

Sign in to reply to this post

Jason ByrnesWebAssist

please post a link

Sign in to reply to this post

Simon

Reply

Hi.

Sorry for the late reply! I reside in South Africa, i am not sure what the time difference is.

My website is: www.africanbikeadventures.com
Please note that it's still under construction.

You will see that if you click any of the social stuff there will be different images appearing
on you Facebook profile, i would like to make these standard.

Regards.

Sign in to reply to this post

Jason ByrnesWebAssist

Since the page has already been liked, you will need to refresh the cache on face book by using there debug page.

https://developers.facebook.com/tools/debug

This will force the facebook to refresh the cahse.

also you should have a toitle tag:

<title>Page Title</title>

and a description meta tag:
<meta name="description" content="site description" />

Sign in to reply to this post

Simon

Thanks.

Great. This has solved the problem!
Thank you for your support !!!!

Sign in to reply to this post

Build websites with a little help from your friends

Your friends over here at WebAssist! These Dreamweaver extensions will assist you in building unlimited, custom websites.

Build websites from already-built web applications

These out-of-the-box solutions provide you proven, tested applications that can be up and running now.  Build a store, a gallery, or a web-based email solution.

Want your website pre-built and hosted?

Close Windowclose

Rate your experience or provide feedback on this page

Account or customer service questions?
Please user our contact form.

Need technical support?
Please visit support to ask a question

Content

rating

Layout

rating

Ease of use

rating

security code refresh image

We do not respond to comments submitted from this page directly, but we do read and analyze any feedback and will use it to help make your experience better in the future.

Close Windowclose

We were unable to retrieve the attached file

Close Windowclose

Attach and remove files

add attachmentAdd attachment
Close Windowclose

Enter the URL you would like to link to in your post

Close Windowclose

This is how you use right click RTF editing

Enable right click RTF editing option allows you to add html markup into your tutorial such as images, bulleted lists, files and more...

-- click to close --

Uploading file...