Instructions

Click here for a video demonstrating customization. Each section of the portfolio is listed below along with instructions on how to customize it. Again, feel free to customize and edit the site as you wish to fit your needs. To change the colors, refer to the section at the end titled "Colors". To change the text sizes or fonts, refer to the section at the end titled "Text Sizes and Fonts".

  1. Image:

    Replace "image.png" with the link/file path to the image you want to feature on the website and replace "User's image" with the alt text for the image (text displayed if the image does not load).

    Code Snippet

  2. Name:

    Replace "Your name" with your name.

    Code Snippet

  3. About Me:

    Replace the placeholder text with a description of yourself.

    Code Snippet

  4. Links

    Replace the "#" with the link to the site that you want to link to and replace "Lorem ipsum" with the title of the link. Add or remove links as needed.

    Note: The div that contains links is inside another div named "links-contact".

    Code Snippet

  5. Contact:

    Replace "Your email" with your email and "Your phone number" with your phone number (feel free to add or remove mentods of contact).

    Note: The div that contains contact is inside another div named "links-contact"

    Code Snippet

  6. Resume:

    Replace "#" with a link to your resume.

    Code Snippet

  7. Euducation:

    Replace "Lorem ipsum" with each point of euducation. Add or remove points as needed.

    Code Snippet

  8. Experience:

    Replace "Lorem ipsum" with each point of experience. Add or remove points as needed.

    Code Snippet

  9. Skills:

    Replace "Lorem ipsum" with each skill that you want to display. Add or remove skills as needed.

    Code Snippet

  10. Awards and Recognition:

    Replace "Lorem ipsum" with each award or recognition that you have recieved. Add or remove awards or recognitions as needed.

    Code Snippet

  11. Portfolio:

    Replace "#" with a link to each work that you want to showcase and replace "Lorem ipsum" with the name of the work. Add or remove peices of work as needed.

    Code Snippet

  12. Credits:

    Add any credits here. While I do not require an attribution to me in the website I would greatly appreciate if one is added.

    Code Snippet

  13. Legal:

    Add any legal notices here. If none are required simply delete the div.

    Code Snippet

  14. Colors:

    To change the background color of the page to a color not provided in the website, simply enter the color name or code into the CSS.

    The example shown is from the aquamarine portfolio.

    Code Snippet

    To change the color (or other property) of a div (box containing the information), simply edit (or add/remove) that property in the CSS.

    The example shown is from the "name" section of the aquamarine portfolio (some sections may have additional CSS properties for text or links).

    Code Snippet

    Similarly, to change the color of the text within the div (box containing the information), simply edit (or add/remove) that property in the CSS.

    The CSS for the color of certian links might be in a seperate CSS selector than from the rest of the div, in this case the correct selector for the text or link will be directly below the selector for the rest of the div (second example shown).

    Normal example (from the "name" section of the aquamarine portfolio):

    Code Snippet

    Example where the text color property is in a sperate selector (from the "about me" section of the aquamarine portfolio):

    Code Snippet

  15. Text Sizes and Fonts:

    To change the text size or font, simply edit the CSS property to your preferences.

    The CSS for the size of certian text or links might be in a seperate CSS selector than from the rest of the div, in this case, the correct selector for the text or link will be directly below the selector fot the rest of the div (second example shown).

    Normal example (from the "name" section of the aquamarine portfolio):

    Code Snippet

    Example where the font size property is in a seperate selector (from the "about me" section of the aquamarine portfolio)

    Code Snippet
Legal