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.
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?