Getting started with the OpenLinkz search widget - read these posts and get up and running

Setting up OpenLinkz OpenLinkz Simplified Changing Appearance of Links OpenLinkz Cheat Sheet

Again! More cross-domain problems with stock quote widget

I had a bunch of trouble toward the end of last week with my live stock quote widget that retrieves stock prices from Yahoo every 30 seconds throughout the day.

Having run into problems with the WidgetBox proxy service that allows widgets to retrieve data from other domains I had converted the widget into a Google Gadget. I then wrapped the Google Gadget within the WidgetBox widget so all those folks who were using the WidgetBox widget wouldn't be left with a non-functioning widget.

Last week, the Google Gadget began acting up. Using FireFox and Firebug, I was able to determine that the response from Yahoo in a simple CSV format was still functioning properly but the callback wasn't being executed within the gadget to actually read the response. I use the simple _IG_FetchContent function to execute the request and process the response.

In my experimenting, I discovered that using a Yahoo Pipe and rendering the output as JSON worked perfectly. Still, this seemed like too much overhead for such a simple request.

As it turns out, I had to make an adjustment to the URL at Yahoo that is used to request the stock price data. Where previously I used the following URL:

http://finance.yahoo.com/d/quotes.csv

Now I have to use this URL:

http://download.finance.yahoo.com/d/quotes.csv

If you type these URLs into your browser (with the requested symbols and request parameters), both of them would return the requested data. I can only think that some kind of redirection was taking place on the Yahoo site that made the Google Gadget function reject the response.

In summary, it seems these cross-domain calls can be awfully touchy. I apologize to any users who experienced an outage as a result of the problems in this widget. Hopefully, both Yahoo and Google will avoid making any changes for a while.

Posted by TradeRadarOperator at 10/20/2008 10:18:00 PM 0 comments  
Digg!



How I used AdSense to debug my blog

I recently installed a widget on my blog and it turns out that it was causing intermittent problems in Internet Explorer.

I was able to detect this situation because I had several AdSense ads in various positions on the page. I have a link unit at the top of the page, a regular banner/text ad a little further down the page, a skyscraper in a sidebar and another link unit at the bottom of the page.

I also use Google Analytics to track traffic to the blog. The Analytics code is installed at the bottom if the page. Analytics showed what seemed to be a falling off of traffic but there were no clues as to why.

Looking at the AdSense reports, however, some hints began to emerge. When reviewing the performance of the various ad channels (each ad is set up as its own channel), anomalies began to appear. Lots of impressions for the ad at the top of the page, 20% less impressions for those ads further down the page. This tipped me off that the page was not rendering completely.

Knowing that the page was not rendering completely suggests that some active component on the page was hanging up the browser. Some testing in both FireFox and Internet Explorer soon narrowed the problem down to IE. Then I began to eliminate the most recent widgets added to the page (there weren't many) which soon led me to the problem.

In summary --

It doesn't hurt to put a few AdSense ads in various positions on your blog or web pages, especially unobtrusive link units. It is important, though, that each ad be set up with a separate channel. The AdSense reports can then be used to ensure that the pages are rendering completely. And, of course, you can also more precisely monitor how the various ad positions are performing for their primary purpose as ad inventory.

With all the Javascript that many blogs and web pages are carrying, it is not unusual for certain sections of pages to encounter problems. The fine grained reporting provided by AdSense provides a good way to monitor and troubleshoot your pages.

Posted by TradeRadarOperator at 9/28/2008 08:45:00 PM 0 comments  
Digg!



Blogger not compatible with AdSense managed ads?

Lately I have been switching the standard AdSense ads to the new managed ad units on both of my blogs (this one and blog.trade-radar.com). Some of these ads are coded directly in the blog template rather than inside a Blogger Gadget or Widget. A good example of where this kind of coding is required is the sliding ad panel that rises from the bottom of the browser window.

I have also been rolling out a redesign of the TradeRadar blog template. The redesign has required me to make a number of other kinds of changes directly to the template code itself.

Just this week, however, it seems like Blogger has started evaluating Google AdSense code and making undesired changes whenever I save the template.

This is actually the second phase in an aggravating series of events related to inserting AdSense code directly into the blog template.

Problem #1 --

The first problem I encountered had to do with the symbols for Javascript comments. When copying the ad code from the Google AdSense site, the variables that define the ad parameters are surrounded by Javascript comment symbols. Leave the comments in and the ad doesn't work. Take the comments out and the ad works fine.

This seems to be a Blogger situation only. Paste the standard ad code into any web page and it works fine with no changes. Paste the ad code into a Blogger template and it doesn't work.

The solution I have used to date is to delete the comments. Unfortunately, this now leads to the second problem.

Problem #2 --

Blogger doesn't recognize the format for managed ad units. If the ad unit code is surrounded by comment symbols, Blogger will not mess with it. As described above, however, I have found that I needed to remove the comment symbols in order to make the ad code work.

When the ad unit code is not surrounded by comment symbols, Blogger interferes with the code, trying to add a value for the AdSense publisher ID into the google_ad_client variable. This, of course, messes up the ad completely.

The workaround --

I took the Javascript variables that the managed ad needs and saved them into a Javascript file. I uploaded the file to one of my web sites. Then I used a simple script tag to retrieve the file immediately before the Google script tag that activates the ad.

This fixes the problem for now. Of course, it requires that you have your own domain where you can store your Javascript file.

Is anyone else encountering this problem? Do you have a different or better workaround? Feel free to leave a comment and let us know how you are handling this situation.

Posted by TradeRadarOperator at 9/01/2008 09:35:00 PM 6 comments  
Digg!



How to fix problems with Blogger and the AddThis widget

I have using Blogger as my blogging platform for over a year and a half and I had implemented the AddThis bookmarking widget within each post. I recently upgraded to the new drop-down widget. Suddenly, I began to see strange things happen to the layout of certain blog posts.

As it turns out, any post with an apostrophe or single quote within the title causes a problem with the AddThis Javascript. Basically, the title of a post is stored as a Javascript string variable. If there is an apostrophe or single quote in the middle of the variable, it generates an error related to unterminated strings. Unfortunately, it is not so uncommon to want to use apostrophes.

Luckily, it is easy to fix this by adding one line of code to the Javascript supplied by AddThis.

This is the way the code looks when I get it from AddThis (I have added some carriage returns to enhance readability):


addthis_url='<data:post.url/>';
addthis_title='<data:post.title/>';
addthis_pub='traderadaroperator';

First, change the single quotes around '<data:post.title/>' to double quotes as follows:

addthis_title="<data:post.title/>";

Then add the following line of code:

addthis_title=addthis_title.replace(/\'/g,'');

This approach removes the apostrophe in the title string.

This is not a perfect solution, but it will prevent your titles from being cut off when bookmarking. And most importantly, it won't cause any problems with your page layout. Just be sure not t0 use any double quotes in your blog titles.

Posted by TradeRadarOperator at 8/29/2008 04:36:00 PM 1 comments  
Digg!



How to embellish the OpenLinkz ad slider

If you have obtained the code for your ad slider here at OpenLinkz using our wizard, then you are aware that the ad panel is essentially a plain rectangle in a single color with an ad in the middle, a text message on the left and the link for closing the panel on the right.

It is quite easy to embellish the ad panel by adding a border or a background image. Here's how it's done.

In the CSS style section, look for the "bottomBanner" id.

You can add either one of the following lines or add them both:

border-top: 2px solid black;

background: top repeat url("http://myWebSite.com/myImage");

The first line would add a black border at the top of the ad panel that is 2 pixels thick. You can, of course, vary color and border thickness as you desire. One thing to remember, however, is you need to add the thickness of the border to the ad height. For our example, in the script section you would need to modify the following line of code:

var sliderDivHeight = 68;

changing it from its default value of 68 pixels to 70 pixels:

var sliderDivHeight = 70;

The second line would take an image of your choice (myImage, in this example) and repeat it across the ad panel. This would be appropriate if you are adding a colored gradient effect to the ad panel. Omit the "repeat" keyword and the image will, by default, appear once at the left end of the ad panel.

Note: for those of you who are installing the code in a Blogger template, you may find that using the "top" and "repeat" keywords caused the image to not appear at all! Trying removing the keywords and it will fix this problem.

Test, test, test --

Using these techniques, you can soften or embellish the effect of seeing the ad panel sliding into sight. Be sure to try an A/B test to determine if you get more clicks with or without the embellishments. Sometimes subtle changes can have surprising results when trying to make money online.

Posted by TradeRadarOperator at 8/20/2008 08:45:00 PM 0 comments  
Digg!



Sliding ads really deliver - be sure you have the right ad strategy

I have had the OpenLinkz ad slider running on my other blog, Trade Radar, for a few weeks now. I am stunned at how well it is performing. The click through rate is more than twice that of any other ad on the site. I am just running a simple Google AdSense 468 X 60 half-banner but it gets plenty of action.

There are issues involved that web site or blog owners need to address when using sliding ads.

First, decide if you are comfortable displaying a sliding ad. Would you consider it too obtrusive and bothersome to your readers? I worried about this so I opted to only display the ad one time, on the first page viewed by the reader. Subsequent page views will not trigger the appearance of the sliding ad. Also, don't pick an ad that is too big.

Second, you need to carefully pick the appropriate ad to display. It needs to load quickly so the movement of sliding ad panel isn't "herky jerky".

Third, another aspect of picking the best possible ad is related to the payment method. This ad will definitely get clicked so you need to select an ad that has a reasonable Pay-per-Click rate. Since the sliding ad may start stealing clicks from other ads on your page, you need to carefully evaluate the best approach to maximize your earnings.

There are a number of blog posts floating around that say you should minimize the number of AdSense ads on a page in order to get the best PPC rate available for the type of content on that particular page. This is also something you should take into consideration if you choose to run AdSense in your sliding ad.

Try our wizard at OpenLinkz.com to generate the code for your own sliding ad panel but carefully consider how you will use it.

Posted by TradeRadarOperator at 8/12/2008 09:47:00 PM 0 comments  
Digg!



Corporate gatekeepers get wise to widgets

It's come to my attention that some large corporations are configuring their firewalls to block widgets. Right now, I know that widgets from WidgetBox have been blocked.

I suppose it was only a matter of time before widgets were targeted. It is well known that many corporate IT departments are against social networking tools. Sites like Twitter, Plurk, Facebook and Mashable are routinely blocked. Even simple tools like Yahoo! email and Google Docs are blocked. The ostensible reason is that network security teams are working to prevent unauthorized applications from introducing viruses and malware or otherwise compromising internal corporate systems.

Of course, these applications can be big time wasters and it is reasonable for corporate management to want to ensure workers keep their nose to the grindstone.

In the meantime, I believe Google Gadgets are still working on most corporate networks. Does anyone know of any more widget platforms that are being blocked?

Posted by TradeRadarOperator at 8/06/2008 11:16:00 PM 0 comments  
Digg!



How to set up ads after each post in Blogger

For those of you who use Blogger as your blogging platform, you may be wondering how to set up ads after each post.

Blogger allows users to set up AdSense ads after each post. But what if you want to use ads from an affiliate network or ad network of your own choice? And especially, how do you display a different ad after each post when there are multiple posts on the page? Blogger doesn't have a built-in page element that supports that functionality.

This post explains how to do it. If you know a little Javascript, it won't be too hard for you to implement.

First, you need to decide how many posts you want to display on the homepage of your blog. For our example, let's say three posts will be displayed.

We then need to set up a counter that keeps track of which post is being displayed. Blogger will loop through posts until it hits the maximum number that you designated.

Add an HTML/Javascript page element to your blog. Add some script tags to it and implement the code for the counter, initializing it as follows:

var nPostCounter = 1

Create a function that will display your ads and enter it after the variable initialization described above. Our example does it as follows:

function rotatePostAd () {
}

Then add a set of IF statements that utilize the counter to display your ads in sequence:

function rotatePostAd () {

if (nPostCounter == 1) {

nPostCounter++;
} else if (nPostCounter == 2) {

nPostCounter++;
} else if (nPostCounter == 3) {

nPostCounter++;
}

}

Note that the code increments the counter each time a post is displayed on the page.

Then, we need to obtain the HTML or script for the three ads that will be displayed. The trick is to take the statements that cause the ad to be displayed and convert those statements to Javascript document.writeln statements. This is not as hard as it seems. Peter Bromberg has written an article at EggheadCafe titled "Convert HTML/Script to Javascript Include Source". The article includes a converter. Paste the code for an ad into the first text box, click the Convert button and retrieve the document.writeln statement from from the second text box. Then take the document.writeln statement and plug into our function. After doing this three times, our function will look like the following:

function adRotator () {
if (nPostCounter == 1) {
document.writeln('converted code for first ad... ')
nPostCounter++;
} else if (nPostCounter == 2) {
document.writeln('converted code for second ad... ')
nPostCounter++;
} else if (nPostCounter == 3) {
document.writeln('converted code for third ad... ')
nPostCounter++;
}

}

We now have a function that will display a different ad for each post. We now have to call the function from the appropriate place in the Blogger template. Go to the Layout tab in Blogger and click "Edit HTML". Click the "Expand Widget Templates" checkbox. Scroll down to the section that displays the labels for a post. Look for the following line of code:

<p class='post-footer-line post-footer-line-2'>

Just before the end tag for this <p> section, paste the following:

<script type="'text/javascript'">
rotatePostAd();
</script>

That's all there is to it!

Posted by TradeRadarOperator at 8/02/2008 09:36:00 PM 0 comments  
Digg!



OpenLinkz - free sliding ad wizard

This post is to announce our newest widget, OpenAdSlider. This is a sliding panel that can contain an advertisement, banner ad, text links or any other message or image. The panel slides up from the bottom of the browser window and stops as soon as it is fully displayed. This means it does not float across the entire page getting in the way of your content.

This ad panel will not be blocked by pop-up blockers. It is a DIV within the page and, as such, it can house Google AdSense ads that are contextually in synch with your page content.

We have provided a free web-based wizard on the OpenLinkz homepage so you can generate the style sheet, HTML and Javascript necessary to implement the sliding ad panel. You can customize the height of the panel, the background color and the font color. You can plug in any ad code, HTML, Javascript or image code you wish by pasting it into a text box.

If you are worried about overdoing it with sliding ads, you can choose whether you want the ad to display on every page view or only on the first page view of the user's session. Indeed, that is how we have it configured on this blog. In either case, the user can easily close the panel and it will slide out of sight.

We have decided to provide this wizard free of charge. Most other sites require you to pay for a downloaded code generator. Costs range from around $20 all the way up to $125.

We think this sliding ad panel helps you get your advertising message displayed above the fold without being too obtrusive. The sliding action immediately draws the user's eye to the ad content. Try it on the OpenLinkz homepage and see what you think!

Posted by TradeRadarOperator at 7/28/2008 09:26:00 PM 0 comments  
Digg!



Google provides most flexibility for data retrieval

In my work to maintain a widget that retrieves stock quote data continuously throughout the day I have ended up experimenting with several different approaches.

As discussed in my last post, WidgetBox on its own will not provide the required functionality so we migrated to Google gadgets. In working with the Google gadget libraries, I initially used their XML-HTTP request as a work-around by preventing the test for an XML structure in the response. Eventually, I found that this approach was actually not as reliable as I had hoped. In looking for an alternative, I found that Google also had a function that retrieves simple text data across domains.

Since the raw stock quote data from Yahoo! is CSV text, this text retrieval function turns out to be the most efficient in terms of speed, being light weight and, most importantly, will run continuously and reliably as long as a user is viewing the page, even if it's all day.

The Google gadget libraries are clearly more flexible and provide someone willing to dig through the documentation greater control and power over the functionality within a widget/gadget.

Posted by TradeRadarOperator at 5/02/2008 10:17:00 PM 0 comments  
Digg!



RSS good for feeds, not for real-time data transfer

I recently wrote about WidgetBox breaking my live stock quote widget by disallowing data in CSV text format when using their proxied XML-HTTP request functionality. (See "WidgetBox tightens up AJAX interface")

As an alternative, I set up a Yahoo! pipe to supply the data in RSS format, which seemed to work well.

The problem is when a person stays on the page hosting the widget in order to watch the quotes update throughput the day. After half an hour or so, the widget stops working. There appears to be some kind of strange caching going on that prevents any data from being returned. I tried the usual work-around: appending in the query string a key/value pair containing a random number but to no avail.

My eventual solution was to create a Google gadget with the same logic that retrieved data from the original source in CSV text format. This gadget was then embedded inside the WidgetBox widget.

With a little fooling around, I was able to pass the user configuration data through the WidgetBox widget to the Google widget and, once again, things seem to be working fine.

The bottom line is that RSS just does not seem to lend itself to continuous data retrieval for applications like real-time quotes. It is hard to be sure exactly where the problem lies but either WidgetBox or Yahoo! or both treat RSS as an information feed, not a raw data feed. As such, the assumption is that one wouldn't want to continuously retrieve an RSS feed as I have been trying to do.

So far, it appears the Google libraries offer more flexibility than the WidgetBox approach but at the cost of more programming effort. For those with good Javascript expertise, however, programming gadgets should not be too hard.

Posted by TradeRadarOperator at 4/27/2008 05:08:00 PM 0 comments  
Digg!



WidgetBox tightens up Ajax interface

We just experienced a major problem with the widgets that retrieve stock quotes from Yahoo finance.

It is fixed now but it was a frustrating experience while I was trying to correct the situation. Here is what I believe happened.

The widgets used a proxied XML-HTTP request via the WidgetBox servers that allows us to retrieve data from the Yahoo domain no matter what domain is displaying the widget. It appears that WidgetBox has tightened up their criteria as to what constitutes a valid XML-HTTP response. We were retrieving plain text, no XML at all, and it stopped working.

Our solution was to create a Yahoo Pipe that retrieved the text-based data and transformed it into an RSS feed. This was done by renaming the fields to comply with the typical RSS structure and then render it as RSS. We had to cheat a little here. The fieldnames that can be used are as follows: title, description, category and link. We mapped our stock data to these four fields. Luckily, the content doesn't matter so we can use these four fields for any data item we wish.

In any case, WidgetBox is happy to pull in the RSS as an XML-HTTP response. We are then able to pick up the data from the nodes in the XML response and display it as needed. Problem solved.

Posted by TradeRadarOperator at 4/23/2008 09:11:00 PM 0 comments  
Digg!



 
Support our sponsors!
Close this ad panelX