STANDARD OPERATING PROCEDURE | |
---|---|
Title DXT Shop By Job asset build process | Effective Date TBD |
Department eBusiness | Business Owner Farid Mokraoui |
Purpose
This document outlines the key processes and policies for creating Shop By Job landing page and banner assets.
Important Notes
- A valid Gmail address is required to access all Google spreadsheets and documents.
- JSON process will not begin until all designs are signed off and approved. Changes to the design template after design approval can impact the delivery date for a project.
Policies and Procedures
DXT File Ownership
- Google spreadsheet initial setup will be done by DXT. Folders and files will be shared with Merchandisers for access.
- A separate spreadsheet is assigned to each of the KOBs.
- Spreadsheet export will be handled by DXT for JSON validation and WCS upload. WCS asset creation will be handled by DXT.
- Slot asset IDs will be sent to Merchandisers for XM set up.
SBJ - Landing Page Build Process and Logic Overview
Each landing page in the Shop By Job program is comprised of five types of assets or sections. Each page begins with the SBJ branded page header. This asset is the same for every page, across each KOB and uses the same asset ID. Following the SBJ header is the page title / H1. The page title content is unique to each page however every KOB has a single WCS asset that is used to generate the H1 data from the JSON spreadsheet. This works because the Javascript logic identifies the <title> on the page and looks for the corresponding row of data in the JSON file that contains the matching <title> data from the Google spreadsheet (more on that below). Each page before login also has an SEO section that appears below the H1. The data for this section is entered manually by the Visual Designer and each page requires a unique Before Login SEO asset. All of the page sections mentioned thus far must be listed by the Merchandiser in XM in the order described. Following the Before Login SEO asset are the product content sections. These sections can be placed in any order the Merchandiser chooses. Other non-SBJ assets can also be placed around or between these sections by the Merchandiser in XM. The final section of the page is the SEO Copy section and is the most important as it contains the JS file that renders the page content. In the event that no SEO Copy is presently available for the page, an asset for this section must still be created and used in the page build.
SBJ - Landing Page Process Flow
- Google spreadsheet is created by DXT.
- All landing page data is manually entered into the Google spreadsheet by the Merchandiser.
Note: The pageID (column B) and h1 (column C) data on the spreadsheet is pulled from the SEO document that the Web Content Team provides and will be entered by the Merchandiser. The pageID uses the title info found between the opening and closing <title> tags and the h1 uses the h1 info found between the opening and closing <h1> tags. This data must be copied verbatim, without surrounding HTML tags. An example of this document can be viewed here: https://docs.google.com/document/d/1dS_gkTPnOxcfXEhC-bFxTw8tWEzsU8Wd5dWoGWDmqd8/edit?usp=sharing - Spreadsheet is exported into valid JSON format by DXT. The exported files can be found in the corresponding KOB's folder in Google Drive: https://drive.google.com/open?id=1pmx1RRkjzzaWN5yJ_LANJHEjdKTqApNT
- Exported JSON file is entered into WCS by replacing the current data in the KOB's pre-existing JSON asset.
Note: All JSON assets are documented in the Asset Reference Spreadsheet linked below. A new JSON asset should only be created if it does not yet exist for that KOB and should be documented in the Asset Reference Spreadsheet after it has been created in WCS. - Build landing page assets in WCS
- Shop By Job page header - asset (2600004452984) is global and used on all SBJ pages.
- Title / H1 - a single asset for each KOB is used to generate this content. See Asset Reference Spreadsheet for each KOB's unique asset ID for this page section. If a new H1 asset is needed, use the following HTML:
<div class="b-container"><div class="section js-content" data-campaign="2600006356248" data-section="Heading"> </div></div>
Note: The data-campaign attribute requires the asset ID for the corresponding KOB's JSON file in WCS. Do not modify the data-section "Heading". - Before Login SEO content - this content is entered manually by DXT into a new asset for each job and is marked up in the WCS HTML block as follows:
<div class="section">Paste login blurb content from document provided by Web Content Team here. Mark up all <a href="#">text that includes an URL</a> with anchor tags and use links provided within the document</div>
Begin by copying all of the text as highlighted in the example below and paste between opening and closing <div> tags as described above. The URLs for the anchor links can be found by clicking into the highlighted words within the document. Use the highlighted text (ie "valves", "valve parts", etc) for the link text in your asset. - Product Content Section(s) - before creating a new product section asset, check that one has not already been created in WCS for that KOB's section title. Section titles are identified in column D of the JSON Google Spreadsheet. Common and recurring section assets are documented in the Asset Reference Spreadsheet and can be reused across multiple pages in the same KOB. These assets cannot be used across multiple KOBs as the HTML in the asset code references the unique asset ID for each KOB's JSON file in WCS. If a new Product Section Asset is needed, use the following HTML:
<div class="b-container"><div class="section js-content" data-campaign="2600006356248" data-section="Materials"> </div></div>
Note: The data-campaign attribute requires the asset ID for the corresponding KOB's JSON file in WCS. Enter the section title data from column D in the JSON Google Spreadsheet for the section being built into the data-section attribute in your HTML.
Important: Because of the order in which content loads on the page, merchandisers should not use HTML entities (ie &) in the naming of section titles / data-sections in column D. Instead, please spell out the entire word (ie "and"). - SEO content block - this content is entered manually by DXT into a new asset for each job and is marked up in the WCS HTML block using the same code as the Before Login SEO Content section.
Note: This asset must also have the SBJ Global Javascript asset (2600008114549) attached to the JS dropzone on the WCS asset. It is critical that the JS asset be attached and that the SEO Content block appear last in order of assets on the page when set up in XM.
- DXT provides asset IDs to Merchandiser for page setup in XM
SBJ - Home Page Grid Slot Banner Process Flow
SBJ - PLP Grid Slot Banner Process Flow
SBJ - PLP List Slot Banner Process Flow
SBJ - Industry Solutions Content Slot Process Flow
Important Documents
Google Spreadsheet for Each KOB:
Builder
https://docs.google.com/spreadsheets/d/1xtQsX0dBQ6md45PgIAgpCpQQZ9Et6ynkW8aOrn4g8ew/edit?usp=sharing
Commercial
https://docs.google.com/spreadsheets/d/15DWbnX8MWLpE18c6G5Tma3VSxnEDgKxjKG-FrhuA1v4/edit?usp=sharing
FFS
https://docs.google.com/spreadsheets/d/1X7w3_Uog9OmKbMQQ4FCk4wsH3NRRsgsviBrYJ1gf6Oo/edit?usp=sharing
HVAC
https://docs.google.com/spreadsheets/d/1Yv8eVID9jfW-JShKIsqJlpaUVLvEv2sdNneSVQ8FVS4/edit?usp=sharing
ResTrade
https://docs.google.com/spreadsheets/d/1lfrUOIGLJFxmU2jw2S-QVaKTI7vTSeYqwuTc6qBSb0o/edit?usp=sharing
Waterworks
https://docs.google.com/spreadsheets/d/1R0UN2IEMzqswZX-7cxSFXd3VOSjZ0uoC4w5FQTO7W1U/edit?usp=sharing
Asset Reference Spreadsheet:
https://docs.google.com/spreadsheets/d/1cUeH9vNwHlIbJtW35OmeZ3QANNayqPT80vdokAunQnw/edit?usp=sharing
Turnaround Time
Expected Turnaround Time – The turnaround time for a project utilizing JSON can vary, with more custom experiences needing the most time to build and test. Many of the below tasks happen concurrently.
WF Task | Turnaround Time | WF Concurrent Task | Turnaround Time |
---|---|---|---|
JSON spreadsheet discovery/logic creation (DXT/Merch) | 3 days | JSON spreadsheet shared with Merchandiser (DXT) | 1 day |
HTML/CSS development (DXT) | 5-10 days | JSON spreadsheet population (Merch) | 5 days |
JSON/JS development (DXT) | 10-15 days for new template 5 days to reuse or adapt previous template | ||
JSON spreadsheet review/export (DXT) | 2 days | WCS asset set up / ID delivery (DXT) | 5 days |
Staging review (DXT/Merch) | 3 days | Spreadsheet edits (Merch) | 2 days |
Maintaining JSON Assets after Publish - Once page is in staging and live on the site, any spreadsheet updates/exports will be processed late morning and late afternoon (2x daily). This is to accommodate preview and testing for the next publishing window. To update an existing asset utilizing JSON, please submit a QF ticket to process your changes.