Customization

Tips and tricks for customizing your portfolio

Adding Bold Text in About Section

Make important words stand out in your about paragraphs

Example:

aboutMe: [ "I specialize in <span class='text-white font-bold'>Full Stack Development</span>" ]

Result: The text "Full Stack Development" will appear in white and bold

Adding/Removing Services

Customize your services section

To Add a Service:

Copy an existing service block and modify:

{
  icon: "fas fa-camera",
  title: "Photography",
  description: "Professional photography services for events and portraits.",
  technologies: ["Canon", "Lightroom", "Photoshop"]
},

To Remove a Service:

Comment out or delete the entire block:

// {
//  icon: "fas fa-code",
//  title: "Web Development",
//  technologies: ["HTML", "CSS"]
// },

Adding/Removing Portfolio Projects

Manage your portfolio showcase

To Add a Project:

  1. 1. Add project screenshot to assets/images/portfolio/
  2. 2. Copy existing project block in config.js
  3. 3. Update all fields with your project info
  4. 4. Make sure category matches a filter value

To Remove a Project:

Delete or comment out the entire project block

⚠️ Important: Project category must match one of your filter values for filtering to work correctly

Adding/Removing Social Media

Customize your social media links

To Add Social Media:

Add a new line in the social array:

{name: "youtube", icon: "fab fa-youtube", url: "https://youtube.com/@yourname"},

Find Font Awesome icons at: fontawesome.com/icons

To Remove Social Media:

Delete the line or comment it out:

// {name: "twitter", icon: "fab fa-twitter", url: "#"},

Changing Filter Layout

Control how portfolio filters are displayed

Horizontal Scroll

filtersScrollable: true

Filters scroll horizontally on mobile - good for many filters

Wrap to Rows

filtersScrollable: false

Filters wrap to multiple rows - good for few filters

Using Different CV Files

You can use different CV files for Hero and About sections

Use Case Examples:

  • • Short CV in Hero, detailed CV in About
  • • Different CV versions for different audiences
  • • Portfolio PDF in Hero, resume in About

💡 Tip: You can also use the same file for both sections if you prefer

Image Optimization Tips

Optimize images for better performance

Profile Images

  • • Recommended: 500x500px
  • • Format: JPG or PNG
  • • Max size: 200KB

Portfolio Screenshots

  • • Recommended: 1200x800px
  • • Format: JPG or PNG
  • • Max size: 500KB

Free Tools: Use TinyPNG.com or Squoosh.app to compress images

🎨 Get Creative!

These are just the basics. Feel free to experiment with different content, images, and configurations to make your portfolio unique!

Troubleshooting Guide →