Scribd
Upload
15 views6 pages

Portfolio Website

Uploaded by

Aditya Adukia
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
15 views6 pages

Portfolio Website

Uploaded by

Aditya Adukia
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 6

Introduction

Hey everyone, welcome back to our channel! Today, I have something super exciting
lined up for you. If you're a freelancer looking to showcase your amazing work and
attract more clients, you're in the right place. In this video, I'm going to walk you through
creating a stunning portfolio website from scratch. We'll cover everything from designing
a sleek layout to highlighting your professional services and past projects. By the end of
this tutorial, you'll have a polished and professional website that truly represents your
unique skills and talents. So, grab a cup of coffee, get comfortable, and let's dive in!
Don't forget to hit that subscribe button and ring the bell icon so you never miss out on
our latest tips and tutorials. Let's get started!

Step Action Details


Install Plugins Install Elementor Step 1: Go to plugins and click on add new
Step 2: Search for "Elementor"
Step 3: Click Install Now, then Activate.

Install Essential Step 1: Go to plugins and click on add new


Addons for Step 2: Search for "Essential Addons for
Elementor Elementor"
Step 3: Click Install Now, then Activate.

Install WPForms Step 1: Go to plugins and click on add new


Step 2: Search for "WPForms"
Step 3: Click Install Now, then Activate.

Install Starter Step 1: Go to plugins and click on add new


Templates Step 2: Search for "Starter Templates"
Step 3: Click Install Now, then Activate.

Import a Starter Navigate to Starter Go to Appearance and click on Starter Templates.


Template Templates

Choose Your Browse the available templates and select one that
Template fits your portfolio style.
Customize Your Edit with Elementor Step 1: Go to Pages and click on All Pages
Home Page Step 2: Hover over your imported home page and
click Edit with Elementor.

Change Text and Click on any text block to edit the content.
Images
To change images, click on the image block,
choose Style then Choose Image, and upload your
photos.

Add Anchor Links Step 1: Select the section you want to link to.
Step 2: Go to Advanced then CSS ID and give it a
unique ID.

Add a Reviews Insert Reviews Inside Elementor, click the + button to add a new
Section Widget section. Drag and drop the Testimonials widget
from the left panel.

Create an Image Insert Image Add a new section by clicking the + button. Drag
Gallery Gallery and drop the Gallery widget from the left panel.

Upload Your Click on the widget, then Add Images.


Images

Enable Lightbox In the widget settings, find the Link option and set it
to Media File. This will enable the lightbox feature,
allowing users to view images in full-screen mode.

Add a Contact Insert Contact Form Add a new section and drag the WPForms widget
Form into it.

Create a Form Click Create a New Form. Use the drag-and-drop


builder to add fields like Name, Email, and
Message.

Add Create Service Add new sections for each service you offer. Use
Professional Sections Headings, Text Editor, and Icon Boxes to detail
Service Details your services.

Customize Each Edit the text and images to describe what you offer
Section clearly. Use the Icon Library to add relevant icons
to each service.

Final Touches Preview Your Site Click the eye icon at the bottom of the Elementor
and Launch panel to preview your site.
How to Build a Stunning Portfolio Website with Elementor & WordPress

Step 1: Install Essential Plugins

1. Install Elementor:
- Go to Plugins > Add New.
- Search for "Elementor" and click Install Now, then Activate.

2. Install Essential Addons for Elementor:


- Go to Plugins > Add New.
- Search for "Essential Addons for Elementor" and click Install Now, then Activate.

3. Install WPForms:
- Navigate to Plugins > Add New.
- Search for "WPForms" and click Install Now, then Activate.

5. Install Starter Templates:


- Go to Plugins > Add New.
- Search for "Starter Templates" and click Install Now, then Activate.

Step 2: Import a Starter Template

1. Navigate to Starter Templates:


- Go to Appearance > Starter Templates.

2. Choose Your Template:


- Browse the available templates and select one that fits your portfolio style.
- Click Import Complete Site or Import Template based on your preference.

Step 3: Customize Your Home Page with Elementor

1. Edit with Elementor:


- Go to Pages > All Pages.
- Hover over your imported home page and click Edit with Elementor.

2. Change Text and Images:


- Click on any text block to edit the content. Replace the placeholder text with your own.
- To change images, click on the image block, choose Style > Choose Image, and upload your
photos.
3. Add Anchor Links:
- To create anchor links, select the section you want to link to.
- Go to Advanced > CSS ID and give it a unique ID (e.g., "portfolio").
- Create a button or link and set the URL to `portfolio`.

Step 4: Add a Reviews Section

1. Insert Reviews Widget:


- Inside Elementor, click the + button to add a new section.
- Drag and drop the Testimonials widget from the left panel.

2. Customize Reviews:
- Click on the widget to edit text, add reviewers' names, and upload their photos if available.
- Adjust the style settings to match your site's theme.

Step 5: Create an Image Gallery with Lightbox

1. Insert Image Gallery:


- Add a new section by clicking the + button.
- Drag and drop the Gallery widget from the left panel.

2. Upload Your Images:


- Click on the widget, then Add Images.
- Select your best work and upload them.

3. Enable Lightbox:
- In the widget settings, find the Link option and set it to Media File.
- This will enable the lightbox feature, allowing users to view images in a full-screen mode.

Step 6: Add a Contact Form

1. Insert Contact Form:


- Add a new section and drag the WPForms widget into it.

2. Create a Form:
- Click Create a New Form.
- Use the drag-and-drop builder to add fields like Name, Email, and Message.

3. Customize and Save:


- Customize the form to your needs and click Save.
- Return to Elementor and select your new form from the dropdown in the WPForms widget
settings.
Step 7: Add Professional Service Details

1. Create Service Sections:


- Add new sections for each service you offer.
- Use Headings, Text Editor, and Icon Boxes to detail your services.

2. Customize Each Section:


- Edit the text and images to describe what you offer clearly.
- Use the Icon Library to add relevant icons to each service.

Step 8: Final Touches and Launch

1. Preview Your Site:


- Click the eye icon at the bottom of the Elementor panel to preview your site.

2. Make Final Adjustments:


- Check for any inconsistencies or areas that need improvement.

3. Publish Your Site:


- Once satisfied, click the Update button to publish your changes.

You might also like