twitter Archives - The Last Drop of Ink

Tag Archive for: twitter

Social Sharing Buttons for eBay Listings – Copy & Paste Code!

July 18, 2012/by Matthew Ogborne

Would you like to be sporting the social icons that you at the top of every eBay listing, in your listings?

You know the ones the links that take your products to the sites below and are in the screen shot to the right?

Facebook
Pinterest
Twitter
The button to email a friend
And for good measure, the “Add to Watchlist” link too.

You do? Sweet, I’ve got some sick copy & paste code for you below :)

They do come with a warning though…. Even though they are a direct replication of what eBay has on the top of each listing and the code provided in this article is based of what eBay use’s (it even uses their image for the icons and part of their CSS), this still can be classed as a links policy violation and it’s to be used at your own discretion.

How To Use

In the next part of this article I’m going to be referring to “keywords”, you may also know these as tags or macros and are used by third-party tools to list to eBay with.

If you have no idea what these are then either you’re not using a 3rd party eBay listing tool or you’ll find these two articles super useful Part 1 & Part 2.

If you are not using any of these or a tool that does support keywords, for example if you are manually listing items on eBay or using TurboLister, but still want the icons, then follow the steps for “WITHOUT” a 3rd party tool below.

For Users WITH 3rd Party eBay Listing Software

If you have 3rd party software that supports keywords, it’s going to be two edits for you and I’ve included the keywords for:

If you tool have different keywords, then just change them over by following the instructions below.

If you’re using any of the tools above or a similar product that has keywords (tags, macros or whatever you’d like to call them), then it’s a simple case of copying the code later on in this article and swapping over the keywords for s_ItemTitle and s_ItemImage at line 59 and 60.

For ChannelAdvisor your keywords are: {{ITEMTITLE}} and {{IMAGE(ITEMIMAGEURL1)}}

For eSellerPro your keywords are: {{Title}} and {{Image(ItemImageURL1)}}

For ChannelGrabber your keywords are: {{title}} and {{image1}}

Swap these keywords over as appropriate for text between the quotes in var s_ItemTitle = “{{Title}}“; and var s_ItemImage = “{{Image(ItemImageURL1)}}“; and then paste the code into your listing template section and press save.

Tip: If you’re a little lost, see the next section for users without 3rd party tools for a colour coded guide.

For Users WITHOUT 3rd Party eBay Listing Software

This isn’t a biggy, you can still use this script. However it requires you to edit a little bit of HTML, but it’s really easy and if you get stuck, let me know in the forums, I’d be happy to help you (registration is of course free).

Copy and paste the code in the section below into your listing, where you would like the buttons to show, in the code there two variables that you need to set, these are:

var s_ItemTitle = “{{Title}}“;

This is at line 59 below and

var s_ItemImage = “{{Image(ItemImageURL1)}}“;

Which is at line 60.

In between the quotes for each line you need firstly change the text {{Title}} (as shown above in red) to your eBay listing title. For example, if you’re listing with an title called “LOVELY TOWN & COUNTRY ** WELLINGTONS”you’d pop this between the quotes so it now reads like this:

var s_ItemTitle = “LOVELY TOWN & COUNTRY ** WELLINGTONS“;

If you know how to find the URL (link) for an image then you can also update the text between the quotes for the s_ItemImage setting too, if you don’t then just set this to:

var s_ItemTitle = “”;

But if you do, pop the image URL between the quotes and Pinterest will work for you :)

Now copy and paste the entire code into your listing, on the HTML tab where you would like the buttons to appear and remember if you get stuck, let me know in the forums, I’d be happy to help you.

The Social Buttons Code for eBay Listings

Below is the code you’ll need to copy and paste for your social buttons to appear, remember to set your keywords to the title and image links as appropriate. Then revise or list an eBay to ensure it’s working, noting that it has to be live on eBay to work, in a preview screen the icons will not show.

<!– social icons –> <div id=”socialicons”> <script type=”text/javascript”>// <![CDATA[ /* *** Social Sharing Icons Script for eBay ** For documentation on how to use this script See http://lastdropofink.co.uk/ */ if(ebayItemID != “”) { // EDIT THESE TWO LINES ONLY !!! var s_ItemTitle = “{{Title}}”; var s_ItemImage = “{{Image(ItemImageURL1)}}”; // You may STOP EDITING now. var eID=ebayAskSellerURL.split(“requested=”);eID=eID[1];var eBayDomain=ebayAskSellerURL.split(“contact.”);eBayDomain=eBayDomain[1].split(“/ws/”);eBayDomain=eBayDomain[0]; // Intro document.write(“ <div class=’scShareText’>Share:</div> ”); // Email document.write(“<a href=’http://contact.” + eBayDomain + “/ws1/eBayISAPI.dll?ShowEmailAuctionToFriend&item=” + ebayItemID + “‘ title=’Tell a Friend’ class=’scShareIcon social_icons_email’ target=’_blank’> </a>”); // Facebook document.write(“<a href=’https://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fwww.” + eBayDomain + “%2Fitm%2F” + ebayItemID + “‘ title=’Share on Facebook’ class=’scShareIcon social_icons_fb’ target=’_blank’> </a>”); // Twitter if(s_ItemTitle != “” ) { document.write(“<a href=’https://twitter.com/intent/tweet?original_referer=http%3A%2F%2Flastdropofink.co.uk&related=ebay_uk,matthewogborne,ebay,lastdropofink&source=lastdropofink&text=” + encodeURI(“View “) + encodeURI(s_ItemTitle) + “%20on%20%23eBay” + “&url=http%3A%2F%2Fwww.” + eBayDomain + “%2Fitm%2F” + ebayItemID + “&via=lastdropofink’ title=’Tweet’ class=’scShareIcon social_icons_twitter’ target=’_blank’> </a>”); } // Pinterest if(s_ItemImage != “”) { document.write(“<a href=’http://pinterest.com/pin/create/button/?url=http%3A%2F%2Fwww.” + eBayDomain + “%2Fitm%2F” + ebayItemID + “&media=” + encodeURI(s_ItemImage) + “‘ title=’Pin It’ class=’scShareIcon social_icons_pin’ target=’_blank’> </a>”); } // Add to Watch list document.write(“ | <a href=’http://cgi1.” + eBayDomain + “/ws/eBayISAPI.dll?MakeTrack&item=” + ebayItemID + “‘ title=’Add to Watch list’ class=’social_icons_watch’ target=’_blank’>Add to Watch list</a>”); } // ]]></script></div> <!– /social icons –>

Customised, Automatic Integrated Version

On a side note: If you are not using a third party tool or have to/get fed up of manually adding the title and image URL’s each time, it would take about ~1.5 hours for me to write a PHP version that connects to the eBay API and finds the listing title and main image so that this can be automated.

This would remove the need for you to manually add the title and images each time. Plus I’m pretty sure this could be setup to “auto add” to the top or bottom of eBay listings as well. But I don’t have those 1.5 hours right now at the time of posting to do so (and they would need to be paid for hours), so for now, use the above :) If you would an automated method, it can be done see the contact Matt page if this of interest to you.

Your Feedback

If you run into problems, let me know in the forums.

Once you’ve got it working, let me know by either leaving a comment below or a post in the forums, as you’ll agree the above code is pretty darn cool, enjoy and maybe you’d like to press the tweet or like button at the top of this page share it with your friends too?

The True Cost of Adding Social Buttons

February 20, 2012/by Matthew Ogborne

A cost, for adding social buttons to your website? Matt you’ve lost the plot…. or have I?

I wrote an article last year because I was horrified that the Facebook Like buttons are actually adding 84Kb, or in time 1.340 seconds to the page load time of this site. In this article, I look at the social sharing buttons again, but in more depth and identify the weight behind them.

By adding the Facebook, Twitter, Stumbleupon, Digg, Google +1, Facebook Like buttons and so on… you’re adding download weight to your pages and while they might look great and you might put a tick in your mind that you’ve got the social side licked, however… What is the true cost of adding the social buttons to your website?

It’s also worth noting that very shortly you should expect new Facebook buttons to be appearing, called “Want one” and “Own”, the Facebook Like button never really ported to well eCommerce and we’ll soon be seeing these plastered everywhere.

Tools Used

For this exercise, I am going to be using the following tools:

Webpagetest.org
I freely admit I’m a data freak and a website like this, really does it for me. For the purpose of this article I’ll be using it to identify the resources pulled on page loads. You’ll also find this site exceptionally useful for checking your page loading times as a whole.The data used for the majority of this article comes from this test: http://www.webpagetest.org/result/120220_MW_39ZEJ/
Excel
The reports that the WebPageTest site creates can be copy/pasted to excel, this is what I’ll be using to filter the results.

Your mileage with these figures will vary upon many factors, such as location and server load. I’ve tried to keep as many aspects that I can consistent across the tests, but obviously things will vary. Felt I should point this out early on.

The use of the IFRAME tag for the majority of these sharing buttons does mean that your website page will continue to load while the external resources are being loaded, sometimes long after the website page has rendered. But my point is, they’re still being downloaded!

Let’s dig in and see what they’re like.

Facebook Social Button

In the previous article, I found that the Like button I was using was accounting for 84.4Kb to the page weight and taking over a second to the final page load time. A screen shot of this is below.

Since then I swapped the button to a different one using a the ShareBar extension to WordPress and its this button set I’ll be looking at in this article and you’ll see them either on the left or at the top of this article (feel use them, if you’re finding this article helpful).

While the button itself is now in an IFRAME tag, which means it’ll load outside the main page and is not classed as page weight, the initial inclusion of the Facebook like button on the site is 6.9Kb and is loaded twice, for a total of 0.142 seconds.

So this is a vast improvement on the earlier article where I found it was pulling in a huge amount of overhead, however we must not forget that even though, this is in an IFRAME, it’s still being downloaded by the user.

So looking at this for the actual button in question in a separate test reveals that the browser is actually downloading a further 61Kb of data and takes around 1.229 seconds to fully load. This is shown in the screenshot below.

The full test results are here: http://www.webpagetest.org/result/120220_Y1_3A0DZ/

Interesting results so far as we’re getting close to the original 84Kb that I found last year. Lets see how the other buttons fair.

Twitter Social Button

The large twitter button is also not without a fair amount of page weight as well. Using the filters in excel from the previous test, we can see that its accounting for 52.5Kb of bytes downloaded and takes 0.431 seconds to load.

The Twitter sharing button also uses an iframe and we look at this as a separate resource at this page test http://www.webpagetest.org/result/120220_8C_3A0JJ/ we can see that the iframe contents are 16Kb and take 0.720 seconds to load. So that’s an extra 16Kb for the browser to download, on top of the original 52.5Kb, yikes!

Still amazed that these buttons are so top heavy? Keep reading, it gets better!

Google Plus Social Buttons

The social buttons for Google Plus One are now becoming very popular and as they work on integrating businesses, we’ll start seeing a lot more of these. The bytes downloaded for the Google Plus button in the test is 22.3Kb and the time take is just 0.31 seconds.

Don’t get too excited just yet… Again the Google plus button is in an IFRAME, but the contents of the IFRAME still need to be downloaded and guess what… this one is at 69Kb and takes 1.607s seconds to load! Test results are in a screen shot and the test results are here http://www.webpagetest.org/result/120220_TQ_3A0NE/

Yea, that was deceptive, the Google Plus button has the lightest include so far, but looking at the total weight of Kb downloaded, 69Kb is monstrous and again I’d like to point out that the browser is having to download this content even after the main page has loaded.

Digg Social Buttons

Now it’s time to look at the very popular Digg social buttons for sharing. I might be techy, but I am frankly unsure why its being reported that it took 0.07 seconds to load just one file and the others have no time. If you know why, let me know in the comments box below!

However, this button is coming in at 9.9Kb to load the shell of the button and apparently 0.07 seconds to load it. Although I feel this value is incorrect.

Not too bad so far, so let’s take a look at what it loads. This one was a little tricky to nail down, as unlike the other buttons so far they’re using iframes, this one is using a javascript include to bring the other elements in and to test this I have take the chunk of HTML & JavaScript that is used to load the button, put it on its own page and then page speed tested that by itself (I WILL find the weight of this button!).

The page test & results are here http://www.webpagetest.org/result/120220_15_3A0Y1/ and as this is a separate page, the results are slightly different as we need to remove the TTFB and the page from the sum of the components. The button resources come in at a total 9.4Kb of assets, with the png image taking up the majority of this weight at 5.3Kb.

Again I don’t know why the time taken to download the resources is not appearing in the test, but out of all the social buttons tested by far, at a total of 9.4Kb this is by far the lightest button!

Stumbleupon Social Button

This button is back to using a script file that weights just 0.7Kb, a fraction of a second to load and an IFRAME.

Again lets look at the iframe weight by itself in its own test http://www.webpagetest.org/result/120220_RN_3A108/ and we find that this button comes in at a very palatable 5Kb, however sucks at a load time of 0.812 seconds.

AddThis Social Buttons

The last button that I am going to test as part of this article is the “AddThis” button. I’ve chosen this button on top of the other ones I use because this tool can be seen as a quick fix for websites.

I’ve chosen the middle set of 3 options for icon size and also the generic code for “A Website”, obviously if you’re using smaller or larger buttons and for a different platform, your actual results will differ, but for a ball park figure this will be adequate.

On the first page load for the test file I made, I can already tell this one is going to lag badly. I’m on 50Mb broadband and the page lagged for ~1 second, thats not a good sign!

And… I was right. Again I need to remove the TTFB (Time To First Byte) from the equation, but on first impressions 124Kb is a whopping amount of data to be downloading.

I’ve pulled the results out into excel as shown in the screen shot below:

The time take is incorrect again, however its interesting to see that when we sum the bytes downloaded, that we’re coming in over the original page weight at 125.2Kb. Eitherway this social set of buttons is the largest so far.

Summary

I’ve delved into the truer weights of loading these social buttons to help you understand that adding these buttons do come with a cost attached to them. While many of these use iframes to pull in the data from the external sites and don’t count towards to page load time to get the page loaded in the clients browser, they are still being downloaded and add to the true total weight of the page.

I feel its also worth pointing out that with the majority of the buttons tested, they are using content delivery networks, which will help with the delivery speed of the data across the globe. Also the scores from the testing sites were indicating clearly that the providers of these buttons have highly optimised systems to deliver the content, with most of them scoring A’s for each mark and of course, browsers do cache these data files, so if a user has been to another site and downloaded the sharing buttons, the weight is much less as the browser as the files in its cache.

The AddThis set of social sharing buttons might be the largest of them all in this test, however to be fair here, you’re unlikely to have both the AddThis buttons AND the other buttons separated on your pages.

So looking at the results as a whole, an aggregated tool such as AddThis (which is free) could offer a huge benefit to your website visitors when compared to loading each social sharing button separately.

Questions for You

For me personally, I’m dropping the stumble upon sharing button, but keeping the others on this site until I have the spare time to look at adding an aggregated option in combination with the ShareBar features as I’d need to style it heavily to get it to appear how I would like it to appear (vertically and horizontally).

So my questions for you are:

Did you know these buttons add considerable page weight to your website pages?
How many sharing buttons do you use?

Your Invitation to ‘Connect’ with Matt

September 7, 2011/by Matthew Ogborne

I do not run a ‘product’ based company. Doing so would cloud the line between consultant and competitor. As such I am able to uniquely leverage 10 years of experience over two software providers. that of many past & present clients, to adapt, mould processes and drive results to suit your unique business requirements.

There are a number of online channels out there that are all aimed at keeping people in touch, I’d like to virtually ‘connect’ with you and there are a couple of ways you can do so.

Note: I would have included a video with this to make it more personal, however its out on loan currently.

I’m a big LinkedIn fan, its like the adults version of Facebook.

You can connect me here http://uk.linkedin.com/in/matthewogborne

Twitter

I have a few Twitter accounts, the main one I use is @MatthewOgborne and the original one is @LastDropofInk and I monitor them both most days. Also you’ll see specific messages on each account too.

YouTube

As you may have noticed, there is a distinct move on my part towards using video content more and mopre here. Its a very personal medium and you’ll literally be seeing a lot more of me!

You can subscribe to my YouTube channel here http://www.youtube.com/user/matthewogborne

Google+

I must admit, I’ve not paid Google+ much attention yet, mainly because I am focused on other sites. However the messages you’ll find here from me are both personal & business related.

Facebook

I’m also on Facebook or rather this site is.

You can find the LastDropofInk Facebook page here, I need to update it after the design change here and will be doing so later this week.

RSS & Email

Did you know that you can have the latest posts delivered straight to your inbox using Feedburner, a free Google App? No, well you do now!

Go to http://feeds.feedburner.com/TheLastDropOfInk and hit “Subscribe with Google”.

Also I have an ongoing mailing list, you can subscribe at the top of this page on the right. I keep communications to a minimum and tend to use it to grab feedback before a large article or event, like the Webinar I held last week.

You can of course just interact by leaving a comment on an article here that you’ve liked, if only yo say “hi”.

That’s it, I look forward to ‘connecting’ with you!

Matt

Skip Google & Microsoft, Will eBay Buy Twitter?

March 2, 2011/by Matthew Ogborne

After reading an interesting article titled ‘Why Google Will Buy Twitter‘ where Douglas points out that it could be prime buying material for not only Google, but Microsoft too. But I’m wondering, what benefit could there be if eBay were to pick this up?

Google & Microsoft

Douglas rightly points out that Google Wave and Buzz are complete flops. Wave had its strategy wrong and Buzz was hammered due to privacy issues in the beginning. Where-as Balmer at Microsoft is really going for it with Bing and has pockets deep enough to pick up a few high profile businesses.

Capacity Issues

While Microsoft & Google might appear to be prime technology based companies to solve the whale issue (a big whale appears when its over capacity, annoyingly quite often too), eBay has immense practical knowledge itself with deploying its platform over some +35 countries, +80 million users and dealing with some insane amount of new listings each day.

There was a time when eBay was quite flaky, we used to dread Friday mornings and that was nearly always our morning off. Something was always being updated and something nearly always didn’t work that morning before 12. But thats long gone now.

So what could they do with Twitter?

Assuming that eBay can leverage their knowledge to solve the the whale issue, this does give them a standpoint that they’ve not had before. They have access to an huge audience of users that work on real-time data.

Maybe its a side entrance to Facebook, B2B users, a different way of communicating directly with buyers. I’m not sure why it feels right, but it does.