Author Archives: Toby Gutierrez

About Toby Gutierrez

Solutions Architect | 2015 - 2019 Sitecore Technology MVP

FieldRenderer and EnclosingTag property

So I was working on a sublayout earlier today and I ran across a piece of HTML that made me say, “Hmmm…, what is the best way to tackle this situation”?  I had the HTML below to work with for the “Page Title” and “Sub Title” fields that were to be simply rendered in a FieldRenderer control.

<h1>My Account <small>Manage your account online</small></h1>

The title “My Account” would always exist but the “Manage your account online” in the <small> element would be optional for the Content Editor to use to display sub-titles.  Well, I am a programmer who likes to leave no markup behind so I quickly remembered the EnclosingTag property of the FieldRenderer that made perfect sense in this situation.  Below is the markup I used to pull in the fields:

<h1>
<sc:FieldRenderer runat="server" FieldName="Page Title" ID="frPageTitle"></sc:FieldRenderer>
<sc:FieldRenderer runat="server" FieldName="Sub Title" ID="frSubtitle" EnclosingTag="small"></sc:FieldRenderer>
</h1>

Instead of leaving the <small> HTML element in the markup on the page if the “Sub Title” field is blank, I used the EnclosingTag property to ensure that if there is a value to render it inside the <small> HTML element. However, if the field is blank then don’t display the <small> HTML element either. Pretty slick when you need it sometimes! Happy coding!

Easy deleting of Sub-Items in Sitecore

Ok, so I have been working in the Sitecore Content Editor for 5 years now and it shows that you learn something new every day.  I needed a quick and easy way to delete a bunch of sub-items.  For the longest time I would go through and delete each item from the list.  If the deleted item had sub-items then I would delete that whole folder with the sub-items as well.  However, what if I just wanted to delete the items that were sub-items but not the actual item itself?  This is where I started looking through the Ribbon for the answer and found it.  Take a look at the given Colors item list:

Colors Item List

All you have to do is click on the parent item, which in this case is the Colors folder item, and then click on the Home tab in the Ribbon, and then click on the Delete drop-down in the Operations chunk.  You will then see the action to “Delete Subitems”, click on the icon and you will get a dialog box that says, “Are you sure you want to delete these 11 items?”  Click OK and voila they are all gone but the parent folder is left behind as seen below.  Easy peezy.  Happy coding!

Colors Item List - No Subitems

Fast and easy sorting in Sitecore

You can easily sort items in the content tree by clicking on the Alt button and then dragging the item where you want it and then letting go.  You will then receive a dialog box that says, “Are you sure you want to move ‘XYZa’ item before ‘XYZb’ item?”  Just click the OK button the item will now be there.  For a quick sort this has saved me time and hopefully it will help you.  Happy coding!

Click Tracking with Page Events and Sitecore DMS Engagement Analytics

Today, there is an influx of clients starting to use and maximize the capabilities of the Sitecore DMS (Digital Marketing System).  When the true capabilities of the DMS are realized is when you can speak to your clients with passion about how much impact the DMS can have on their business decisions later down the road, which can result in a large ROI.  In addition, your clients will be amazed at flexibility and how easy it is to set up the DMS for subjects such as personalization, campaign tracking, A/B testing, multivariate testing, and so on.

Recently, I have had a couple of clients want to tie in the clicks on their website to their Engagement Analytics report data to understand click tracking behavior of their website visitors.  As a universal solution, you can use JavaScript, a Web Form, Page Events, and the Sitecore API to tie this all together for your clients.

Page Events

Page Events are located here in the Sitecore content tree: /sitecore/system/Settings/Analytics/Page Events.  Content Editors can create as many Page Events as they so choose.

Sitecore Page Events

Sitecore Page Events

In addition, this also applies to Goals, which are located here in the Sitecore content tree: /sitecore/system/Marketing Center/Goals.  Goals are based on the Page Event template and Content Editors can create as many Goals as they want as well.

Sitecore Goals

Sitecore Goals

Whether to use Page Events or Goals for click tracking is a matter of preference but I prefer to use Page Events.  The reason is Goals to me should be used for Conversion activities such as in the example above in Sitecore Goals, “Added Funds To Account”, where this is truly seen as a goal reached.  I see the Page Event in more literal terms, an event, in this case “click”, that happened on a page and that makes sense to me.  However, feel free to mix it up as you see fit with your solution.

Implementation Basics

The first thing you will want to do is create a JavaScript function in an external .js file that is added to the layouts in your Sitecore solution.  This function can be called “TrackClick” or any other meaningful name that you wish to give it.  This function will be called when the “onclick” event is raised on the client-side.  Page events are triggered by their page event name so at a minimum, you must pass in the Page Event name to your JavaScript function.  So the TrackClick function in the “onclick” event would look like this: TrackClick(“Begin Transaction”) assuming that you wanted to trigger the “Begin Transaction” Page Event above in Sitecore Page Events.

Once you have your function in place you will want to make an AJAX call to a Web Form to post the data.  Take a look at the following for more information on making an AJAX call using JavaScript. Using JavaScript versus jQuery or any other library is so that it keeps your tracking solution universal for every client regardless of what JavaScript library they are using.

The Web Form will need to be setup to get the query string values that were passed in from the TrackClick client-side method OnPageLoad.  Ensure the Page Event name is present then you will want to create a PageEventData object and set the properties of the object with the your parameters.  Lastly, you will want to Register the PageEventData object with Engagement Analytics.  Keep in mind that if you have marked the Page Event as a Goal then your PageEventText will show up in the Analytics Reports.  However, if it it set to a failure or system event then the PageEventText will not be there with the registered Page Event in the Analytics Reports.

Take a look at the following Sitecore documentation for registering Page Events with Engagement Analytics.  You will also see in the documentation that you can set more properties of the PageEventData object that will show up in the Engagement Analytics reports once registered.

Conclusion

Now, you  have a universal click tracking solution for any client that is configurable and maintainable by the Content Editors.  All they have to do is go in and create a Page Event and then create and/or modify the onclick event in a link in a field.  This also works for developers as well to get around creating server-side code to handle a server-side click event.  For example, instead of creating a server-side click event to handle the click tracking, now you can consider a client-side solution, which may speed up your coding activities.  Happy coding!