LinkLift control for ASP.NET

First time here? You are looking at the most recent posts. You may also want to check out older archives or the tag cloud. Please leave a comment, ask a question and consider subscribing to the latest posts via RSS. Thank you for visiting! (hide this)

<< Back home from SuperHappyDevHouse Aotearoa | Home | One of the smartest .NET guy in Wellington moves to Subtext >>

LinkLift control for ASP.NET

A few weeks ago I received a message from Valentina Baraldi, the Italian Country Manager of LinkLift, asking me if I wanted to take part in the beta testing of their Text Links.

At the moment they are hitting the Italian, German and Spanish markets, but they are delivering Text Links also in other languages (English, French, Polish and Portuguese)

Text links are a new way to monetize your blog, that should be more targeted then Google AdSense: the most famous company that delivers these kinds of links is text-link-ads. So I decided to give it a try since at the moment my blog doesn't have AdSense, yet.

But they are providing plugins only for a few PHP based CMS (Wordpress, Serendipity, Joomla, Drupal and "plain" PHP) but not for .NET or other platform, so, in order to implement it inside my blog, I had to build a control for ASP.NET.

And this the project I worked on yesterday at the SuperHappyDevHouse at Wellington.

Register for a LinkLift account

If you want to receive LinkLift text ads, first thing you have to do is register for an account, and then "Sell links" .

Once you added your blog you have to get your unique id. Since they rely on sending you a personal plugin with all the parameters already configured there is now way to find your "userId", so, to get your adspace id you have to go the list of all your pages, click on the "Download XML file" link and copy the url for it. The url of the xml file is in the following format:

http://www.linklift.it/external/textlink_data.php5?adspace=<adspaceId>&dl=1&

The <adspaceId> is what you need to configure the user control and get your links.

Install LinkLift.NET

Download LinkLift.NET, and copy the files into your web application. The zip file contains 3 files:

LinkLift.dll, this must be copied to the bin folder of your web application
LinkLiftTextAds.ascx, this is the web user control, and must copied inside your website
LinkLiftTextAds.css, the stylesheet with the CSS styles for the ads.

Add LinkLift.NET to your skin

Let's see how to add the LinkLift.NET control in a Subtext skin:

1 - Copy files on the server

Copy the LinkLift.dll file inside the <subtextroot>\bin folder of your Subtext site
Copy the LinkLiftTextAds.ascx file inside the <subtextroot>\Skins\<skinname>\Controls folder
Copy the LinkLiftTextAds.css file the root of your skin <subtextroot>\Skins\<skinname>

2 - Configure your skin definition

Open your skin definition (might be the skins.config or, if you have a custom skin, the skins.user.config), and the line marked in bold:

<SkinTemplate ....>
  <Scripts>
    ...
  </Scripts>
  <Styles>
    ...
    <Style href="linklift.css" media="screen" />
    ...
  </Styles>
</SkinTemplate>

3 - Add the control to the skin

Next (and last) step, edit the PageTemplate.ascx file, adding the reference to the LinkLift.NET control so that the Text Ads are displayed in all the pages of your blog.

Import the control at the top of the file:

<%@ Register TagPrefix="uc1" TagName="LinkText"
        Src="Controls/LinkLiftTextAds.ascx" %>

And then add the control where you want the links to appear in all your pages. I added it just before the main content region so it is displayed just under the header, but you might want to add it in the sidebar:

<uc1:LinkText id="ll" runat="server"
  Domain="www.linklift.de"
  FileName="~/Images/<blog_yourdomain_ext>/LL_<temporaryfilename>.xml"
  Adspace="<yourAdspaceId>"
  CheckAfter="1440" />

There a few properties you can set:

Domain: is the host name of the server you want to get the text links from
Filename: is the name of the file that will be created on your server to locally cache the link definition
Adspace: your unique identifier, the one retrieved during the registration
CheckAfter: duration of the local cache specified in minutes. After this time has passed the control will update the text link definition retrieving a new file from the server
WebRequestTimeout: timeout in milliseconds for the request to the server (not in the snippet above, and defaults to 7sec)

4 - Customize the style of the ads

Optionally you may want to change the style of the ads, for example changing the color of the text, or displaying 4 links per row instead of two as I'm doing now.

This is the default style:

   1:  ul.linklift

   2:  {

   3:      margin:2px 2px 2px 0;

   4:      padding:2px;

   5:      width:100%;

   6:      overflow:hidden;

   7:      list-style:none;

   8:      border:1px solid #00704A;

   9:      border-spacing:0px;

  10:  }

11:

  12:  ul.linklift li

  13:  {

  14:      width: 48%;

  15:      display:inline;

  16:      float:left;

  17:      clear:none;

  18:      padding:1px;

  19:  }

20:

  21:  ul.linklift a

  22:  {

  23:      line-height:140%;

  24:      font-size:12px;

  25:  }

For example, if you want to change the number of links per row change the width value at line 14: 50% shows 2 per row, 100% one per row, 33% 3 per row, 25% 4 per row (mine is 48% because I've to take into account also a few pixels of padding and margin around)

Or to change the color of the border of the box change the value at line 8, or the set the color of the text add a color attribute in the style for the external <ul> element.

LinkLift.NET as Subtext plugin

I'm also working at a plugin version of this control, that will be shipped as part of the Subtext 2.0 download later this year. It will store the links inside the database (not as file) and will allow an easier customization of the appearance.