NuGet Button v0.2

Recently I had released the first public version of the nuget button. It was a great start but still lacked some cool features that I wanted. So with this v0.2 release, it will address some of those lacking features.

Make sure to change the javascript url to the new version.

<script type="text/javascript">
    (function () {
        var nb = document.createElement('script'); nb.type = 'text/javascript'; nb.async = true;
        nb.src = 'http://s.prabir.me/nuget-button/0.2.1/nuget-button.min.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(nb, s);
    })();
</script>

Clickable links

Many of us have been pleased by the ease nuget has brought to the .net world on package management. But for me, there has also been one more + nuget has brought into my life. It has also allowed me to easily find the source code of the project. (Next time you install a package, make sure to check out its source code too. You are gonna a learn a lot just looking at others source code).

Starting from v0.2, you can now click the package name and go the the official nuget page of the package. Here is the sample effect when you hover over the package name.

<pre class="nuget-button">Install-Package Facebook</pre>

The code is exactly same as in v0.1 thus maintaining backward compatibility. The nuget button is smart enough and generates a link to http://nuget.org/List/Packages/SimpleJson

But what if I don’t host my packages in nuget.org?

The easiest workaround would be to disable the link feature in nuget button.

<pre class="nuget-button" data-nugetbutton-link="false">Install-Package SimpleJson</pre>

Add a new data- property called data-nugetbutton-link and set it to false.

Great! But I want custom links.

No problem. That’s been thought of already.

A bit of history first … (As of this writing nuget doesn’t yet support pre-releases (beta release) packages, though it has been planned for v1.6.) We release Facebook C# SDK quite often, but to maintain the stability of the code, we mark some of the release as beta release and don’t publish it in nuget.org as there are lots of live facebook apps using it. But due to the popularity of nuget, the first question we get on every release is how do I get this pre-release package from nuget? My answer was, it’s not in nuget as its not a stable release and we don’t want users to just start pulling beta releases and using it in their production and nuget doesn’t support pre-release packages. Overtime I was tired of answering the same reason again and again and I simply set up a pulic nuget server that others could add. But the problem is you get different url which is not hosted in nuget.org. So here is how to get over that problem.

<pre data-nugetbutton-link="http://nuget.prabir.me"  class="nuget-button">Install-Package Facebook</pre>

Notice that it is the same data-nugetbutton-link that we used before, but this time its set to a url instead of false. This allows you to point to your own custom nuget servers or a github page.

Custom size

This one is especially for those who writes blog like me. You would most likely want to match the theme of nuget button with your own blog theme. I don’t have plans to allow customizable color - black nuget button is supposed to be a brand ;), but you can definitely set the size of the nuget button using em value for font-size – pure html again.

<div style="float:left; font-size:0.5em"><pre class="nuget-button">Install-Package FluentHttp.Core</pre></div><div style="clear: left"></div>

The above code not only sets the size, but also takes only the required length for your package.

Here are some live example of the nuget button v0.2.

Full width (default)

Install-Package FluentHttp.Core

Auto width

Install-Package FluentHttp.Core
 

Auto width with smaller size

Install-Package FluentHttp.Core
 

For more live samples and new features make sure to check out http://s.prabir.me/nuget-button/0.2.1/nuget-button.htm

blog comments powered by Disqus