After unzip the download pack, you'll found a html folder with all the files. You can view this template in any browser, you can display or edit the template without an internet connection. Now open your FTP Client(like File Zilla) or directly through cpanel, upload the content of the Template on your server root. Once the files are done uploading go to www.yourdomain.com and enjoy ))
Aali - Personal Portfolio Template
Created: 13/11/2021
Last Update: 01/12/2021
Template Features
Fully Responsive HTML5
CSS3 Animations
SEO optimized
Mobile Navigations
Fully Responsive to all devices
Developer Friendly Coding
Sticky Navigation
Free Updates
Installing Template
HTML Structure
The template includes 2 html files. This template is a flexible layout with max 3 column. All of the information within the main content area is nested within a div with a class of "aali_tm_all_wrap". You have to open index page in order to change it.
If you would like to edit the color, font, or style of any elements in this template, you could do by using "Inspect Element" on Chrome, Safari, Mozilla and Opera(press right click on browser ). It is really powerful tool to work with html and css codes.
CSS Files and Structures
I'm using 3 CSS files in this template. If you would like to edit a specific section of the site, simply find the appropriate label in the CSS file, and then scroll down until you find the appropriate style that needs to be edited.
JavaScript Structures
All call actions are run in init.js
Attention: If you romove any of javascripts, please don't forget to remove js code call action that belongs to removed js from init.js . Otherwise your site works inproperly.
Sources and Credits
I've used the following images, icons or other files as listed.
Icons - These Icons by fontello.com and flaticon.com
Images - pexels.com
Fonts - Free Google Fonts: "Josefin Sans", "Open Sans"
Contact Form
Contact form works only in hosting environment. If you want to use it, open "aali/modal/contact.php" file and change main email address (line-4) to yours.
How to edit template
In order to edit the file, you need to have Code Writer program installed on your system. Just open files in code writer and edit them. Recommended programs are Adobe Dreamweaver and NotePad++
Tutorial for using special blocks
-
Enable Dark Mode
If you want use dark mode just open your index.html and add class "dark" to "body" tag
-
Enable and Disable Magic Cursor
If you want enable or disable Magic Cursor feature just change data-magic-cursor value. Values are show and hide
-
Color Schemes
If you want change colors just change data-color value. Values are blue, green, brown, pink, orange, black, purple, sky, cadetBlue, crimson, olive, red
-
Change animate text effect in hero header
If you want change animate text effect in hero header just change extra class. Values are zoom, rotate-1, letters type, letters rotate-2, loading-bar, slide, clip, letters rotate-3, letters scale, push
-
Change directions of all moving elements on scroll
If you want change direction of moving element change its data-direction value. Values are x and y. If you want reverse it just change value of data-reverse to yes
-
Change background style in resume section
You can use parallax image or video for background. You can use any local, youtube, vimeo videos for the background. Just change value of data-background-style and that's enough. Values are image, video
-
Important!
Some hosting providers don't support PHP Mail Function automatically. So if you don't receive any message after changing mail address to yours, then contact with your hosting provider and they'll enable PHP Mail function. And everything would be great.
-
Contact
Live Chat: Chat here (Working Hours: 9am-6pm (GMT+5)
Email: [email protected]