<% user.full_name %>
<% util.level ? util.level.title : '' %>
Explorer Pioneer Apollo Viking Voyager Pathfinder Orion
Points
<% user.points ? user.points.toLocaleString() : 0 %>
Badges
<% util.badgeCount %>
Streaks
Congratulations You've <% util.newestBadge.isCurriculum ? 'completed' : 'earned' %> the
<% util.newestBadge.title %> <% util.newestBadge.isCurriculum ? 'curriculum' : 'badge' %>!
previous
next
Share to Social Media
Linked In Facebook
Status
<% util.level ? util.level.title : '' %>
<% util.level ? util.level.points : '' %>
<% util.nextLevel ? util.nextLevel.title : '' %>
<% util.nextLevel ? util.nextLevel.points : '' %>
Level up! <% util.levelPointsRemaining %> points to go
Level up! <% util.levelPointsRemaining %> points to go
Badges
Completed Hitchhikers Program Track Completed Knowledge Graph Track Completed Pages Track Completed Page Builder Track Completed Search Track Completed Search: Advanced Track Completed Search UI React Track Completed Solution Templates and the Admin Console Track Completed Technical Skills Track Completed Platform Basics Track Completed Listings Track Completed Reviews Track Completed Industry Overview Track Completed Analytics Track Completed Industry Overview & Product Basics Track Completed Knowledge Assistant Track Completed Multi-Language Experiences Track Completed Fall '22 Release Highlights Track Completed Spring '23 Release Highlights Track
<% util.expandBadges ? 'Less' : 'More' %>
Playground Accounts
New +
No Playground Accounts
Create Playground +
View Profile
Log Out loading
Mission Complete! 🚀
Congratulations, you’ve completed your first module!

We hope you enjoy exploring the rest of the site. Please don’t forget to leave us feedback - we are constantly looking to improve. Happy Hitchhiking!
Home
Welcome to Hitchhikers! 👋
To learn more about the platform we encourage you to get started by completing the Hitchhikers Program Track and earning your first badge!
Start Here
Close notification
Creating a New Vertical End to End
Arrow Back
Unit 1
Creating a New Vertical
completed
Unit 2
Best Practices and Troubleshooting
completed
assessment assessment
Module Assessment
completed completed
home

Module Assessment | Yext Hitchhikers Platform

loading
You must include a first name and last name in your profile to create challenge environments.

Background

You are ready to add the Community Stories and Help Articles (with document search!) to the Turtlehead Experience. This is going to test your ability to:

  • Upload Data
  • Add a vertical to the search configuration
  • Add a vertical to your Jambo frontend

This challenge is going to test a lot of the training from this track up until this point. We recommend that you complete prior modules in this track before proceeding.

Challenge

  1. Upload the Community Story data file . You already added all of the fields included in the Knowledge Graph track (finally they’re of use!). Not familiar with uploading data files? Check out the Uploading Data module .

  2. Add the vertical to the search configuration either using the UI or the JSON Code Editor. If you are using the Code Editor:

    • Use “community_stories” as the verticalKey
    • Use “Community Stories” as the name
    • Make sure that you use the API name for the entity type (you can find this when you click into an Entity Type from Manage Entity Types)

    Can’t remember how to add a new vertical? You can refresh your memory by revisiting the Verticals module .

  3. Make sure to include the following as Searchable Fields:

    • builtin.entityType (NLP Filter)
    • name (Text Search)
    • theme (NLP Filter)
    • goal (Text Search)

  4. Update the universal prompts within Query Suggestions to include a prompt for Community Stories. You should now have five universal prompts. In addition, add a vertical prompt using an embedded [[name]] field, similar to your existing Events and FAQs verticals.

    Can’t remember how to add universal and vertical prompts? You can refresh your memory by revisiting the Query Suggestions module .

  5. Navigate to Pages > Turtlehead Tacos Search > Deploys, go to the Code Editor, and click into the master branch. You should expect this to take a couple minutes to load – in the background, it’s starting up a container for your development. As you go through the following steps, be sure to continuously check your live preview to verify your work.

  6. Add the vertical to the frontend using the Add Vertical Jambo command.

    • ‘communitystories’ as the Page Name
    • Use the verticalKey from the search configuration (this is case-sensitive, so make sure you add it exactly as you did in Step 2)
    • You’ll make the new card in the next step, so for now choose “standard” and come back to this after
    • Use the Page Template “vertical-standard”

  7. In the config > communitystories.json file, update the following:

    • Add “Community Story Search” as the pageTitle
    • Add a label in the verticalsToConfig for the vertical so it looks better. Call it “Community Stories”.

    Can’t remember how to add and customize pages? You can refresh your memory by revisiting the Adding Pages & Cards module .

  8. Add the frontend card by forking the standard card and call it “communitystory”.

    Can’t remember how to add cards? You can refresh your memory by revisiting the Adding Pages & Cards module .

  9. Navigate to the cards > communitystory > component.js file:

    • Update the subtitle so that it is ‘In partnership with: ‘ and then a comma-delimited list of the Local Non Profits (c_localNonProfits). (hint: go back to the defining new cards unit and search for “List” to find the formatter that can help here.)
    • For CTA1, hardcode the CTA Label as “Learn More” and map the CTA URL to the landing page URL (hint: you don’t need a formatter wrapped around the landing page URL field since it’s not a CTA Field Type – you can simply add the field on its own)
    • Remove CTA2
    • You don’t want long descriptions taking up too much space. Update the showMoreLimit to 250 characters.

    Preview your changes as you go to make sure it looks how you want before committing. Make sure you updated the cardType to your new card, otherwise you won’t see your changes! Here’s what your final card should look like:

    community story card end state

    Can’t remember how to update cards? You can refresh your memory by revisiting the Data Mappings & CTAs module .

  10. Time to add Help Articles! You already have the data in the Knowledge Graph that you ingested using the Crawler and a Data Connector from the Turtlehead Help Site. Navigate to Search > All Search Experiences > Turtlehead Tacos Search > Verticals to add the vertical to your search config. If you are editing as JSON:

    • Use “help_articles” as the verticalKey
    • Use “Help Articles” as the name
    • Make sure that you use the API name for the entity type (you can find this when you click into an Entity Type from Manage Entity Types)

  11. Make sure to include the following as Searchable Fields and then save your changes:

    • builtin.entityType (NLP Filter)
    • name (Text Search)
    • body (Document Search)

  12. Update the universal prompts within Query Suggestions to include a prompt for Help Articles like “where to redeem gift cards”. You should now have six universal prompts. In addition, add a vertical prompt using an embedded [[name]] field, similar to your existing Events and FAQs verticals.

  13. Save the changes to your search configuration.

  14. Navigate to your frontend just like you did in step 5.

  15. Use the Add Vertical command to add your new frontend. Make sure to use the following and then click Submit:

    • ‘help’ as the page name
    • Use the vertical key for Help Articles in the search configuration that you added in step 10
    • ‘document-standard’ for the card (you will use the standard document search card from the Theme for this vertical!)
    • ‘vertical-standard’ for the page layout

  16. Open up the config > help.json file:

    • Update the pageTitle to “Help Article Search”
    • Make sure the cardType references the Theme’s “document-standard” card
    • Update the vertical label to “Help Articles”

  17. Open up the Live Preview to verify all of your updates and debug as needed. Run one or all of these searches to see your updates in action:

    • where to reset password
    • when can i place an online order
    • when can i track my delivery driver?
    • where to redeem gift cards
    • how can i place an order on your site
    • where to check my rewards

  18. Commit your changes.

  19. Monitor the build and publish.

Module Assessment
+<% util.points %> points
loading
Weekly Challenge Streak Weekly Challenge Streak: <% util.streakWeekly %>
You must include a first name and last name in your profile to create challenge environments.
Challenge account expires in <% util.expirationHours > 24 ? Math.round((util.expirationHours * 1.0) / 24) : util.expirationHours %> <% util.expirationHours > 24 ? (Math.round((util.expirationHours * 1.0) / 24) == 1 ? 'day' : 'days') : (util.expirationHours == 1 ? 'hour' : 'hours') %>.
Challenge account has expired. Please create a new account.
Report Card
Upload the Community Story file
Add the Community Story vertical to the config
Add the searchable fields for the Community Story vertical
Add a universal prompt and vertical prompt to query suggestions for the Community Story vertical
Update the Community Stories JSON page with verticalKey, pageTitle, cardType and label
Add a new card called communitystory and update data mappings
Add the Help Article vertical to the config
Add the searchable fields for Help Articles
Add the Help Article page and update the vertical key, page title, label, and card
Common Issues
Configuration changes not saved or showing a message that there are no changes? expand/collapse module

This is likely because you included an object that was not recognized and the Yext system is removing it from the config and saving any other changes.

If you’re adding something that is top-level, like the synonyms or autocomplete objects, make sure it’s not nested inside of a vertical. Conversely, if you’re adding a searchable field or a saved filter, make sure it is nested appropriately.

Do you have an error for adding searchable fields? expand/collapse module

Here are some things to double check:

  • Did you include all of the fields specified in the challenge? Double check!
  • Did you specify the right type (e.g, nlpFilter vs. textSearch) for each one?
  • Do you have proper comma and quotation syntax for JSON? Look out for red underline and indicators on your scroll bar for errors.
Are you seeing blank search results when you preview your changes? expand/collapse module

Here are some things to double check:

  • Inspect the page and check the console. See whether there are any helpful errors and refer back to the Data Mappings & CTAs training to see if you are running across any common errors
  • Make sure that you didn’t delete the experienceKey out of the locale_config.json file by accident
  • Try clicking Update Preview again and look at the Console. Do you see any errors? If not, try doing another hard refresh once the console says it is completed.
Having an issue with your new card? expand/collapse module

Here are some things to double check:

  • Do you have syntax for JS? Look out for red underline and indicators on your scroll bar in the code editor for errors.

  • Are you using any slanted quotation marks instead of straight quotation marks? If you copy and pasted anything that includes quotations, make sure they don’t include any fancy slanted quotations as those are not code-friendly!

  • Make sure you included “profile.” before any fields mapped from Knowledge Graph in your JS. This is telling the system to pull it from the profile. For example, if you want to use the theme custom field, it should be “profile.c_theme” and not “c_theme”

  • If you used double quotes for any hardcoded content, try using single quotes. The graders can be a bit finnicky! In general, you should be consistent with either single or double quotes in your code, but in general we prefer to use single quotes in javascript.

  • Make sure you spelled everything correctly and exactly as specified in the challenge! A computer is grading you on whether you did it right which means (unlike on Instagram) that spelling matters!

  • Make sure the card name is as specified in the challenge and that you properly mapped to it on the [pageName].json file

  • Any formatters you use are spelled correctly. You can find the formatters and you can read about commonly used ones in this unit

  • Space out your code for legibility. This won’t actually change your end result, but it will help others who are reviewing your code (including our auto-graders!). Think about it – which of the following is easiest to read? Hint: the second one!

    `attribute: profile.c_field+profile.c_field+' | '+' Job'`
`attribute: profile.c_field + profile.c_field + ' | ' + ' Job'`
Getting an error adding your new vertical? expand/collapse module

Here are some things to double check:

  • Did you use the right API name for the type? You can double check these in the Manage Entity Types > View Details screen for a specific type.
  • Do you have proper comma and quotation syntax for JSON? Look out for red underline and indicators on your scroll bar for errors.
  • Did you name the type exactly as specified in the challenge? Also - Casing matters! For example, “communitystories” != “communityStories”! The key is the unique identifier so it’s very important to get it right.
Getting an error for your new Page? expand/collapse module

Here are some things to double check:

  • Do you have proper comma and quotation syntax for JSON? Look out for red underline and indicators on your scroll bar in the Code Editor for errors.
  • Make sure the verticalKey matches exactly (case sensitive) to the verticalKey in your Search Configuration. For example, it should be “faqs” not “FAQs”.
  • There are two places you have to add verticalKey for each vertical page – once in the top level and again in the verticalsToConfig object. Make sure you didn’t forget one of these!
  • Make sure you remove the < and > characters anywhere it says “< REPLACE ME >“. Those are meant to be removed as well!
  • Make sure the Page Names are exactly as specified. For example, it should be “Event Search” not “Events Search”
  • The card names must match exactly the card names in the Theme or in your Cards directory.
Previous Submissions
Attempt #<% submission.attemptNumber %>
<% submission.date %>
Score: <% submission.numericScore %>
Pending
Feedback
<% elem.innerText %>