Hi HH community!
I’m stuck on “Add custom job card to the Jobs experience” and I tried everything and read all other applicable community posts. Ultimately this is the code I have for the custom card:
{{> cards/card_component componentName=‘joboverride’ }}
class joboverrideCardComponent extends BaseCard[‘joboverride’] {
constructor(config = {}, systemConfig = {}) {
super(config, systemConfig);
}
/**
- This returns an object that will be called
card
- in the template. Put all mapping logic here.
-
-
@param profile profile of the entity in the card
*/
dataForRender(profile) {
return {
title: profile.name, // The header text of the card
url: profile.landingPageUrl, // If the card title is a clickable link, set URL here
target: ‘_top’, // If the title’s URL should open in a new tab, etc.
// image: ‘’, // The URL of the image to display on the card
// tagLabel: ‘’, // The label of the displayed image
titleEventOptions: this.addDefaultEventOptions(),
subtitle: ‘profile.c_jobDepartment’ + ’ | ’ + ‘profile.employmentType’, // The sub-header text of the card
details: profile.description, // The text in the body of the card
// If the card’s details are longer than a certain character count, you can truncate the
// text. A toggle will be supplied that can show or hide the truncated text.
showMoreDetails: {
showMoreLimit: 500, // Character count limit
showMoreText: ‘Show more’, // Label when toggle will show truncated text
showLessText: ‘Show less’ // Label when toggle will hide truncated text
},
// The primary CTA of the card
CTA1: {
label: ‘Apply Now’, // The CTA’s label
iconName: ‘briefcase’, // The icon to use for the CTA
url:‘http://careers.turtleheadtacos.com’, // The URL a user will be directed to when clicking
target: ‘_top’, // Where the new URL will be opened
eventType: ‘CTA_CLICK’, // Type of Analytics event fired when clicking the CTA
eventOptions: this.addDefaultEventOptions(),
// ariaLabel: ‘’, // Accessible text providing a descriptive label for the CTA
}
};
}
/**
- The template to render
-
@returns {string}
-
@override
*/
static defaultTemplateName (config) {
return ‘cards/joboverride’;
}
}
ANSWERS.registerTemplate(
‘cards/joboverride’,
{{{stringifyPartial (read ‘cards/joboverride/template’) }}}
);
ANSWERS.registerComponentType(joboverrideCardComponent);
Hey Melanie,
A couple things to note in your Jobs experience:
-
Your config > jobs.json file uses the card joboverride, which is correct. However, it looks like you mistakenly deleted the template.hbs file for that card. You’ll want to recreate that card (through Tools > Jambo Commands > Add Card) since forked cards need both files. You don’t need the second jobsoverride card in this case.
-
For the card subtitle attribute, you currently use the below:
You actually don’t need to put references to profile fields in quotes. You’ll notice that other attributes such as url and details refer to the field without quotes.
Once you recreate the card and make this change (remember to update the CTA URL based on the instructions), you should be good to submit!
Hi Kristy,
Thank you for the tips. I’m still experiencing issues with this step. Are you able to take a closer look and provide more detailed feedback?
I deleted the other cards and created a new forked card, I also updated the subtitle and CTA based on your recommendation. For the CTA url I changed it to the job landing pages I created: https://jobs-turtleheadtacos-2609944_com.sbx.yextpages.net/.
Hi Melanie,
You’re close! I’ve called out a couple issues below. Please let me know if you have any questions.
Delete unused card - I see two joboverride cards in your code editor. Be sure to delete the unused one so your experience knows which to refer to (it’s best practice not to have multiple items with the same name). Please delete the folder for the card that does not have a template.hbs file (second one in this image).
Subtitle - The format of your subtitle was changed slightly when you copied it over. Be sure to include the spaces around the vertical bar separator you concatenate (' | ') since we want it to look like Marketing | Full Time.
CTA URL - Step 18 provides the CTA URL you should use instead of the job landing pages. You had it correct before, but I wanted to make sure you copied this over to your new card. Sorry for causing any confusion with my post! Also note that you should have hardcoded values such as URLs encased in quotes ''.
Hi Kristy,
Thank you for the quick assist here! I took your feedback and made the changes, but I’m still unable to complete the challenge. Is there another step that needs to be completed?
Hi again!
You’ve just got a small typo for your subtitle on the word profile.
Thank you so much! That did the trick 
