Añadir campo a un display template

En este post os explicaré como se puede añadir un campo a un display template.

En mi caso, estoy usando el display template “Item_CommonItem_Body.html” que se encuentra en –>_catalogs – masterpag -display Templates – search. Lo que quiero es añadir un campo personalizado de texto que le he llamado “entradilla” y la imagen del artículo.

Lo primero de todo, es asegurarnos que los 2 campos están como propiedades administradas, para ellos vamos a la aplicación de servicio de búsqueda y lo verificamos. En mi caso, sí que están, lo único que he tenido que marcar “consulta”, “búsqueda”, “recuperar”

search

Una vez sabemos que las propiedades administradas están correctamente configuradas, nos vamos a modificar el display template. Lo que tenemos que hacer es añadir estas propiedades en el tag <mso:ManagedPropertyMapping msdt:dt=”string”>.  Se añade como par de valores, “Campo”:”Valor”, “campo”,”valor”, ….

Añadimos las 2 propiedades <mso:ManagedPropertyMapping msdt:dt=”string”>’Entradilla’:’entradillaOWSMTXT’,’Image’:’PublishingImage’….

Para recuperar su valor, lo haremos de la siguiente manera: ( en este caso, si la noticia/artículo/página no tiene imagen, le pongo una por defecto )

var entradilla = $getItemValue(ctx, "Entradilla");
var imagenURL = $getItemValue(ctx, "Image");
var imagen = "";
if (!$isEmptyString(imagenURL.value))
{ imagen = imagenURL.value }else { imagen = "<img src = '/es-es/PublishingImages/download.jpg' alt='Imagen Por defecto'/>"}

Con esto ya tenemos los valores, ahora solo falta mostrarlos. Yo muestro la entradilla en una <p> y la foto en un <div>

<div id="_#= $htmlEncode(id + Srch.U.Ids.title) =#_" class="ms-srch-item-title">
<h3 class="ms-srch-ellipsis">
_#= titleHtml =#_
</h3>
<p>
_#= entradilla =#_
</p>
<div>
_#= imagen =#_
</div>
</div>

Com veis, con _#= campo =#_ se obtiene su valor y se puede mostrar como se quiera.

Espero os sirva de ayuda.

About Alfons Martinez LLopart

MCITP-PRO en SharePoint 2010 y MAP en España.

Posted on February 5, 2014, in Desarrollo, Search, Sharepoint 2013 and tagged , , , . Bookmark the permalink. Leave a comment.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: