Aplio
NextJs
Career Page

Career Page

Career Page Hero

To customize the data in the Hero section, you can modify the following properties in the components/shared/PageHero.jsx file in the app/career/page.jsx and customize the following data:

<PageHero subtitle="CAREER PAGE" title="Become a part of the <br/> aplio team" />

Career Details

To configure the Banking Details section, you need to make changes in the components/career/CareerDetails.jsx file..And Change the follwoing data:

<section>
      <div className="container">
        <div className=" bg-white dark:bg-dark-200 shadow-nav rounded-medium p-2.5 mb-12 max-md:h-[400px]">
          <Image
            src={CareerImage}
            alt="career banner"
            className="w-full  rounded max-md:w-auto max-md:object-cover max-md:object-center  max-md:h-full"
          />
        </div>
        <div className=" max-w-[850px] mx-auto">
          <h2 className=" max-w-[700px] mb-9">Join a committed community driven by shared enthusiasm</h2>
          <p>
            Lorem ipsum dolor sit amet consectetur. Nullam blandit dui gravida aliquam enim eu. Adipiscing viverra
            vulputate curabitur est.
            <br />
            <br />
            Morbi lorem proin morbi tempor risus. Nisl lobortis diam id faucibus pretium vitae suspendisse sed accumsan.
            Sodales morbi tristique elit cursus gravida. Ullamcorper commodo eget pulvinar pretium. Condimentum rhoncus
            commodo amet nec auctor nibh vel mi blandit.
            <br />
            <br />
            Neque ultrices nunc condimentum morbi risus tincidunt. Vel arcu lacus non ornare. Porttitor in rhoncus magna
            augue adipiscing.Ullamcorper commodo eget pulvinar pretium. Condimentum rhoncus commodo amet nec auctor nibh
            vel mi blandit.
          </p>
        </div>
      </div>
    </section>
  • Image - import CareerImage from "../public/images/about/career.png"; change the image path here to change the image.

Career Features

To configure the Payment Features section, you need to make changes in the components/shared/PaymentFeatures.jsx file and the data/aboutFeaturesData.json file. Here are the instructions:

  1. Section Title:

    • Locate the following code in the page/home-2.jsx file. Now import AboutFeaturesData from data/aboutFeaturesData.json.Then inside feature add the AboutFeaturesData to add features. Also ad sectionTag and sectionTitle like the followin codes to update setion ttiel and tagline. You should also add spaccing props value to add spacing:
  <PaymentFeatures
    features={AboutFeaturesData}
    sectionTag={"OUR VALUE"}
    sectionTitle={"Our business is steered by our core values"}
    spacing={"max-md:py-25 py-150"}
  />
  • Update the section as you need.

Career list

All the career list data are generated from data/career folder. To create a career post on Aplio, you need to create a Markdown (.md) file inside the data/career folder. Each .md file will generate a new career post page, and a list of these files will be displayed on the career list page. By clicking on the title of a career or the "Read More" button, users can navigate to the respective career details page.

Here's how you can create your first career post:

  1. Create a new file at data/career/marketing-lead.md.
  2. Add the following front matter at the beginning of the file:
---
title: Marketing Lead
publishDate: December 20, 2023
expirationDate: January 20, 2024
shortDesc: The prevailing view asumed
jobType: Remote
location: New York
address: 2464 Royal Ln. Mesa, New Jersey 45463
salary: $170 - $200
experience: 4
qualification: Bachelor Degree
skills: ['App', 'Design', 'Support', 'UI/UX', 'Brand']
---
 
## Job Description
 
Lorem ipsum dolor sit amet consectetur. Nullam blandit dui gravida aliquam enim eu. Adipiscing viverra vulputate curabitur est.
 
Morbi lorem proin morbi tempor risus. Nisl lobortis diam id faucibus pretium vitae suspendisse sed accumsan. Sodales morbi tristique elit cursus gravida. Ullamcorper commodo eget pulvinar pretium. Condimentum rhoncus commodo amet nec auctor nibh vel mi blandit.
 
Neque ultrices nunc condimentum morbi risus tincidunt. Vel arcu lacus non ornare. Porttitor in rhoncus magna augue adipiscing.
 
### The Work You’ll Do:
 
Morbi lorem proin morbi tempor risus. Nisl lobortis diam id faucibus pretium vitae suspendisse sed accumsan. Sodales morbi tristique elit cursus gravida. Ullamcorper commodo eget pulvinar pretium. Condimentum rhoncus commodo amet nec auctor nibh vel mi blandit.
 
Neque ultrices nunc condimentum morbi risus tincidunt. Vel arcu lacus non ornare. Porttitor in rhoncus magna augue adipiscing.
 
- Manage your time so you’ll get more done in less time
- Cut expenses without sacrificing quality
- Attract and retain quality, high-paying customers
 
### What you’ll bring:
 
Neque ultrices nunc condimentum morbi risus tincidunt. Vel arcu lacus non ornare. Porttitor in rhoncus magna augue adipiscing.
 
- Manage your time so you’ll get more done in less time
- Cut expenses without sacrificing quality
- Attract and retain quality, high-paying customers
 
### Benefits:
 
Neque ultrices nunc condimentum morbi risus tincidunt. Vel arcu lacus non ornare. Porttitor in rhoncus magna augue adipiscing.
 
- Manage your time so you’ll get more done in less time
- Cut expenses without sacrificing quality
- Attract and retain quality, high-paying customers
 
 

Save the file after adding your desired content.

Career List Page

The Career list page fetches data from the .md files located in the data/careerfolder. It displays a list of career posts based on these files. To add more career posts, create additional .md files following the same structure as described above.

The career list page will automatically retrieve the necessary details.