SharePoint + jQuery = Stay Here Feature
Fun with jQuery and SharePoint
In my previous post I showd how to create a slideshow in SharePoint with the help of jQuery and the Cycle plugin. Yesterday someone asked me for a feature that takes care of opening all external urls in a new window. That makes sense doesn't it. You do not want visitors to leave your SharePoint site to soon. You want them to Stay Here. And with our jQuery feature in place it's a piece of cake so I decided to create the motion10 Stay Here feature.
The code
All this feature needs is a little javascript. This script must select al hyperlinks on the page that do not have the target attribute set and a different host than the current host. When we have the selected links we need to add the target attribute and that's all. So here's the script.
$(function() {
$('a').filter(function() {
return !this.target && this.hostname && this.hostname !== location.hostname;
}).each(function(){$(this).attr("target", "_blank")});
});How to create a feature
Actually we would like to have this script in all pages of our sitecollection. Hmmmm.... that sounds familiar doesn't it? Again we can use the Delegate Control to add this script to the head of every page. So the script goes to the layouts directory and we create a User Control that just contains a script reference.
<%@ Control="" Language="C#" ClassName="jQueryStayHereControl" %>
<script type="text/javascript" src="/_layouts/jQuery/Plugins/jquery.stayhere.js"></script>
And just like we did with our Cycle plugin we add this control to our elements collection.
<?xml version="1.0" encoding="utf-8" ?>
<Elements xmlns="http://schemas.microsoft.com/sharepoint/">
<Control
Id="AdditionalPageHead"
ControlSrc="~/_controltemplates/jQuery/Plugins/jQueryStayHereControl.ascx"
Sequence="1" />
</Elements>
We must not forget our jQuery dependency though. So in our feature.xml we add an Activation Dependency and that's all.
<?xml version="1.0" encoding="utf-8"?>
<Feature Id="853d13a2-3bbf-411e-b8a5-ef0a30d4636f"
Title="motion10 jQuery Stay Here Plugin"
Description="If you enable this feature all external links on your site will be opened in a new window."
Version="12.0.0.0"
Hidden="FALSE"
Scope="Site"
DefaultResourceFile="core"
Creator="Wesley Bakker"
ImageUrl="motion10/FeaturesIcon.png"
ImageUrlAltText="http://www.motion10.com"
xmlns="http://schemas.microsoft.com/sharepoint/">
<ActivationDependencies>
<ActivationDependency FeatureId="f805f632-a321-435c-9d13-025454e3fd5a"/>
</ActivationDependencies>
<ElementManifests>
<ElementManifest Location="elements.xml"/>
</ElementManifests>
</Feature>
By activating the feature the user control is added to the head of our page which loads the script which in turn makes all of our links to external websites open in a new window.
Please do feel free to download the motion10 SharePoint Solution Pack. It contains all of the source and an installation folder. Oh... and you might find some extra features in there. I'll try to add a new feature every two weeks and update the package. So if you do have some good ideas for features just leave me a comment or drop me an email and we'll se what I can do. I hope my next feature will enable Google Analytics on your site. Busy with that one because I need to add an application page to enable you to configure your Google user account id.
Cheers,
Wes