Nibble

Archive for June, 2008

Why umbraco rocks - no design limitations 3

To continue the why umbraco rocks posts, just look at the diversity of sites running umbraco. One of the great things of umbraco is that you have complete control over what is ouputted. You start with an empty ‘template’ and can add any html you want. You are not forced into skinning (like many other cms systems) but can just mold umbraco around your (x)html templates.

image

image

image

image

image

image

Belgian umbraco meet-up on July 19th 0

Just to make sure we reach as many people as possible.

On the umbraco forum, some people from Belgium started talking about a Belgian umbraco user group.

The idea spread quickly, and voila: we’ve got our first meet-up on July 19th in Ghent. We are looking for more people from Belgium (or Holland or …) to join us and exchange some umbraco experiences. It doesn’t matter if you are a complete newcomer to umbraco, everybody with an interest in umbraco is more than welcome.

We’ll have a couple of fixed sessions, including a demo of umbraco v4, but most of the day will be open space, so everybody can suggest a topic.

We already have several confirmed attendants including:

We will meet at Sint-Lucas where we will have a venue at our disposal the whole day. The starting time will be published later on.

Do you want to join this free event? Post a comment here or on the forum so that we know you are coming.

Adding a language selector to your multilingual umbraco site 14

Create mutlilingual sites with umbraco, there are several approaches in doing this, the one I use the most is to have multiple ‘top level’ nodes (I’ll make a screencast of this in a future post). So for each language you would have a top level node.

The content tree would look like this:

languageselectorcontent

I would like to add a language selector on the site, a dropdown with all languages that will redirect to the selected langauge homepage. How to do this ?

languageselector

I’ll first add a new property to the top level node document type. This will store the text that is displayed in the dropdown.

languageselectordocumenttype

Next step is to create a new xslt file (with macro).

<?xml version=”1.0″ encoding=”UTF-8″?>
<!DOCTYPE xsl:Stylesheet [ &lt;!ENTITY nbsp “&#x00A0;”> ]>
<xsl:stylesheet 
    version=”1.0″ 
    xmlns:xsl=”http://www.w3.org/1999/XSL/Transform” 
    xmlns:msxml=”urn:schemas-microsoft-com:xslt”
    xmlns:umbraco.library=”urn:umbraco.library”
    exclude-result-prefixes=”msxml umbraco.library”>
 
 
<xsl:output method=”xml” omit-xml-declaration=”yes”/>
 
<xsl:param name=”currentPage”/>
 
 
            
 
<xsl:template match=”/”>
<form>
<select name=”langselection” onchange=”loadPage(this.form.elements[0])” target=”_parent._top” >
<option selected=”selected”>– Please select –</option>
 
  <xsl:for-each select=”$currentPage/ancestor::root/node”>
         
         <option value=”{umbraco.library:NiceUrl(@id)}”><xsl:value-of select=”data [@alias = ‘language’]”/></option>      
    
  </xsl:for-each>
</select>
</form>
 
</xsl:template>
 
</xsl:stylesheet>

This will output the html code for the dropdown. The most important part is the for-each loop, wich will loop all top level nodes, add the url of the top level node as a value of the dropdown option and add the content of the language property as the displayed text of the drop down option.

Now you can add the macro to your template, but you’ll also need to add a little javascript.

<script language=“JavaScript”>
 
function loadPage(list) {
 
  location.href=list.options[list.selectedIndex].value
 
}
 
</script>

Creating packages for umbraco, usercontrol that fires as last step of installation 2

Thanks to Per’s packager (which will be integrated in v4) creating packages for umbraco is a very simple thing. The only part that can get a little tricky is if you need to update the database, or one of the config files.

The way to do this is to create a custom usercontrol, and this usercontrol gets fired at the last step of the package installation (you need to set this up in the package.xml file). I’ve created several packages so I thought I would just show the way I did these things.

 

Executing a SQL statement ( to create new tables )

StreamReader reader = new StreamReader(base.Server.MapPath(“/umbraco/plugins/nibble/demo/installer/demo.sql”));
string sqlStatement = reader.ReadToEnd();
reader.Close();
SqlHelper.ExecuteNonQuery(GlobalSettings.DbDSN, CommandType.Text, sqlStatement);

In this sample the statement is stored in a .sql file, then it is just read in and executed.

 

Updating xsltExtensions.config ( for xslt extensions )

XmlDocument document = new XmlDocument();
document.Load(base.Server.MapPath(“/config/xsltExtensions.config”));
XmlNode node = document.SelectSingleNode(“/XsltExtensions”);
if (node.SelectNodes(“/ext [@assembly = ‘/bin/Jesper.GoogleMaps’]”).Count == 0)
{
    XmlNode newChild = document.CreateElement(“ext”);
    XmlAttribute attribute = document.CreateAttribute(“assembly”);
    attribute.Value = “/bin/Jesper.GoogleMaps”;
    newChild.Attributes.Append(attribute);
    XmlAttribute attribute2 = document.CreateAttribute(“type”);
    attribute2.Value = “Jesper.GoogleMaps.Library”;
    newChild.Attributes.Append(attribute2);
    XmlAttribute attribute3 = document.CreateAttribute(“alias”);
    attribute3.Value = “GoogleMaps.Library”;
    newChild.Attributes.Append(attribute3);
    node.AppendChild(newChild);
    document.Save(base.Server.MapPath(“/config/xsltExtensions.config”));
}

this sample will add

<ext assembly=”/bin/Jesper.GoogleMaps” type=”Jesper.GoogleMaps.Library” alias=”GoogleMaps.Library” />

to the /config/xsltExtensions.config file

 

Updating restExtensions.config ( for base )

XmlDocument document = new XmlDocument();            
document.Load(Server.MapPath(“/config/”) + “restExtensions.config”);
XmlNode newChild = document.CreateElement(“ext”);
 
 
XmlAttribute AtAssembly = document.CreateAttribute(“assembly”);
AtAssembly.Value = “/bin/xtraUmbracoStarRating”;
newChild.Attributes.Append(AtAssembly);
 
XmlAttribute atType = document.CreateAttribute(“type”);
atType.Value = “xtraUmbracoStarRating.StarRating”;
newChild.Attributes.Append(atType);
 
XmlAttribute atAlias = document.CreateAttribute(“alias”);
atAlias.Value = “StarRating”;
newChild.Attributes.Append(atAlias);
 
XmlNode permissionNode = document.CreateElement(“permission”);
newChild.AppendChild(permissionNode);
 
XmlAttribute atMethod = document.CreateAttribute(“method”);
atMethod.Value = “update”;
permissionNode.Attributes.Append(atMethod);
 
XmlAttribute atAllowAll = document.CreateAttribute(“allowAll”);
atAllowAll.Value = “true”;
permissionNode.Attributes.Append(atAllowAll);
 
document.DocumentElement.AppendChild(newChild);
 
document.Save(Server.MapPath(“/config/”) + “restExtensions.config”);

this sample will add

<ext assembly=”/bin/xtraUmbracoStarRating” type=”xtraUmbracoStarRating.StarRating” alias=”StarRating”>
    <permission method=”update” allowAll=”true” />
</ext>

to the /config/restExtensions.config file

 

Updating dashboard.config ( to add usercontrols on the dashboard )

XmlDocument document = new XmlDocument();
document.Load(base.Server.MapPath(“/config/Dashboard.config”));
XmlNode node = document.SelectSingleNode(“/dashBoard”);
 
XmlNode sectionChild = document.CreateElement(“section”);
XmlNode areasChild = document.CreateElement(“areas”);
XmlNode areaChild = document.CreateElement(“area”);
 
areaChild.InnerText = “developer”;
 
XmlNode tabChild = document.CreateElement(“tab”);
 
XmlAttribute attribute = document.CreateAttribute(“caption”);
attribute.Value = “Nibble FX”;
tabChild.Attributes.Append(attribute);
 
XmlNode controlChild = document.CreateElement(“control”);
 
controlChild.InnerText = “/usercontrols/Nibble/NibbleFX.ascx”;
 
               
tabChild.AppendChild(controlChild);
areasChild.AppendChild(areaChild);
sectionChild.AppendChild(areasChild);
sectionChild.AppendChild(tabChild);
node.AppendChild(sectionChild);
document.Save(base.Server.MapPath(“/config/Dashboard.config”));

this sample will add

  <section>
    <areas>
      <area>developer</area>
    </areas>
    <tab caption=”Nibble FX”>
      <control>/usercontrols/Nibble/NibbleFX.ascx</control>
    </tab>
  </section>

to the /config/dashboard.config file

New Package - Alphabet Folder 21

After the Date Folder package comes the Alphabet Folder package(couldn’t think of a better name).

Just a handy little actionhandler wich will automaticly place your content (of defined documenttypes) in Alphabet Folders (a bit like you have in the member section). This comes in handy when you have loads of childnodes.

Say that you have this:

A Parent document ( TempFolder documenttype ) with loads of child documents ( TempDoc documenttype ).

image

 

So just import and install the package, last step of the installation will be this screen:

image

It will display all documenttypes you have in your umbraco site. You can choose 1 or multiple, and you can choose to move the existing content over to alphabet folders.

So when I do this with my example( select TempDoc and Move existing content) I will have this situation after it is installed

image

 

Final step would be to sort the content by name

image

So when I create a new TempDoc it will be automaticly placed in an Alphabet Folder ( if the folder of that letter doesn’t exist it will create one).

image

Alphabet Folder: download

This package installs:

- /bin/Nibble.AlphabetFolder.dll (assembly)
- /config/Nibble.AlphabetFolder/AlphabetFolder.config ( config file containing documenttypes which will be placed in alphabetfolders )
- /usercontrols/AlphabetFolderInstall.ascx ( usercontrol that is displayed during install )

Umbraco MVP 2008/2009 2

This is just such a great pat on the back, like Warren mentioned this is a great motivation to keep on contributing to the umbraco community. I’ve got some great ideas for new blog posts and packages. If you have special request for screencasts or tutorials, don’t hesitate to post a comment.

mvpscreen

Codegarden 08 - flash and umbraco 15

I’m back from Denmark and had an amazing week ! First with the retreat and then with codegarden08. For the people who couldn’t make it, you can download my flash and umbraco presentation below.

 

Untitled-1

Presentation: download pdf

Most importing part of the presentation was the release of a new umbraco package. NibbleFX (flash express).

In short: Have an xml driven flash movie you would like to manage with umbraco? This package will do all the work for you, just upload your xml file and documenttypes, templates, xslt and macro’s get created automaticly, you can even import the content.

Check out this screencast ( of a beta version) if you want to see a demo.

Untitled-2

NibbleFX: download

Enjoy ….