Main

How to make Free WordPress Portfolio Website | Best tutorial-Responsive, Animated Personal Portfolio

Have you ever wondered how people create beautiful and responsive portfolio websites and include them in their bio? Do you also want to build a personal portfolio website without spending any money? Well, you're in the right place! This Portfolio website tutorial will guide you how to make a Portfolio website. You'll discover how to make your website responsive, animated, and personalized to showcase your work effectively. Don't worry about the cost; we'll show you how to do it for free! We'll even walk you through obtaining a free domain, free hosting, and SSL certification to ensure your portfolio website is secure and professional. Give it a try, and you'll be thrilled to see your own free, responsive and best personal WordPress Portfolio Website come to life. Chapters- 00:00 Portfolio Website Demo 03:00 Free Hosting, Domain 05:18 Free HTTPS or SSL Certificate 07:21 Installing theme for Portfolio Website 09:02 Creating Menus with Icons in WordPress 11:18 Personalizing the WordPress Theme 13:35 Plugin Installation on WordPress 15:01 Designing Landing Page for Portfolio Website 21:45 Designing About Me page fof Portfolio Website 40:09 Designing Resume Page for Portfolio Website 48:16 Designing Portfolio Page for Portfolio Website 50:12 Designing Contact Us Page for Portfolio Website 52:00 Editing Footer section in WordPress website #portfolio #portfoliotemplate #portfólio #portfoliodesign #portfoliomanager #portfolioupdate #portfoliowebsite #free #freewebsite #freewebdesigntutorials #freewebsites #freewebsitebuilder #freewebsitetraffic #cv #resume #cvs #resumebuilder #resumebuilding #linkedintips #linkedinprofile #linkedinprofiletips #wordpress #wordpresstutorial #wordpresstips #wordpresswebdesign #wordpresswebsitedesign #wordpresswebsite #wordpresswebsites #personalportfolio #responsivewebsite #bestwebsites #bestportfolio #bestportfoliotemplates

Elevate MySkill

5 months ago

Take a moment to explore this remarkable  portfolio website, see the animated text, showcasing his professional skill. Look at the  perfect picture, look at this button. One lets you download their CV and the other helps  you hire them. There are social media icons, so you can stay connected. Wait that's not enough,  there's an about us section that provides loads and loads information about the person. These are  the services that he provides. These are some of the cool facts about him. Once we
scroll down,  this is the pricing section, this shows all the prices, if someone wants to hire him. This is a  must have for a freelancer. All the testimonials depicting the images of the client, the rating and  the proper reviews. These are all the clients that he has worked with. Now once we go to his resume  section. We can find all the education background, depecting all the timelines that he has done.  This is all the experience that the person has. The companies that he has worked with. 
The position that he has held and and these are all the skills. See, look at the wheel how  it pops up. Next up is the portfolio section, which is a treasure of all the work that he has  done. Multiple tabs highlights his skills in various areas. You can add all the projects that  you have done. Finally there's a contact-us page, where all the client can message you and get  in touch with you. Wait this website works perfectly on your mobile phone devices. See this  mobile phone screen, how it h
as taken the correct shape .If you go to about-me section. You can see  everything about him, the services again the fun factors, these are pricing perfectly taking the  shape. All the testimonials coming up,the clients. If you move to resume section, these  are all the educations that he has done, the experience that he holds, the skills  again, look at the wheel how it is popping up. This is the portfolio page and then comes the  contact-us page. Now you might be thinking, whether you are a fr
eelancer, college  student or someone looking out for a job, wouldn't it be great to have website that showcase  your skills and work. Helping you stand out from the crowd. After seeing that beautiful website,  you might be wondering how much does it cost to create something like this? or do I need technical  skills? Well well well !!! here's a good news you don't have to spend a penny and you don't need  any Tech skills to build. Stick around till the end of this video and I'll show you how to 
create this fantastic website. No matter where you are in your career Journey you don't want  to miss this opportunity to enhance your career, without spending any money. To create website  you should you need two things hosting and DNS hosting. Hosting is like a home for websites data  and DNS is like the address that directs people to your hosting. To get free DNS and hosting, we'll  use Infinityfree. Simply sign up on Infinity free. Once you have signed up on Infinityfree.  Let's login on In
finity free. Click on create an account now. Write down the subdomain that you  want. Click on check availability. It's available, we'll scroll down. Click on create account and  click on open control panel. Control panel is opening for us. We'll click on I approve. Now  search for softaculous, we click on softaculous. It's saying something went wrong. Just refresh it.  And now it is open. We'll install WordPress. Click on install, scroll down, write down the admin  username and password. Keep i
t very strong. Now click on install. Now the WordPress is installing  on your hosting. It will take some time, yeah now this is installed. It has given me two  links, the first one is URL for a website. The website is quite basic right now. The second URL  is for the dashboard of your WordPress. This is the first look of your WordPress dashboard. Now  we'll be securing our website by installing SSL. As you can see on our website, the website is  not secure. We'll go to Infinity dashboard home. C
lick on free SSL. And new SSL certificate.  We'll write down our domain name add choose SSL provider. Click on create order. Now we  replacing the CName Records that are present, with the CName record that we have got right  now. We'll search for CName records. I'll copy the record name and paste it over here. Now copy  the destination address and paste it. And click on add. Now let's go back to the previous page and  refresh this. Keep refreshing this, it takes some time. Now this current desti
nation is ready. We'll  click on request certificate. Now it's requesting certificate and we have got the certificate. We'll  click on show certificate, this is the private key and the certificate. We'll go to CPanel and copy  these private key and certificate there. In CPanel search for SSL. Click on configure. And paste  the private key and upload key. Now similarly we copy the certificate. Copy the certificate here  and paste the certificate over here and upload certificate. Now we'll change
the address and add  https own here. And refresh this, the website is not ready right. Now we'll keep refreshing it  and now you can see we have got the site lock. The site lock is there, that signifies our website  is secure and this can be trusted by users. Even our WordPress dashboard is secure now. If you have  followed this video along then give a pat on your back, for the fantastic job that you have done. If  you would have hired someone for setting up this basic website and installing SSL
, this could have  costed you around $100. So let's not stop here, let's together create a website that I've shown  you at the start of the video. Now we'll be installing the theme for a portfolio website.  We'll click on appearance. We'll delete all the present themes right now. Click on theme, click on  delete now. Now we'll click on Add new and search for Personal CV Resume. And we'll be installing  the first link. Click on install and click on activate now. Now let's see how our website look
.  It's quite basic, it doesn't have any specific pages, but it's a good start. Now we'll be adding  all the important pages for our portfolio website. Click on pages. Now we delete all those pages.  Click on bulk action and move to trash and apply. add new, just write down the page name as  home, click on publish and publish. Click on the W icon. Similarly we'll be adding more pages.  About Me section, publish. Now add Contact Me. Now let's add resume page. Let's add portfolio. Now we'll be cre
ating menu for the portfolio website. Now we'll be adding a menu for all the  pages that we have created. To add icon with each menu item, we'll install plugin. We'll click on  plugin. Now I want to delete all those plugins. We'll click on bulk action and deactivate it.  And again select all the plugins here and then delete. It frees a lot of space. Do this every  time when you start fresh. Now click on add new, and now we'll search for menu icons. We'll be  installing the first plugin here and
click on activate. Menu icons is installed now. Now we'll  click on appearance and menus. The menu is already created, we will change its name to primary  menu. Now what you can do is, you can remove this custom page. And these are the pages that we  have created. Now you can reshuffle these pages. I want home page to be up. Click on create menu now Now your menu is created. Click on each menu you'll get an option to add icon with. I'll  choose home, click on select. Similarly we'll do this for
about me, we'll add icon here,  learn mode. Click select. For contact me I'll search for phone and  then select. Similarly for portfolio, I'll search for ID and for resume I'll search for Doc. Now we'll click on Save menu. Now let's give your site a unique and a  captivating makeover by customizing the theme that we have already installed. Now let's go to our  website, we'll hit refresh and click on customize. Now let's go to site identity, you can write the  site title as your name. I'm writing
John Smith here, as that's my favorite character. I'll keep  tagline as blank. We'll add the logo as a image. I'll upload my profile pic and click select. Crop this image and now your logo is visible. As you can see there's no icon on the tab, that's called  a fav icon. We'll be changing this fav icon. We'll be using the same Profile Pic image and click  on crop. And as you can see on the preview section we have got this image. We'll go back. Now go to menus, click on the primary menu and this
is our primary menu. I'll select  this primary menu as the default menu and now you can see we have got all  the icons with the menu there. Isn't it looking awesome? Yeah. See  how we how the color changes Now click on home page setting. Instead of the  static page, we'll be adding a home page as the default display page for the home. And click  on the Publish. We'll close this and you can see Fav icon is there. Now I want to change  the order of this menu. I'll pull resume up, oh it has become
Sub menu. I'll be pulling portfolio up and click on publish. We will be installing elementor. Elementor is  like a magic tool for building WordPress website, where you can easily drag and drop elements to  create your website without any coding knowledge element. Elementor is a freemium plugin, that is  few things are paid while the other are free. In order to get the benefits of all those premium  features we'll be installing some of the add-ons. We'll click on plugin, add new and write down  e
lementor. Click on install now. It's installing and once installed click on activate. Again we'll be searching for other  plugin, we'll write down royal elementor So we'll installing the first plugin that  comes up. And click on activate. We'll allow and continue. And again in the plugin we'll  click on add new. This the third and the final plugin that we are installing. I'll close this  and now I'll search for elements elementskit. Click on install now and activate. Now let's jump into the real
magic of  Designing our landing page. We'll click on pages, all pages and on the homepage  we'll click on edit with elementor. now on the widget section. I'll search for image. We'll choose image. Now I'll choose my profile pic. We'll change the size  of this image to thumbnail Add in this style section we'll add  borders. I'll add the border of 200, to make it round and click on update. Look at this  image. Now I'll search for other widget headings. Click on heading We'll adding the person nam
e over here.  I'll add John Smith. I'll type John Smith here. Now let's change it size to XXL and  Alignment to center. Now we'll go to style section and we'll change the text color. Here we  cannot see black color I'll click on settings. And for the primary color, I'll  change that to Black or you can write hash 5 time 0 or you can drag this cursor. We'll go back and save the settings. Now let's close site setting and  from text color we'll choose black. Now on this widget icon, we'll search  f
or advanced text. Now I'll choose this from royal kit. So in the prefix text  I'll write down something that will remain static. I'm writing down 'I'm a  professional'. And in the animated text I'll write down something that I want to  animate. So I'll remove this best websites and write down software developer. So on the  right hand side you can see how this software developer is getting animated. I'll remove this  amazing plugin and write down website designer. And in the style we'll go to ada
nce text and  change the text color to green and typing color to green. And in the content I'll  make it Center Aline and click on update. Now on the widget icon I'll search for  dual button. And again I'll choose this one royalkit. And for the first button  I write down the text as download CV. And on the second button  I'll write down 'Hire me'. Now you can give the link of your  CV over here. And for the first button icon I'll choose the icon  library and search for download. I'll choose the
second icon and click on insert. Now for the second button I'll choose other  icon. Click search for hire and click on insert. Now I'll change the position  for this icon to the left side. Now in the style section, for the first  button I'll change the background type as black. And once you hover it I'll  change the background color to Green. For the second button, again, the background color  as black and on hover background color has green. Now look at this how it does  looking. Click on updat
e. Now let's go back to our website. See this  amazing page. The amazing the landing page that we have developed. Now let's go to  our WordPress dashboard. Go to Media, add new and here I'll select a file, my resume.  My resume is uploaded. I'll copy the the URL. Now let's go back to Elementor. For the first  button. I'll write down the URL for my PDF and on the setting icon I'll write down open in new  tab. and click on update. now refresh this page. Now we can click on this download CV icon  a
nd you can see your cv is opening. There anyone can download it. That is nice. And on  hire me, also so you can add another link. Now I'll be adding another widget as social  icons. These are the social icons that have come up. I'll add one more as LinkedIn. Click  on WordPress. Change the icon Library ,search for linkedIn and click on insert. Now LinkedIn  ion is there. Such an easy task. You can write down the links if you want. I'll change  the shape to Circle and click on update. Now I'll ch
ange how it looks on hovering. Go to style and on icon hover  we'll choose the animation. Okay, I like this pop one. I'll choose that pop and  now you can see how it is popping out. This is such a nice way now I'll write a the  link for my LinkedIn and click on update. Now we'll be crafting in about me page for our  website. This page will have various aspect of his profile. It will introduce him provide  insight into his background. Additionally we will highlight Services he offers. To make the
  page more engaging we'll include interesting fact about his services and notably achievements.  Furthermore we'll outline his pricing plan making it easy for visitor to understand their  options. Lastly we'll showcase testimonials from satisfied clients, adding credibility to his  work and services. Now we'll click on about me. Click on edit page. Click on edit with elementeor And once we are at the page  we'll search for widget heading. And here we write down the name of  the person like John
Smith here. We'll go to style, click on topography  we'll make the weight as 500. Now we'll be adding another heading, and here  we'll be writing a short introduction to him like web designer. We'll click on topography and choose  300 as weight. Now go back to content and make the size as medium, alignment left align. Now let's  search for text editor. And now you can write down all the information about him. I have copy pasted  here. I'll remove all the white spaces. And click on update. Now t
his is the About Me section.  Now let's add another section of services. We'll click on this plus icon this will create a  container. And inside this container. Just choose this container and inside this container let's add  a widget as dual heading. This is again from Royal kit. And I'll remove show description and show  icon. We'll make it left aligned. And the primary heading, I'll make it at *, and and heading as Services. We'll go to style topography. For the primary  heading, I want that t
o be very bold so I'll choose the maximum as 900 weight and the  color as green. For the secondary heading, let's choose the text color as green. Green  doesn't looks good. I'll make it black. Now black looks good. Now let's add some margin,  like I'm adding 20 margin from all the sides. Now I'll be saving this as a template so that I  can use it later. Save it as heading and save. This will appear in my templates.  Now click on elements kit, click on sections and click on category  drop down an
d now we'll click on icon box. Just scroll down, the icon box style 20 looks  good to me I'll choose that and then click on insert. You can see how beautiful ion  box is there. We'll remove this heading, I don't want it. These are the  six columns ,3 X 3 matrix that is created. I'll remove the second  one from each of the columns. Okay, now it's 2 X 2 for me. That looks good to me.  Now we'll select the column and go to advance and unlink this margin. For the top I'll write  down as -114 so this
whole column has moved up. Now we'll go to style. For the content, I want to change the heading to  Green. We will click on this color as green. This looks similar to my theme now. And similarly  I'll do this for all the icon boxes. Click on content and change the color to green for all  the four boxes. I'm fast forwarding this now. Go the style content and make it green. So  now this looks similar. Now what we can do is for the background overlay, I'll show you.  We can make this to green. So
you can see the difference blue with background and green. I'll  do this for all of them, all the blue as green. On hover make it green, on hover make this also  background overlay as green. Now now that is done. Now this looking nice. So service section is done/ We'll copy the  service and paste it into this container. Let's see in the margin first, so we'll unlink  this and make it minus 90 so that it moves up. Now let's see the content of this I'll  write down this as fun facts. Now I'll be l
isting some of the achievements of this  particular person. Again you don't have to code out anything. We'll be choosing Element  kit and now we'll be searching for fun fact. Control +F fun fact, and then we'll  choose fun fact. I like the first fun fact the Section 8 one, we click on  this one and now click on insert. Okay, I'll just remove this and then click on insert. Now just open the section. Within  the section there's an heading, I'll remove that heading. Now there are four fun  facts th
at is listed over here. I'll choose this section. There's a background as you can see  a greyish background. We'll click on style, go to color and then remove this background. Click  on clear and again I choose this and now I want to move it up. We'll click on advance and on the  margin, I'll make it minus 120. It looks good to me. Click on update now. Now you can edit  the support given, some of these many things, according to the achievements that you have.  Now I'll change the icons, like mak
e it green for me. Click on style and make the color as  green. Again I'll choose for the other one. Go to style and click the color as green. For the  third one also, we'll go to column, select it, click on style, make the color as green. Similarly  for the fourth one, style and color as green. Perfect! Now again I'll copy this heading and then paste  it over here. This is, this heading is quite up. Let's change the content first. I'll write down  pricing plan. We'll make this pricing plan very
professional. I'll just click on Advance now  first. I'll change it, I'll move it down, make it 40, 40 is a good alignment. You can experiment  over here, the numbers that looks good to you. Okay, 45 is even better.  I'll just click on update. Click on element skit and search for pricing  table. Control F, pricing table, yeah, I'll choose this one. So section 20 looks good to  me and click on this one and click on insert. So again this is a background, then remove that  background first. Let's
go to style and go to color background and then clear this. Okay  this is now clear. We don't want the heading, just clip on this heading. This whole column can  be deleted. I'lI just delete this column. This is not deleted I guess, I'll just try it again. Now this is another way of deleting the columns. We'll go to advance and try to move this  prizing section above. From the margin, I'll unlink it and make it minus 40. On the style  section we'll be building the pricing Table for the first one
. Now look at this button, we we  change the color of this button to Green. Yeah, okay! Now let's add some Border as  solid, let's change the width of this border. One is the width right now, we'll change  it to two and Link it. Now everything is two from all the sides. Okay, right now you'll not  see it, I'll just show you seeing hovering it. Yeah now it is purple, as on hover it is  giving purple color. Now change the Border color to Green. Yeah now it is looking fine.  Now I'lll go to hover s
ection and then change the color from purple to Green. So now when  you are hovering it it's giving us green. This is looking nice and beautiful. Now let's  go to content. We'll click on features. These are three features that are there, we'll  edit these features. I'll remove this 15 email account as web development. For 100  GB data I'll write out advertisements. We'll remove this one also and write down  game development and we can add new also. Click on pricing tag and I'll be  changing the
pricing tag to $10 per hour. You can add your pricing as  you want. We'll click on Style. We'll go to head a section and I'll just remove  these images and I'll choose icon. Icon library. Now I'll search for pie chart. This  looks good to me. Now we'll add this icon and now now I'll delete all the other pricing tables and I'll just copy this one.  We'll remove the second and third one And paste it over here. Again I'll  paste the last one into this corner. These are three pricing tables. Now  wh
at I'll do is I'll just edit this table. I'll write it as regular ,for the  second plan I'll write it as premium. And for the third plan let's write it as  corporate. And let's see the images for corporate, I'll use this plane. And then click insert. For  the second premium plan I'll change the image to handshake. And now we'll change the pricing  for each of the plan. Regular is correct for me. Now let's go to premium and then let's change the  pricing to like $23 an hour. And for the corporate
let's make it something like $30, yep $30, $40  works for me. 40 is good. Let's click on update. Now we refresh the About Me section. Now you can see how the services has come.  The fun facts are raising and the pricing is coming. Such a beautiful pricing plan, such a  beautiful thing. You have not coded anything, just see how the hovers are working  the hover on this prising is working. Now I'll just minimize it. Now I'll just copy this  dual heading. Then copy and paste it on container. Let's
go to advance and just move  it a little bit down. zero is good, yeah. Now I'll change the content over  here. I'll write it as testimonials. Again we go to elementskit and we'll search for  testimonials. Control + F testimonial. Yeah, I've got it. I click on this one. We'll just  scroll down. Okay, this section 18 looks good to me. I'll just click on it. Yeah, it  looks good to me I'll just insert it. Again we'll go back to settings and remove the  background. Click on custom and clear. Now I'
ll remove the heading, choose this one clear the  heading. Okay, so this is my testimonial section. If you go over here, on the settings. We'll make  some changes here. These arrows are looking quite ugly. I'll remove those arrows. I'll enable the  loop. Yeah, auto play is also enabled. And let's increase the speed to 2,000. Click on update.  This is how it looks, I'll just refresh it. How beautiful it is, that testimonial, the spacing  is quite good but I can bring testimonial a little bit down
. I just choose testimonial, click on  Advanced and just making a little bit down. Yeah, 10 works. So now we'll go to testimonial settings  and make the color as green. Yeah this nice. And then let's go to this dot section in the style  and we'll go down. And change the color as green. Okay as you can see. Now all the dots are of green  color. And in the testimonials what you can do is, you can change all those testimonials. You can add  a new testimonial altogether. You can change the ratings a
nd here you can change the designation  that it holds. Like for the second one, let's do some edit, we'll change the name  the client to powel add it's designation. And click on update. Here you can change  the images as well. That looks very nice. Okay, now let's copy this testimonial and  then let's go down and paste it. Okay, testimonial looks good. Just  change it's heading to clients. Okay now let's click on elementskit.  And search for clients. Clients logo, yep, the first one looks good t
o me. I'll  click on this one. Yeah, lets insert it. We'll choose the whole. Click on  style and remove the background. And now we'll remove this heading as well.  Just remove this heading. So these are all the clients and logos that are coming. Let's  go to the margin, just move it a little bit above. It's white down, minus 70 looks, but  you can experiment it according to yourself. Now you can add your logos as. Well I'll  go to settings. Now we'll increase the speed to 2,000. And pause on ove
r is on.  That looks okay. The rest of settings are good and even loop. And just do  it. Okay I'll just add four slides, you can experiment with it. Again  like 3,2,1 whatever you want. Okay we'll minimize this settings. Go to  style and click on Logo. Now we'll go to this logo and change the colors to Green.  Again for the second color also as green. Now you can see it aligns with our website  color. Now we'll will minimize this. On the dot again what I'll do is, I'll just  scroll down and chan
ge that screen. Yes we'll just change this spacing, top to  bottom. Now you can again experiment. This this is how your website looks on the about  me page. We are going to develop a resume page that provides a detailed look at his  education history showcasing his academic Excellence. We'll also highlight his work  experience, listing all the job that he had, and the position that he has held. Additionally  we'll also showcase his skills that makes him a valuable candidate. Now let's go to resu
me  page. And edit with Elementor. We'll click on this template icon. Click on my templates and  choose the heading. Click on insert and apply. Now let's edit the services and write education. Now we'll be adding education history. For this let's go to elementskit and search  for icon box. And then we choose the first one the 13 style. And click on insert.  So we'll remove this heading. Click on delete. Now we'll choose this column and  for the margin we'll try to move it up. 90 looks good to me
. So for each column, for  3x3 column we'll remove all the last rows. So we'll delete this column and now it's a 2x2  container for me. I'll select the icon box. And enable equal Heights. And go to style  and for the color we'll choose green. And for the content I'll just remove this icon now.  Okay, and now for the title I'll add the degree that I have had. Like the masters of Business  Administration and now what you can do is you can add your college and then the year and a  small snippet abo
ut it. Now let's go to style, go to content. For the headings we'll  choose green color and we just remove blue. We'll delete all the icon boxes now. And the fourth one also we'll delete  it. Now what we'll do is we'll copy the icon box that we have already made,  that we have already styled and paste. We'll paste the last one. Also now what you can  do is, you can go to each icon box and edit your quantifications. Like here I can write Bachelor's  of technology and you can edit the year. You ca
n change it to secondary education. Higher secondary school. So now your education is  ready so what we'll do is we'll copy this heading. And now we'll paste this heading. Now  let's chnage the content of this heading. I'll write down experience. Now to add experience timeline, we'll use  Royal element add-ons. Click on block and from the category we'll try to  find out the post timeline. The first one looks good to me. We'll  click on it and click on insert. Now let's delete this heading. This
looks quite good. We'll remove  this unnecessary section there. So we'll go to timeline items. For the first one. For the first one, we'll write secondary heading. In the secondary heading  we'll be writing the designation. And in the item title we'll write down the  company name. I'll write down Google here. Now I'll search for Google. You can also upload icons. So, we'll click on the style and change the  color to Green. That matches with the theme that's why I'm doing it. If you want to have 
company icons differently, you can do that. So for the second timeline item I'll do the  same thing. I'll update the designation and update the icon I'll choose Facebook here.  And write down the item title as Facebook. So for Facebook we'll click on style and change  the color to green. And for the third company, I'll write down the secondary heading as the  designation so for this one we'll write down as Tech lead and for the icon I'll choose Amazon  and let's change the item title to Amazon.
And in the style, we'll change the color.  So for the third company, I'll write down the secondary heading as manager. Item title as  apple and for the icon Library I'll choose Apple. I'll choose the second icon and again we'll  do the style thing and change it to green. For, inside the style we'll go to main  line and change the color to Green. So now you can see. Now let's create skill  section. So we'll paste this heading and we'll edit this heading we'll replace  education and write down sk
ill over here. Now we'll click on this plus icon for container  and we'll choose four by four. matrix. So for the first one we search for Progress  line and uh we'll change the layout to Circular. Okay and we'll change the title as Java right  now. And you can increase this count value as 98. We'll click on this style and change the  background color to green. Or you can click on this one and change it. Okay, So for the title  topography we'll just change this size to 18, so that it becomes a li
ttle bigger. And  now we'll increase the weight to 600 and click on update. So we have created one  skills section. Now we'll go there and copy this progress bar and paste it,  on all the containers. Just paste it. Now just go to the second  and the third containers, update the topic. Like the web development  that I want to write over here. And you can update the percentage also. For the second  container, you can again update the title like like the AWS. And we increase.  We'll change the coun
t value as 88. And for the fourth one, I'll update  this as data structure and algorithm. And I'll also change this count value. Now hit the update button so this is  how your resume looks, the education, this timeline section, and such a beautiful  skills, see the wheels. How they are popping up!! Isn't it very nice. Yeah now we'll be developing  a portfolio page where you can add multiple tab dedicated to showcasing your skill and linking to  your project. So in the portfolio page we'll paste
the template we click on insert and your heading  there. We will change this heading to portfolio. Now to add portfolio we'll go to Element kit and search for tabs. So this second tab  looks good to me. I'll choose that. Okay, now just remove this background now.  Go to Styles and color and clear this. So the background is transparent now. Now what we'll do  is we'll remove this heading. Click on headings and delete. Now what I want is, I want to move  this inner section, a little bit above. So
we'll unlink this margin and make it minus 90. -90  looks good to me. So now in this inner section you have multiple tabs. So I'll choose this. So  in this content, you can make changes, like I want to make change as Java for the second tab,  for the third tab I'll write down CV building. And for the fourth tab we'll write down web  development. So now you can add multiple links to your project, that are live or you want  to showcase. So this how I have written it for WordPress. Similarly you ca
n write it down  for your. So we'll hit the update ,let's go to the section. This is how it looks, so wonderful  so neatly designed. That's what I want. Let's design a contact us form on our website  for clients to easily connect and submit the inquiries. So now we'll go to plugins. Click  on add new and now we'll search for contact form. We'll install this contact form by WP forms. Click on activate. Now we'll go to WP forms and form  templates. And click on available templates. We'll choose a
simple  contact form and click on create form. Now the form is being created  and you can edit this form also. So I'm interested with this WP short code. I'll copy this. Let's go to contact  us page and click on edit page. And then click on edit with Elementor here  I'll copy The Heading and insert from template. Click on apply and let's change this heading  to contact me. Connect with me, sorry. And now for this plus icon, from  the widget I'll add short code. And I'll paste the short code that
I  copied. Oh!! something else was also copied, I'll just remove the part. Now this all  is there. We just click on update. So you have created a contact us  form without doing anything. You might have noticed that our footer section  is not looking good. It's giving backlink to the original Creator. We'll customize it to make  it better and reflect our unique identity. So let's go back to our WordPress dashboard  and the plugin we'll search for theme editor. And then we'll be installing the  s
econd option and click on activate. And now click on appearance and theme code editor.  We'll go to classes folder and then click on class footer.php scroll down to line number 92 and then  we can delete this whole 91 and 92, that's it. And scroll down further and click on update file.  You can also add if you want something. I just wanted to remove that. So we'll go back to our  website and onto our homepage, and now you can see there's nothing clumsy you have a clean look  and a clean footer s
ection. That's really awesome. That's all from my side, if you have  any questions feel free to comment below. I'll reply to all of them. If you  like our content please like share and subscribe for more such videos. Thanks for watching bye-by

Comments