Experience Sitecore ! | February 2017

Experience Sitecore !

More than 200 articles about the best DXP by Martin Miles

How to make Content Editor search by plain GUIDs without braces and dashes? (part 2)

In the first part of this story I demonstrated how to create an extra search pipeline processor to search by plain GUIDs (those without dashes and curly braces). Now it a good time to achieve the same functionality by another approach.

So, how actually values are coming into search pipeline? While debugging I came across the method TreeSearch_Click - the one was top method from backend call stack (Sitecore.Client.dll) so I tried to find where on frontend it is being called from.

It was called from <WEB_ROOT>/sitecore/shell/Applications/Content Manager/default.aspx file, right by inline script:

javascript:if(event.keyCode==13){var result = scForm.postEvent(this,event,'TreeSearch_Click',true);scContent.fixSearchPanelLayout();return result;}

That code runs by hitting enter on search textbox, there's also similar handler for clicking magnifier icon:

javascript:var result = scForm.postEvent(this,event,'TreeSearch_Click',true);scContent.fixSearchPanelLayout();return result;

In both cases we are POST-ing javascript this that refer to a calling element. So, obviously, if somehow intercept that value - it will be possible to do manipulation on it right on the DOM, and changes would be reflected by UI immediately. That is something missing at part one of this story. Doing that before call to postEvent will post already updated value.

So I ended up with modifying default.aspx by adding a pre-post function to check whether the value is a plain GUID and format it appropriately in that case (I admit I am not the best frontend developer in the world so that implementation could be way better):

onkeydown="javascript:if(event.keyCode==13){ verifyPlainGuid(this); var result = scForm.postEvent(this,event,'TreeSearch_Click',true);scContent.fixSearchPanelLayout();return result;}"

and for icon handler

onclick="javascript:verifyPlainGuid(this); var result = scForm.postEvent(this,event,'TreeSearch_Click',true);scContent.fixSearchPanelLayout();return result;

calling the following javascript function as defined:

function verifyPlainGuid(parameter)
{

    if (parameter & amp; & parameter.className == "scSearchButton") {

        var input = parameter.parentElement.parentElement.parentElement.parentElement.children[0].children[0];
        substituteRegexIfMatches(input);
    }

    if (parameter.id == "TreeSearch")
    {
        substituteRegexIfMatches(parameter);
    }

    function substituteRegexIfMatches(inputElement) {

        var shortGuidRegexPatterns = '[0-9a-fA-F]{8}[0-9a-fA-F]{4}[0-9a-fA-F]{4}[0-9a-fA-F]{4}[0-9a-fA-F]{12}';

        if (inputElement.value.match(shortGuidRegexPatterns))
        {

            var plainGuid = inputElement.value;

            inputElement.value = "{" + plainGuid.substring(0, 8) + "-" + plainGuid.substring(8, 12) + "-" + plainGuid.substring(12, 16)
            + "-" + plainGuid.substring(16, 20) + "-" + plainGuid.substring(20, 32) + "}";
        }
    }
}

That's it - all the changes and it works even better. So, let's compare part 2 against part 1:

Pros:

  • does not modify either \bin folder or configuration, there's no app pool recycle happening
  • no inclines into pipelines, GUID transformation logic runs only when indeed required, not on each run
  • runs at frontend and do not interfere backend
  • modified GUID is reflected at searchbox immediately

Cons:

  • required modification of original sitecore-shipped file (default.aspx)
  • this file tends to changes rather frequently

For all updates (versions) of Sitecore 8.2 - download a package

If you're on Sitecore 8.1, you may need to manually substitute default.aspx located at <WEB_ROOT>/sitecore/shell/Applications/Content Manager folder:

Sitecore 8.1 update 3 - link
Sitecore 8.1 update 2 - link
Sitecore 8.1 update 1 - link
Sitecore 8.1 initial release - link

P.S. What can be done even better? I think, Sitecore should add this functionality to their future versions, as it covers one of the quite frequently used case for us. Ideally, while searching by short GUID it should return Direct Hit result if the item with such ID exists, along with other results from content search.

Sussex Sitecore UserGroup - 22 March 2017


What's on? Finally I have overcome all hardships on arranging with the venue, sponsorship etc. and am proud to announce the first Sussex Sitecore User Group!

When does it happen? It will take place on Wednesday 22nd of March in Brighton - the heart and largest city of Sussex. One of complexities of finding a meeting place was to find an adequate venue in less than 5 minutes walk from Brighton train station as I realised that most of guests will come from either London, or other parts of Sussex but in any case they will arrive at Brighton station.

How to get there? Brighton is only 1 hour of travel from London Bridge or Victoria station. Direct trains also go there from Kings Cross / St. Pancrass, Blackfriars and Farrington. There will be a train at 17.42 from Victoria, 17.20 from Blackfriars and 17.57 from London Bridge. Please see the train times planner to find appropriate option. And the venue itself is less than 5 minutes of walk from station:


Address: 30 Cheapside, Brighton BN1 4GD (main entrance on Blackman Street)

What is agenda? We are planning to have a traditional Sitecore event with complementary drinks and snacks but with what is more important - very interesting topics plus open discussion.

Any contact? Would you like to present - please PM me on Slack @martin_miles or Twitter @SitecoreMartin.

Please RSVP at the event's MeetUp page so that we have a god idea of numbers.

Looking forward to meet you there!

Got a handy new tool for "finding ends" of presentation items - Rendering Chrome for Components

I have recently started working on a new project with a non-transparent structure. By saying non-transparent I mean non trivial locations for the code and non-matching layout and rendering items to their filesystem counterparts. So I was looking for the convenient way to identify matched pairs.

Luckily I remembered JammyKam presenting something similar at London UserGroup in January 2017 and refereed to his blog in order to find Rendering Chrome for Components package (module - ?). So I will briefly go through his solution show how it helped me and what it does:


  1. Install package as normal
  2. Add a namespace into web.config from /Views folder:
    <add namespace="ForwardSlash.SC.RenderingChrome.HtmlHelpers"></add>
    
  3. Append this to a containers element so that it generates an attribute:
    @Html.Sitecore().ContainerChrome()
  4. Now, if you go to Experience Editor and open View tab, you'll see a new checkbox Highlight Renderings clicking which turns all magic on


Here's the result:


    It works not only in Chrome, as you see I run it in firebug.

    Hope it will help you as much as it already has helped me.

    References:

    - original post by Kamruz Jaman

    - sources on GitHub

    - presentation slides from Sitecore User Group London (January 2017) - 3.5MB