What the heck is an eSpot?

eSpot-SpainNo, I am not talking about a municipality in the comarca of the Pallars Sobirà in Catalonia, Spain. (see here if that’s what you are looking for). However, on that page is actually a really good picture of what an eSpot in the sense of WebSphere Commerce is. Think of a place on a web page, a “spot” if you will, that has a boundary and takes up a rectangle in that page. Just like Espot does in the boundaries of Spain, an eSpot is a piece of real-estate that can be controlled by business rules – which are defined by a business team, not the IT staff. Content like HTML, text, pictures, Flash, product recommendations, category recommendations and pretty much anything else web related can exist there.

So let’s get started. I have written about eSpots many times and I even created a video on YouTube that shows how to get content into an eSpot using the business user tooling Management Center – check out that seven minute video here. Just like the map of Spain, if you look at the image below the home page of the starter store, Aurora, has 9 eSpots on it. This means for every rectangle you see in that image a business user can assign content there using the rules engine. The rules engine is a drag and drop rule flow that is very easy to follow (that’s next).

aurora-layout

The rules can be used for all visitors to the site, which would be the default content for any given spot or you could use precision marketing to place content in the spot under defined conditions. Here is a simple web activity that defines the content to be used for a high roller customer segment – meaning, if you are logged into the store and you are in the “high roller” segment you would see this content:

dynamic_segments_ad

That rule essentially reads like this:

  • For the eSpot – “HomePageRow2Ads”
  • And the shopper is in the “High Roller” customer segment
  • Place the “High Roller 10 percent off!” advertisement in this spot

Pretty simple right? Well, that is a very basic rule and you will most likely have multiple conditions in a single web activity or layer multiple web activities. You read that correctly, you can actually layer these rules on top of each other and the one that has the highest priority with a satisfying condition wins! The business tool even allows you to preview your site and look at what eSpot won out using the helper buttons on the preview screen. When you use Site Preview you get a screen that looks similar to the screen below. With Site Preview you can also view the site “as a segment”. Once again, very powerful feature allowing the marketing team to clearly see how the site is going to be viewed by a particular customer segment before committing to the production site.

I can then press the “Show Marketing Spots” button to get a grid view of the different spot on the page.

site-preview

I can then click on one of the I’s and see the rule selection logic:

site-preview2

 

I am not going to dive on that screen but it is a real life saver for the marketing team because if you have a complex rule system you can figure out why a particular content is showing.

Let’s dive a little bit on the technical side of an eSpot. What does the code look like? Here is the HomePageRow2Ads eSpot code on the home page:

<%out.flush();%>
     <c:import url="${env_jspStoreDir}Widgets/ESpot/ContentRecommendation/ContentRecommendation.jsp">
        <c:param name="emsName" value="HomePageRow2Ads" />
        <c:param name="numberContentPerRow" value="1" />
        <c:param name="catalogId" value="${catalogId}" />
        <c:param name="errorViewName" value="AjaxOrderItemDisplayView" />
     </c:import>
 <%out.flush();%>

So you will notice a couple of things about this snippet of code. An eSpot always starts with an import of the widget that is to be used for the spot. When designing your page you should decide what “kind” of content should be in this area – are they products, images, flash, a scrolling list, etc. Then the business user simply assigns the relevant content.

A quick tip: You could actually copy this entire block of code to a new JSP and change the “emsName” and you essentially defined a new eSpot.

The full list of widget types can be found in the development environment under “Widgets/ESpot”. Out of the box you will see this:

  • CategoryRecommendation
  • ContentRecommendation
  • IntelligentOffer
  • ProductRecommendation

You can of course extend these base types or even create your own eSpot type.

Hopefully this was helpful and you can see the power of eSpot technology from a business and content management perspective.

Short URL: http://bit.ly/Y8NtdB

10 thoughts on “What the heck is an eSpot?

  1. Hi Bob!

    Nice post!

    I lost the numbers of how many times the spot activity screen in Store Preview saved my life!

    When Business users figure out the power of eSpots technology, they see that the sky is the limit!

  2. Pingback: Taking WCS to the edge with Akamai (Or other CDN solution) | Posts & Pugs!

  3. Hi Bob

    How do I track the content of an espot in the DB…? i.e. how to find out the table that’s reflecting in the certain espot…

    Great videos, you make it look pretty simple. You should write a book on WCS. Not much of a resource out there, you certainly can fill in the gap quick.

    Thanks

    • Thanks! You can right click on an eSpot name in the eSpot listing and click “Show Activities”. This will show you all content for a specific eSpot which you can view in list mode or calendar mode.

  4. Bob,

    Is there a way you can create an eSpot whose layout is dynamic ? Currently we have an ESpot which is fixed in size 190×100 and the content is something business can fill using Management Center. Is there a way we can give our business that option to even control the size of that eSpot place holder.. So if business wants to put a contect of size 100×50, then the whole page will shrink and fit accordingly intead of putting a content of size 100×50 and dsplaying white spaces for rest of the real estate area?

      • Do you know what type of code change it is and where to make that code change in general? is it just a CSS change or we have to modify JSP ? Also, is it something thats recommended to let business handle the size and the layout of production environment?

        • It depends on what exactly you want to do. Usually an eSpot is tied to some kind of UI widget which is a JSP fragment. To be honest, most people use a content management system for this and have a generic eSpot widget that lets the CMS system do whatever is defined in the content. So while you can customize management center to allow the business user to control some of these things I would recommend an integrated CMS solution for this type of thing. Similar to my post about Coremedia.

  5. Pingback: Finding eSpots in WebSphere Commerce | Bob's Blog

Leave a Reply