Create a new file on Github and make a pull request - more details below
or
If you don't have or want an account on Github copy content of this file, edit the file to your liking and then send the file to me and I'll generate for page manually. My email is email
How to generate portfolio page in detail
Sign in or Sign up on Github
Fork the repository
Create a new file HERE. Name it desired-name.md and paste the content from this file file
Now replace existing text with your information. Every piece of information is optional. Remove what you don't need or what doesn't apply to your case.
The example page is approximately what your page will look like: here. Keep in mind the base URL might (but probably won't) change at any point.
You can also download the repo, generate your portfolio page and host it on your own.
MD file breakdown
Section
Description
header
Has 3 sections and is fixed when scrolling. You can use two or only one section. Just keep the text short
Section
Block
Description
page
You can customize page colors here. By default it's white text on black background
customColors
Set to true if you want to use custom colors
transition_left
Color of the left half of the loading animation
transition_right
Color of the right half of the loading animation
background
Color of the page background
color
Color of the text on the page
Section
Block
Element
Description
head
This section isn't shown on the screen but it holds information used when sharing the page on social media
font
Use googlefonts for this. Pick a typeface you want to use and paste its link here. Defaults to Poppins (sans-serif) if no custom typeface was set. Keep in mind you will need font weights 300, 500 and 700 for best results. The page was designed with Poppins and it fits the layout perfectly. Serif fonts will not look great.
Select styles you need - font example. From the sidebar on the right copy the href value from the code snippet <link href="https://fonts.googleapis.com/css2?family=Zilla+Slab&display=swap" rel="stylesheet">. Should look something like this https://fonts.googleapis.com/css2?family=Zilla+Slab&display=swap
meta
this information is shown when someone googles your name or when you share the link to your portfolio page on social media
site_name
Shows up when sharing on discord and possibly other platforms
title
Shows your name
description
Describe who you are and what you do in about 20 words
banner_url
You can create an image that will be shown when sharing page. Recommended dimensions are 1200px x 630px. Use services like postimage to host your image
theme_color
Theme color is the color of the address bar on android devices
Share card previews
Section
Block
Description
intro
Introduce yourself here
title
Section title shown in the left column
description
Shown on the right. Divide each paragraph like in the example. You can input emojis or html snippets if you need to
Section
Description
about
Layout is the same as in the intro section
Section
Block
List
Element
Description
skills
List your competences here
title
Section title shown in the left column
category
You can use one or more categories. Just keep at least one
title
You can categorize your skills if needed by giving it a title
tools
You can list the tools you are using by giving them a name
name
Name the software or tool you are using
Section
Block
Element
Image
Description
work
You can link your projects here
title
Section title shown in the left column
project
Lists your projects. Needs text to show and URL
text
Text to be shown on the screen
url
Link to the social media page
image
If needed add a preview image
url
Upload an image to postimage and paste the direct link here
description
Describe what's on the image for accessibility reasons
Section
Block
Element
Description
socials
Link your social media here
title
Section title shown in the left column
network
Lists social networks you decide to set
text
Text to be shown on the screen
url
Link to the social media page
Section
Block
Element
Description
footer
Final section on the page
email
Setup your email template here
address
Your email address goes here
subject
Placeholder subject of the message
body
Placeholder body of the message
Show option
Option
Description
show
Show option is in most Sections. Set to true if you want the block to be shown. Any other value will hide the section. Useful if you want to keep information you've put in but not show at all times