SCORE Components

Owned by Brian Beckham (Unlicensed)
Last updated: Mar 13, 2018 by Katya Sysun
1 min read

Base

External Redirect


Name/sitecore/Layout/Renderings/Score/Base/External Redirect
Description

allows Content Administrator to create either a 302 or 301 redirection "page" within the website

used specifically with the Redirect Page data template  

For more information on using the Redirect Page, see the Redirect Page.

TypeController Rendering
Page Editor Support?No, embedded in Redirect Page data template standard values
Page Editor View

Not Available

Note: Although the redirect page does have a page editor experience, the redirect component does not.

Sample Output
No markup output displayed.

Reference

Name/sitecore/Layout//Renderings/Score/Base/Reference Component
Description

used to "pull" rendered content from one page into another.  

Specifically, the Rendering Component is used within SCORE to drive both the Snippets and Cascaded Elements features.

TypeController Rendering
Page Editor Support?

Not Available

Note: modifies the UX in page editor to show the referenced component, but is not page editor "injectable" directly.

Page Editor View

When an element is rendered via the reference component, it will be rendered in a read only context,

and the editor is provided with a link to the source element that is referenced.  

e.g.

Snippet Component

Cascaded Element Component

 

Sample Output
No markup output displayed

Content

Snippet


Sample
The snippet is any area of the screen that can be created to represent any portion of a content page, so it literally could look like anything you can create from your set of components.
Name/sitecore/layout/Renderings/Score/Content/Reference a Snippet
Description

The snippet component is used to "pull" content created in the current website's Snippets shared content folder into the current placeholder location. Snippets can be arbitrary parts of the page, so snippets have the ability to violate the placeholder settings rules for content areas of the page and should be used with caution or only by experienced users.

Please read below about certain requirements that the Snippet Component has to its surroundings (layout document, placeholders, and the Snippet Container) to function properly.

TypeController Rendering
Thumbnail
Page Editor View

The snippet placed within the screen renders as a read-only item to the editor. Only the source snippet can be edited.

Experience Editor View is changed for SCORE v3.0

Rendering Parameters

key=/SnippetContainer/Snippet&type=snippet

The rendering parameters passed into the snippet identify two things - first the name of the placeholder key that the reference component will pull from to fetch the snippet contents from the source snippet item page. Second, the type is used to show the user what they are looking at in the read only mode:

Datasource Location

query:ancestor-or-self::*[@@templateid='{1469DFF6-C07C-4EAA-9E07-2D42D996E57E}']/*[@@templateid='{C6EF6188-4880-457B-BF56-F9E8FEC512FE}']

Datasource Template

/sitecore/templates/Score/Base/Snippet

The datasource location of the snippet utilizes a query to find snippets for the current site from shared content. However, there is also a pipeline handler that tells Sitecore to not just look for items of the base Datasource Template type, but also for derived types.

<processor type="Score.Custom.Pipelines.Editor.AddDerivedTemplatesForSelection, Score.Custom" 
           patch:source="zzScore.Snippets.config">
   <templates hint="list:AddTemplateId">
      <template>{BFAFEBB6-319B-42E6-A9AD-0F58F2F4B96F}</template>
   </templates>
</processor>


Anchor Point

Sample
Output from this component is not visible on the rendered page other than the markup created
Name/sitecore/layout/Renderings/Score/Content/Anchor Point
Description

Used for including a named anchor tag within a page. The anchor tag can be used to allow the user to jump to a specific location within the page.

TypeView Rendering
Thumbnail
Page Editor Support?

Available

Page Editor View

Sample Output
<a name="Benefits" class="score-anchorpoint" id="Benefits"></a>
Datasource Location./Content/Anchors
Datasource Template/sitecore/templates/Score/Content/Plain Text

Meta Data

Page Meta Data

Sample
<head>
    @Html.Sitecore().Rendering(ScoreConst.RenderingIds.PageMetaData, new { Cacheable = true, Cache_VaryByData = true })        
    ...
</head>
Name/sitecore/layout/Renderings/Score/Meta Data/Page Meta Data
Description

The page meta data component within the SCORE core is a simple rendering that is used to
render the basic meta data within the head of the HTML document.

TypeView Rendering
Page Editor Support?

No, although the meta data fields can be managed via the field editor buttons added to page editor.

Page Editor View

Sample Output
<title>Bootstrap Demo</title>
<meta property="og:site_name" content="SCORE Bootstrap Demo" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Bootstrap Demo Home" />
<meta property="og:description" content="Website used to demonstrate the BrainJocks SCORE Sitecore editor framework" />
<meta property="og:image" content="http://website/-/media/Images/BootstrapUIDemo/Logos/bj_logo_sm.png" />
<meta property="og:image:type" content="image/png" />
<meta property="og:image:width" content="180" />
<meta property="og:image:height" content="42" />
<meta name="keywords" content="Sitecore,BrainJocks,CMS,Digital Marketing,Marketing Automation,Personalization" />
<meta name="description" content="This website is used to demonstrate the content components of the SCORE framework" />
<meta property="og:description" content="This website is used to demonstrate the content components of the SCORE framework" />
<meta name="robots" content="INDEX, FOLLOW" />
<meta http-equiv="content-language" content="en" />
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
<meta http-equiv="last-modified" content="2014-11-14@05:00:00 Z" />
<meta http-equiv="X-Served-By" content="AMAZONA-6B16SST" />
<link href="http://website/" rel="canonical" />
<meta property="og:url" content="http://website/" />

Scripts

Page Header Scripts

Sample
<head>
    ...        
    @Html.Sitecore().Rendering(ScoreConst.RenderingIds.PageHeaderScripts, new { Cacheable = true, Cache_VaryByData=true })
    ...
</head>
Name/sitecore/layout/Renderings/Score/Scripts/Page Header Scripts
Description
The page header scripts rendering will render the contents of a specific field from the current page in the <head> of the HTML document. The purpose of this rendering and field is to allow the editor to embed <scripts> or other raw markup directly into the document head.
TypeView Rendering
Page Editor View

Sample Output
The output will be the raw script contents rendered within the <head> of the HTML page.

Page Footer Scripts

Sample
<body>
    ...
    @Html.Sitecore().Rendering(ScoreConst.RenderingIds.PageFooterScripts, new { Cacheable = true, Cache_VaryByData = true })
    ...
</body>
Name/sitecore/layout/Renderings/Score/Scripts/Page Footer Scripts
Description
For each page, the page footer scripts rendering will render the raw value of the field at the bottom of the <body> in the HTML document.
TypeView Rendering
Page Editor Support?No, field editor commands from the ribbon can be used to edit the raw field value in the page item
Page Editor View

Sample Output
The output will be the raw script contents rendered within the <body> of the HTML page.

Site Header Scripts

Sample
<head>
    ...      
    @Html.Sitecore().Rendering(ScoreConst.RenderingIds.SiteHeaderScripts, new { Cacheable = true, Cache_VaryByData=true })
    ...
</head>
Name/sitecore/layout/Renderings/Score/Scripts/Site Header Scripts
Description

The Site Header Scripts rendering will render site-wide script blocks in every page within the website where this rendering is declaratively added to the page.

Since site header scripts are designed to run on all pages within a tenant website, the page item that stores the scripts will be only the home page. This editor field will only be visible when using the field editor command button on the ribbon for the tenant website home page.

TypeController Rendering
Page Editor View

Sample Output
The output will be the raw script contents rendered within the <head> of the HTML page.

Site Footer Scripts

Sample
 <body>
    ...
    @Html.Sitecore().Rendering(ScoreConst.RenderingIds.SiteFooterScripts, new { Cacheable = true, Cache_VaryByData=true })
</body>
Name/sitecore/layout/Renderings/Score/Scripts/Site Footer Scripts
Description

The Site Footer Scripts rendering will render site-wide script blocks in every page within the website where this rendering is declaratively added to the page.

Since site footer scripts are designed to run on all pages within a tenant website, the page item that stores the scripts will be only the home page. This editor field will only be visible when using the field editor command button on the ribbon for the tenant website home page.

TypeController Rendering
Page Editor View

Sample Output
The output will be the raw script contents rendered within the <body> of the HTML page.