Agent/Recruiter and Contact/Hiring Manager Home Pages
To edit and create a new home page for agents/recruiters, please follow these steps (please remember that only the admin user has access to this functionality):
Go to the "System Settings" section.
Select "Static Pages" from the menu.
Click on the green plus icon located in the center of the page.
Choose a name for the home page. This name will be displayed in the menu, both internally and externally.
In the "Select Static Page" dropdown, choose the "Getting Started Home Page" option to add the home page to the agent URL side of the platform.
Add the user groups that should have access to this home page under the "User Groups" section.
In the "Edit" field, copy and paste the HTML code for the desired home page.
Once you have finished editing, you can preview the home page by clicking on the "Preview" tab. If you are satisfied with the preview, click on the "Submit" button to save the page.
Please note that if a user group has access to multiple home pages, they will be able to view all of them. To select a specific home page, they can follow these steps:
Click on "Getting Started" from the menu.
A list of available home pages for the user group will be displayed.
Select the preferred home page from the list.
By following these steps, users can easily switch between different home pages and access the one that suits their needs.
Here are some quick tips on how to add specific items:
How to add an embedded YouTube video
Here's a guide on how to add an embedded YouTube video to your home pages:
Find the YouTube video you want to include. It could be an overview tour of the platform or a customized welcome message for a specific user group. The possibilities for using these videos are numerous.
Copy the embed code of the YouTube video. You can usually find this by clicking on the "Share" button beneath the video and selecting the "Embed" option.
Access the HTML code of your home page and locate the section where you want to insert the video.
Paste the YouTube video's embed code into the chosen section.
Save the changes made to your home page.
By incorporating an embedded YouTube video, you can effectively guide users through an overview of the platform or provide them with a personalized welcome message that caters to their specific user group.
Below is an example of an embedded video link:
<iframe width="100%" height="380" style="flex: 1;" class="margin-bottom" src="
https://www.youtube.com/embed/LcsAWZpRUvs " title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
How to add a help icon
Here's a guide on how to add a help icon to your content:
Choose the specific link or element where you want to place the help icon. It could be next to a button, a text link, or any other element that requires additional assistance.
Find or create a suitable help icon image. This could be a question mark icon or any other visual representation that signifies help or support.
Access the HTML code or the content editor where you can make changes to your page.
Insert the help icon image at the desired location. You can use the HTML <img> tag to add the image or follow the instructions provided by your content editor.
Add the necessary functionality to the help icon. This can be done by assigning an event listener or a hyperlink to the icon that triggers the desired action, such as opening a training article or video.
Save your changes and preview the page to ensure the help icon is properly displayed and functions as intended.
By incorporating a help icon, you can provide quick and accessible assistance to users by linking them directly to relevant training articles or videos. This helps enhance the user experience and enables users to easily access additional support materials.
Here is an example of a help icon (this is the one highlighted in the screenshot above):
<a href="
https://template.eva.ai/agent/settings?tab=companyOptions " target="blank">Company name and logo</a><a class="margin-left" href="
https://evadotai.atlassian.net/l/cp/e50r0ipm " target="_blank"><i class="fa fa-question-circle text-info"></i></a>
How to add quotas & limits section
Here's a guide on how to add the "Quotas & Limits" section to the home pages:
Access the editing mode of the home pages where you want to add the "Quotas & Limits" section.
Identify the suitable location for the section within the layout or structure of the home page. This could be at the top, bottom, or in a dedicated section for important information.
Create a new section or div container for the "Quotas & Limits" information.
In this section, include a clear heading such as "Quotas & Limits" to provide context for the displayed information.
Within the section, you can list the specific quotas and limits that are relevant to the client's contract.
By including the "Quotas & Limits" section on the home pages, clients can easily track and manage their quotas and limits, enabling them to make informed decisions and take necessary actions to ensure the smooth operation of their recruitment processes.
See below an examples of the HTML code:
<div class="col-xs-3" style="display: flex; flex-direction: column; align-content: stretch;">
<div class="panel-block margin-bottom limits-block" style="flex: 1;">
<h3 style="font-size: 18px;" class="text-primary margin-bottom">Quotas & Limits</h3>
<div id="quotas"></div>
<center><a href="
https://template.eva.ai/agent/settings?tab=hrAgents " class="btn btn-primary wide-btn margin-top">Add your colleagues</a></center>
</div>
To include the "Add Your Colleagues" link and the "Upgrade" section with a direct button to the support email address, follow these steps:
Open system settings and select ‘static pages’ and start editing the chosen home pages.
Locate the relevant section where you want to add the "Add Your Colleagues" link.
Insert the HTML code
Save the changes and preview the home page to ensure the "Add Your Colleagues" link is displayed correctly.
Next, let's add the section that displays the number left and the "Upgrade" button:
Identify the appropriate location for the "Upgrade" section within the layout or structure of the home page.
Create a new section or div container for the "Upgrade" information.
Insert the HTML code.
By adding the "Add Your Colleagues" link and the "Upgrade" section, clients will have easy access to add colleagues and can quickly reach out to the support team for any upgrades or additional assistance they may need.
See the example of a code below:
<div class="col-xs-3" style="display: flex; flex-direction: column; align-content: stretch;">
<div class="panel-block margin-bottom text-center" style="flex: 1;">
<img width="100%" style="margin-top: 10px;" src="https://cdn2.eva.ai/trial2.png" alt="Image" />
<h2 style="line-height: 1.3em;">You have <span id="daysLeft" style="color: #1088e2;">9 days</span> left on your licence</h2>
<a href="mailto:support@eva.ai" class="btn btn-success wide-btn margin-top">Upgrade</a>
</div>
Full User Guide and Support Instructions
To enhance the user experience and provide support instructions, consider adding a section that includes a direct link to the http://EVA.ai User Guide and clear guidance on how and when to contact support. Follow these steps to include these valuable sections:
Identify the appropriate location within the home page layout where you want to add the sections for the User Guide and support instructions.
Create separate sections for the User Guide and support instructions, ensuring clear visual separation between them.
Add the HTML code
Save the changes and preview the home page to verify that the User Guide and support instructions sections are displayed correctly.
By adding these sections, users will have direct access to the User Guide for comprehensive instructions and can easily find the necessary information. Additionally, they will know how and when to contact the support team for further assistance, ensuring a smooth and efficient user experience.
Find below an example of the code:
<div class="row" style="display: flex; ">
<div class="col-xs-6" style="display: flex; flex-direction: column; align-content: stretch;">
<div class="panel-block margin-bottom text-center" style="flex: 1;">
<h4 style="line-height: 1.5em;">
<a href="
https://evadotai.atlassian.net/l/cp/LnLzY0vE ">
<img src="https://cdn2.eva.ai/tutorial2x.png" width="30%" />
<br/><br/>Full User Guide
</a>
<br/>
Dear user, in our user guide you can find some useful information about the EVA platform.</h4>
</div>
<div class="panel-block margin-bottom text-center" style="flex: 1;">
<h2 class="text-primary margin-bottom">How to Ask for Help / Support</h2>
<h4 style="line-height: 1.5em;">In case that you need support, you can send us an email at <a href="mailto:helpdesk@eva.ai">helpdesk@eva.ai</a>.
<br>Please keep in mind that our team is available for you between 9am and 5pm Monday-Friday London time.
<br>The expected response time is 24 hours.
</h4>
</div>
</div>