Task 6 – Home & Portfolio Pages

by

Portfolio

  1. Update all Home Page widgets with personal content:
    • Hero: carousel or video
    • Highlights: Call to Action widgets–you can use and personalize these for key images/projects
  2. About Me page: move photo and bio text to this page
  3. For portfolio: Make sure you have 3 good genre categories, with 2 full-content posts (with featured images) per genre category; these should appear on your Portfolio page and in submenus
  4. Create Portfolio Page
    • Add Heading & Portfolio widget
    • Add Filter bar for Portfolio widget
  5. Menu: Add Portfolio Page, Posts page and Login item to Menu
  6. Optional:  Try a few widgets on your Playground page; eg  Try a Heading widget–>Advanced tab–>Motion Effects; or try Flip Box or Image Box widgets

HTML Practice

W3S

  1. W3S Links and Images
  2. Quiz 6

 CodePen

Model Page for Codepen Tasks 1-6

  1. Practice CodePen.  Add the following code to your CCS stylesheet in Codepen– Note what the CSS changes in your website in paragraphs and in the buttons. Feel free to update the colors (vs gold & dimgray), but keep the other data intact.

p {
/* 17. Set the paragraph spacing. */
padding-left: 1em;
}
button {
/* 18. Set the button size, spacing, and color. */
font-size: 1.3em;
padding: .5em;
background-color: transparent;
color: palegoldenrod;
/* 19. Add a subtle shadow. */
box-shadow: wheat 0 0 .2em;
/* 20. Add a border with rounded corners. */
border: gold solid 1px;
border-radius: .5em;
}
button:hover {
/* 21. Change the border color on mouseover. */
background-color: gold;
color: dimgray;
}

Post:

  1. Subject: Task 6-yourname
  2. Category: Task 6
  3. Codepen URL
  4. Portfolio  Home page URL, AND playground page URL