Complete Website

how to make portfolio website for graphic designer | Step by step Tutorial

In this tutorial, I will show you how to make a portfolio website in WordPress which is specifically for a graphic designer. This is a complete step-by-step tutorial and beginner friendly. If you don’t have any previous experience, you can also make your own portfolio website only by following this video. Now let’s have a look at some basic steps

Step 1 : Purchase Domain & Hosting. If you already have domain and hosting, you can skip this part.

Step 2 : Install wordpress

Step 3 : Install Theme (Royal Elementor Kit)

Step 4: Install Necessary Plugins (Elementor, Royal Elementor Addons, Portfolio for Elementor, Contact Form 7, Disable Gutenberg)

Step 5: Create the home page, Set that page as front page.

Step 6: Add all portfolio items which you have.

Step 7: Download the zip file from here. You will find several files inside. Import header, footer, home and single portfolio page.

Add custom CSS which is using for single portfolio page

Step 8: Finally, Replace all dummy content with your own content and we are good to go.

Essential Links

Get Domain & Webhosting(60% off)

CSS code

Download zip file

CSS Code

/****------ for single portfolio---*****/
.single-elemenfolio .post-categories, .single-elemenfolio .post-meta,.single-elemenfolio  .post-footer {
	display: none;
}
.single-elemenfolio .post-media {
	position: absolute;
	right: 0;
}
.single-elemenfolio .post-media img {
	max-height: 357px;
	width: auto;
}
.single-elemenfolio .post-header {
	padding: 150px 0;
	background: #000;
}
.single-elemenfolio{
	background:#111;
}
.re-theme-post .post-title {
	text-align: center;
	color: #fff;
	font-family: poppins;
	font-size: 50px;
	max-width: 1140px;
	margin: auto !important;
	position: relative;
	text-shadow: 1px 2px 8px rgba(0,0,0,.7);
}
@media screen and (max-width: 480px) {
.single-elemenfolio .post-media img {
	display:none;
	}
.re-theme-post .post-title {
	font-size: 30px;
	}
.single-elemenfolio .post-header {
		padding: 100px 0;
	}
}

Download all files

Where should I send you this file?

    Need this built rather than explained?

    Send me the project details and I will suggest the right approach.

    Start a Project