Welcome, Guest ( Customer Panel | Login )




 All Forums
 VPCart Forum
 General help me questions
 Rich Snippets og:image
 New Topic  Reply to Topic
 Printer Friendly
Author Previous Topic Topic Next Topic  

dax
Starting Member

14 Posts

Posted - July 16 2013 :  19:59:01  Show Profile  Reply with Quote
Hi all,

We are trying to create a meta tag for rich snippet images, so that the correct product image is created for Facebook and Google +

From what we can see the tag needs to go in shoppage_header.htm along the lines of...

<meta property="og:image" content="" />

Has anyone had experience with generating a dynamic image which could be used in this tag?

Or is there a better way?

DAX

diegomilito
VP-CART Expert

Argentina
779 Posts

Posted - August 01 2013 :  23:13:16  Show Profile  Reply with Quote
dax, just some sharing, i ever tried some experiment for dynamic images to be showed on facebook passed from my site products,

there is code to be put into <head></head> inside your header template :

<head>
<%
if request.querystring("id") <> "" then
dim strprodcid
strprodcid = request.querystring("id")
%>
<meta property="og:title" content="<%= getproductnameforfb(strprodcid) %>" />
<%
else
%>
<meta property="og:title" content="enter your site title" />
<%
end if
%>
<meta property="og:type" content="website" />
<%
if request.querystring("id") <> "" then
dim strprodukid
strprodukid = request.querystring("id")
%>
<meta property="og:url" content="http://www.enteryoursite.com/shopexd.asp?id=<%=strprodukid%>" />
<%
else
%>
<meta property="og:url" content="http://www.enteryoursite.com/" />
<%
end if
%>
<%
if request.querystring("id") <> "" then
dim strprodid
strprodid = request.querystring("id")
%>
<meta property="og:image" content="http://www.enteryoursite.com/<%= getproductimageforfb(strprodid) %>" />
<%
end if
%>
</head>

and there is also sub routine to be put into shop$db.asp :
function getproductimageforfb(sid)
dim strcatalogid
dim itemsql,itemconn, itemrs, strsupname, stritemname
itemsql="* from products where catalogid = "& sid &""
shopopendatabase itemconn
Set itemrs=itemconn.execute(itemsql)
if not itemrs.eof then
stritemname = itemrs("cimageurl")
''response.write stritemname
''response.end
end if
getproductimageforfb = stritemname
Set itemrs = nothing
set itemconn = nothing
end function

function getproductnameforfb(sid)
dim strcatalogid
dim itemsql,itemconn, itemrs, strsupname, stritemname
itemsql="select * from products where catalogid = "& sid &""
shopopendatabase itemconn
Set itemrs=itemconn.execute(itemsql)
if not itemrs.eof then
stritemname = itemrs("cname")
end if
getproductnameforfb = stritemname
Set itemrs = nothing
set itemconn = nothing
end function

and of course you need to insert the fb iframe code into product template maybe at the tmp_product.htm :

src="https://www.facebook.com/plugins/like.php?href=http://www.enteryoursite.com/shopexd.asp?id=[catalogid]&layout=standard&show_faces=true&width=450&action=like&colorscheme=light&height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:400px; height:30px;" allowTransparency="true"></iframe>

i do not sure if those will work in your site perfectly but at least u should know something about coding or have a coder to adjust that for you..

good luck
diego.
Go to Top of Page

devshb
Senior Member

United Kingdom
1904 Posts

Posted - August 28 2013 :  21:43:05  Show Profile  Visit devshb's Homepage  Reply with Quote
Hi Diego,

That''s a great solution, it''s similar to the kind of thing we''ve been doing too.

Something we''ve had issues with though is that the images (cimageurl or extendedimage etc) on some of our clients'' sites are not necessarily very "square"; facebook ignores images that have an aspect ratio beyond 3:1, and generally square images work much better for/on facebook.

The og:image value doesn''t necessarily have to be an image that''s physically displayed on the page either, so you could use a different image in the facebook tag than the normal cimageurl/extendedimage when it''s not a very "square" one.

So at the moment the main problem (once you''ve got the kind of customised tweaks like you shared above in place) is what''s the best way to create images that fit with the facebook ratios?

Your function can then easily be tweaked to use the column name that hold the "facebook image" rather than the cimageurl/extendedimage.

Have you run into this "square image" issue? If so, how did you deal with it? If you''ve got a site that''s got, say, 10,000 images, most of them sizes/ratios like 400x100 or 150x500, then facebook would ignore the image tag and just use whatever other images it can find which fit its sizing/ratio rules (which are usually completely irrelevant ones like a shopping trolley icon or a border background gif etc).

Facebook say that the images must be at least 200x200, and as square as possible.

What I''m thinking is maybe to create some kind of admin script which goes through all the extendedimage files in a loop, and uses aspjpeg to "redraw" them to fit facebook-image-rules, and then stamp those resized files onto another column on the products table, and then use that for the tag.

Has anyone else had this issue with facebook using totally irrelevant images when they share a link to their site on facebook? I''m amazed that there haven''t been more postings about this, we''re getting quite a steady flow of people who are starting to spot this issue when they use facebook, but the full solution hasn''t been created yet as far as I know. We could create an admin addon that does that kind of aspjpeg loop, and corresponding detailed code for the customer-side to setup the tags on the home page and product pages etc so that all pages on the site have a fall-through that always use a good/relevant image, but I''d like to see if anyone out there is having these issues, and what they think first.

Surely Diego and Dax aren''t the only people that are having these issues?

I don''t really see it as an oversight/problem with vpasp itself, because the problem''s relatively new and people are only just starting to spot it, but I think it does need a proper/full solution. Whether that''s an addon that we build, or shared-code like Diego''s, or vpasp themselves doing an update, I''m not sure, but I reckon it definitely needs addressing.

Simon Barnaby
Developer
[email protected]
www.BigYellowZone.com
www.BigYellowKey.com
Follow us on Twitter: http://twitter.com/bigyellowzone
Web Design, Online Marketing and VPASP addons
Go to Top of Page

devshb
Senior Member

United Kingdom
1904 Posts

Posted - August 28 2013 :  22:09:53  Show Profile  Visit devshb's Homepage  Reply with Quote
Also, on a related note, you can debug/test what facebook sees from your site''s urls here:
https://developers.facebook.com/tools/debug

Using that tool you''ll be able to see what kind of thumbnail/title/description facebook would give to any page of your site that someone would share.

Simon Barnaby
Developer
[email protected]
www.BigYellowZone.com
www.BigYellowKey.com
Follow us on Twitter: http://twitter.com/bigyellowzone
Web Design, Online Marketing and VPASP addons
Go to Top of Page

carfin
VP-CART Expert

United Kingdom
948 Posts

Posted - August 29 2013 :  06:37:30  Show Profile  Reply with Quote
Hi Simon,

I agree that the best way round this is to have a field in the products table to store a uniform size image (say 200px) for use with Social Networking sites and other applications.
You can use and amend the properties of the DrawImage method within ASPJPEG to create a standard size new blank image (canvas) and then do a batch process loop through all the extended images resizing to fit on each new blank image, saving the new image to the products table.

Or if you have Photoshop (other image editing software is available) you can batch process your original extended images to a square format and then upload

We don''t use social media yet as we are a business to business wholesaler but I know one small company that is having this exact problem. It would be interesting to know if VP-ASP could provide a solution as a bolt on.

Regards,

Carrol
www.deanston-electrical.co.uk
Go to Top of Page
  Previous Topic Topic Next Topic  
 New Topic  Reply to Topic
 Printer Friendly
Jump To:
Snitz Forums 2000
0 Item(s)
$0.00