If you have any questions that are beyond the scope of this documentation, please feel free to email or contact us via our Support Page : Support
Elvish Nextjs is a Creative & Modern Personal One Page Portfolio Template is a perfect template for Business Portfolio,web studio and creative agencies. Responsive based on Bootstrap. This is one page for placing your information. All files and code has been well organized and nicely commented for easy to customize.
You are important for us and so please feel free to get back to me with any question or feedback.
Follow these simple steps to install and set up Elvish Landing Template:
Step 1: Unzip
Unzip The Downloaded Folder and open it in vscode or any other code editor
you use.
Step 2: Navigate to the Project Directory
Run the command cd ./Elvish/Landing in the Terminal
Step 3: Install node_modules
Run the following command to install the node_modules:
npm i / yarn
Step 4: Install Dependencies
Run the following command to install the project dependencies:
npm install / yarn add
Step 5: Build And Run
Run the following command to run the project. It will first build and than
run the project.
yarn run dev / npm run dev
Visit http://localhost:3000 in your browser to view your Elvish Landing Template.
I have tried my best to have standards and modular structure while developing the theme. Following sections are explaining the theme File & Folder, structure, js file struture and plugins.
I have tried to follow the standards and modular structure while developing the theme. Let's take a look at the package structure:
Elvish/ ├── Landing/ │ ├── public/ │ ├── src/ │ │ ├── app/ │ │ │ └── all index file │ │ │ └── favicon.ico │ │ │ └── layout.tsx │ │ │ └── page.tsx │ │ ├── assets/ │ │ │ └── All assets files │ │ ├── Views/ │ │ │ └── All Common/Components files │ └── .eslintrc.json │ └── .gitignore │ └── next-env.d.ts │ └── next.config.mjs │ └── package.json │ └── README.md │ └── tsconfig.json └── Documentation/ └── index.html - documentation file for documentation.
src/app/layout.tsx file Structure.
import type { Metadata } from "next";
import "bootstrap/dist/css/bootstrap.min.css";
import "assets/scss/style.scss";
import "assets/css/materialdesignicons.min.css";
import "assets/css/mobiriseicons.css";
import "assets/css/animate.min.css";
export const metadata: Metadata = {
title: "Elvish | Next js & Responsive Bootstrap 5.3.2 Personal Template",
description: "Generated by create next app",
};
export default function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
return (
<html lang="en">
<head>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Montserrat:400,500,600|Nunito:400,600,700&display=optional"></link>
</head>
<body suppressHydrationWarning={true}>
{children}
</body>
</html>
);
}
Files are explained below:
| File | Description |
|---|---|
bootstrap.min.css
|
Elvish uses the bootstrap v5.3.2 The core bootstrap file is being used in all the pages. |
materialdesignicons.min.css
|
Materialdesign icon css file |
mobiriseicons.css
|
Mobiriseicons icon css file |
animate.min.css
|
Animate css file |
style.css
|
This file is containing all common styles for all the pages. |
Install Live Sass Compiler extention in your Visual Code Editor. Click the Watch Sass button at the right side footer of visual studio code. Contact us via Support any issues
I've used the following resources as listed. These are some awesome creation and I am really thankful to the respective community.
Once again thank you for purchasing the theme. I am always avaialble to help you. If you have any suggestion or feature to make it more better, I am requesting you to contact me, I'll try my best to add them in future updates.
Best Regards,
Version 2.1.0 - 7 Jun 2024
Version 2.0.1 - 20 March 2024
Version 2.0.1 - 26 Octomber 2023
Version 2.0.0 - 17 August 2023
Version 1.0.0 - 26 March 2023
Copyright © 2024 Elvish-Theme.