Aplio
Hugo
Homepage 2

Customize Your Homepage V2

Customizing the homepage V2 of Aplio is a simple and direct procedure that enables you to personalize the content and design elements according to your brand and business needs. The required data has already been included from the content folder. Now, all that remains is to modify our data.

Finding Homepage

To locate the homepage components, navigate to the themes/aplio/layouts/home-2/list.html folder. And data will be found at `contnet/home-2/_index.md file.

Customize Sections

The majority of sections on the homepage are added through the components folder, and the data for these components is generated from the content/home-2/_index.md folder.

Hero Section

To customize the data in the Hero section, you can modify the following properties in the content/home-2/_index.md file:

hero:
  - title: >
      Smart <span class="font-playfair italic inline-block px-5  pt-0.5 pb-2.5 leading-none"> Payment </span> solution for your Business
    tagline: Digital Payment Solution
    details: Until recently, the prevailing view assumed lorem ipsum was born as a nonsense text. It's not Latin, though it looks like it

- `Images`: Images has been imported from the images folder. To change the Hero images, Got to the `themes/aplio/layouts/partials/home-2/hero.html` and replace the image files located in the specified paths (**/images/payment/payment-hero.png** and **/images/payment/payment-hero-dark.png**).


**Note:** When making changes, ensure that the JSX syntax is maintained and that the modifications are within the appropriate tags and attributes.

### Payment Rating

To configure the Payment Rating section, you need to make changes in the `content/home-2/_index.md` file. Here are the codes you need to change:

```jsx
   rating:
    - title: >
          Thousands of <br /> users have faith in us
      details: >
          Boost your insights that help you to grow busines
      ratingItem:
        - name: Capterra
          details: Top Customer Fulfilment
          totalrating: 4.7
        - name: G2 Rating
          details: Best Payment Software
          totalrating: 4.3
        - name: Trustpilot
          details: Top Payment Company
          totalrating: 4.9
  • Update the section as you need.

Core Features

To configure the Payment Rating section, you need to make changes in the content/home-2/_index.md file. Here are the codes you need to change:

coreFeatures:
  - title: Features that help you run your business
    tagline: Core Features
    featureItems:
      - name: Useful Features
        details: The prevailing view asumed lorem ipsum was born as nonsense text.
        iconLight: "images/payment/invoice.svg"
        iconDark: "images/payment/invoice-dark.svg"
      - name: Insights and Reports
        details: The prevailing view asumed lorem ipsum was born as nonsense text.
        iconLight: "images/payment/insight.svg"
        iconDark: "images/payment/insight-dark.svg"
      - name:  Managing Inventory
        details: The prevailing view asumed lorem ipsum was born as nonsense text.
        iconLight: "images/payment/inventory.svg"
        iconDark: "images/payment/inventory-dark.svg"
      - name: Organized Expense
        details: The prevailing view asumed lorem ipsum was born as nonsense text.
        iconLight: "images/payment/expens.svg"
        iconDark: "images/payment/expens-dark.svg"
      - name: Organize Receipts
        details: The prevailing view asumed lorem ipsum was born as nonsense text.
        iconLight: "images/payment/receipts.svg"
        iconDark: "images/payment/receipts-dark.svg"
      - name: Mobile App
        details: The prevailing view asumed lorem ipsum was born as nonsense text.
        iconLight: "images/payment/app.svg"
        iconDark: "images/payment/app-dark.svg

Why Us

To configure the Payment Rating section, you need to make changes in the content/home-2/_index.md file. Here are the codes you need to change:

  whyChooseUs:
  - title: Control the flow of <br /> money easily
    tagline: WHY CHOOSE US
    details: Until recently, the prevailing view assumed lorem ipsum was born as a nonsense text nothing Before & After magazine.
    listItem1: It’s scalable and secure
    listItem2: Artificial Intelligence Feature
    listItem3: Offline version available
possibilites:
  - title: Manage your money <br/> with aplio.
    tagline: EXPLORE POSSIBILITIES
    details: Until recently, the prevailing view assumed lorem ipsum was born as a nonsense text nothing Before & After magazine.
    listItem:
      - It’s scalable and secure
      - Cash Flow Statements
  1. Images: Images has been imported from the images folder. To change the Hero images, Got to the themes/aplio/layouts/partials/home-2/whyUs.html and replace the image files located in the specified paths.

Payment Features

To configure the Payment Rating section, you need to make changes in the content/home-2/_index.md file. Here are the codes you need to change:

  FeaturesData:
  - iconLight: '/images/payment/paymentFeature.svg'
    iconDark: '/images/payment/paymentFeature-dark.svg'
    title: 'Useful Features'
    desc: The prevailing view asumed lorem ipsum was born as nonsense text.
 
  - iconLight: '/images/payment/payementSecure.svg'
    iconDark: '/images/payment/payementSecure-dark.svg'
    title: '100% Secure'
    desc: 'The prevailing view asumed lorem ipsum was born as nonsense text.'
 
  - iconLight: '/images/payment/paymentCashback.svg'
    iconDark: '/images/payment/paymentCashback-dark.svg'
    title: 'Cashback Program'
    desc: 'The prevailing view asumed lorem ipsum was born as nonsense text.'
  • Update the section as you need.

Members Counter

To configure the Work MembersCounter section, you need to make changes in the themes/aplio/layouts/home-2/list.html file. and puss a value in the number attribute like the following. to hide border make border value false instead of true.

Pricing

To configure the Pricing section, you need to make changes in the content/price/_index.md file. and change the following data:

title : 'Choose the right plan for your business'
date : 2024-08-01T00:20:22+06:00
tagline: Our Pricing
description: Until recently, the prevailing view assumed lorem ipsum was born as a nonsense text. It's not Latin, though it looks like it
 
priceCard:
- type: Basic
 details: The prevailing view assumed lorem ipsum was born as a nonsense text.
 featured: false
 discountValue:
 monthlyPrice: 19
 yearlyPrice: 230
 feature:
   - Track income & expenses
   - Send custom invoices & quotes
   - Connect your bank
   - Insights & reports
- type: Standard
 details: The prevailing view assumed lorem ipsum was born as a nonsense text.
 featured: true
 discountValue: 40
 monthlyPrice: 32
 yearlyPrice: 300
 feature:
   - Track income & expenses
   - Send custom invoices & quotes
   - Connect your bank
   - Insights & reports
- type: Premium
 details: The prevailing view assumed lorem ipsum was born as a nonsense text.
 featured: false
 discountValue:
 monthlyPrice: 48
 yearlyPrice: 450
 feature:
   - Track income & expenses
   - Send custom invoices & quotes
   - Connect your bank
   - Insights & reports

Blog

Data in this section is generated from blogs. Create blogs and the data will always be shown here. See more on this link (opens in a new tab).

CTA

To update the title of the Call to Action section in the data/cta.yaml file, Now modify the following data to updata CTA section. Here are the codes:

    ---
    title: >
      Start your best payment <br> experience now!
    details: >
      By creating a custom Web design for your business, we can bring your vision to life.
    features:
      - No Credit Card Required
      - Free For 30 Day Trial.
      - Money Back Guarente.
    ---

Save the changes to the data/cta.yaml file.

HomepageHomepage 3