Weebly Portfolio Website Design:

As an artist it's important to document your work. Since you have been documenting your work all along this semester it's time to put it into a format that you can reflect on easily and share with your friends and family.

We will use Weebly to create digital portfolios of your work from the semester. If you already have a Weebly site from another art class you can add a new page to display the work you accomplished this semester. 

Weebly is an online service that you can use to create websites. This is a valuable life skill you will most likely rely on in the future. This will help you get started with your first site so when you need to make one in the future you will know what do to and how easy it can be.

​Each required project is worth 5 points. In order to earn the entire five points you need to follow the setup steps below and also include a title, description and an image for each project. 

Create a Weebly Account:

Visit the website Weebly.com and sign in if you already have an account. If you don't have an account select "Sign up" and use your school email address and your school password to create your account. 

PLEASE DOUBLE AND TRIPLE CHECK TO MAKE SURE YOUR EMAIL ADDRESS IS CORRECT AND HAS THE CORRECT DOMAIN--> @SD5.K12.MT.US
Use your School District 5 email address and password for creating this account.

Set up your site with a template. 

  1. Select "I want a personal website/ Try Weebly Websites" (DO NOT CREATE A SQUARE COMMERCIAL STORE)
  2. Select a Theme that has the navigation menu visible at the top of the page.  You will delete all of the photos and text content.
  3. The next step is to create your website address on the "Select your domain name" screen. I would recommend using your initials and birth year (CEH07). You need to create a name that is available under the weebly "subdomain" This is a free option that will allow you to have your own site that will cost you nothing. The "professional domains" cost money. If you see a screen that prompt you to pay a monthly fee you selected the pay option. Close out of that screen and choose the SUBDOMAIN.  
  4. Your website name needs to be school appropriate and also not include your first and last name. This is required.
  5. Once you establish a website address click on "Done"
  6. Now you can start editing your site by clicking on the "Pages Tab"

Set up your Pages:

  1. Click on the "Pages Tab" at the top of your weebly editor. 
  2. Visit each of your pages and DELETE ALL of the existing pages. To delete a page click on the page name, click Delete and then click Delete again on the confirmation screen. Delete all of the pages except for the home page. 
  3. Click on the + button to add a STANDARD PAGE. 
  4. Type in a Name for your new page. Use the name of the class you are in as your page name.
  • Art Survey
  • Drawing
PRO TIP: On the pages tab, turn off the Header Image for the page you create. This will prevent you from building your content in the Header Space.

5. After you create your new page you can then Delete the Home Page. This will provide you with a blank slate website. 

DO NOT INCLUDE YOUR PHONE NUMBER, HOME ADDRESS, PERSONAL OR SCHOOL EMAIL, OR YOUR FULL NAME ANYWHERE ON YOUR SITE.

Build a Portfolio Page:

On the Build Tab you will use the "Basic" items to build your page. Drag and drop from the left menu space onto a blank web page. Drag a Title, Text, and Image for each project. Once you drag them into place you will see a blue line which shows where your items will land. You can also use Divider and Spacer to help keep things aligned and organized on your page. 

You will display the artwork you created this semester on a single page. For each project you created you will display a TITLE, IMAGE, and CAPTION. Write 2-3 complete sentences to explain your project. Write about what you created, how did you do it, what problems did you run into, explain why you like it or why you don't like it. What does the viewer need to know about this piece of artwork?

HOW TO COPY AND PASTE PRIVATE COMMENTS: Use Google Classroom to copy the Private Comments you already wrote for each project. Click and drag to select the text you want to copy from your . Press Command-C to copy (or right click and choose copy). Visit your weebly editor page and paste the text you copied to the location you want it. The keyboard short cut for paste is Command-V or right click and choose Paste.

Add a title to each project. Please use the assignment titles so it is easy for me to identify each project. 

PROTIP: Do not use the slide show or gallery options to display all your work. 

Visit the Portfolio Example Page to see an example of a layout.

Here is a list of all of the required images and titles to upload. You can add more than what is required to add to your portfolio. You can also add work in progress images, details, or other images related to each project. 

Access your Google Drive Folder to Get Your Photos:

You will take screenshots of the images of each of your projects and upload them to your weebly site. You can get all of your images directly from your Google Drive by looking in My Drive-> Classroom-> Drawing or Art Survey Folder. In this folder you will see all of the images you uploaded to Classroom for this class. Click on one of the images to make it larger.

Once you click on the images in your Classroom Folder you can take SCREEN SHOTS of each of your projects. Use the left and right buttons on the screen to advance to the next image in your Classroom folder. Take a screen shot of each of your projects.

NOTE: Weebly will only allow you to upload .JPGs and .PNG files. Weebly won't allow you to upload .AI or .PSD. .TIFF or .HEIC files. If any of your files are .HEIC or Text Edit files you can double click on them and open them with Paint on a PC or with Preview on a Mac. Choose File-> Save As and select .JPG or .PNG as the file format. Once these files are saved you can upload the .jpg and .png files to Weebly. 
​

VIsit Google Drive:

Twirl the Arrow next to My Drive to Reveal your Classroom Folder

Screen shot each of the Required Photos:

THIS IS HOW YOU TAKE A SCREEN SHOT:
Using 3 fingers at once press the SHIFT, COMMAND and 4 buttons. After you do this release your fingers from the buttons. Use your mouse to click and drag from the top left to the bottom right to capture a section of your screen. Your screenshot file will show up on your desktop. 

Upload Your Photos to your Weebly Page and Edit Each Photo:

On the Build Tab you will click on the "Image" placeholders. This will prompt you to choose a location you want to upload a photo from. Click on Upload a photo from your computer. Then click on DESKTOP. You will see all of your photos on your desktop. Upload the correct image for each project. 

PROTIP: DO NOT drag and drop your photo from your desktop onto your weebly page. This will replace all of the photos on that page with the same photo. 

EDIT YOUR PHOTOS:
All of your images need to be cropped and rotated. Your image should only show your artwork. Everything else around your artwork should be cropped out. Rotate your images so the top of your work is upright. 

If your artwork is side ways or not cropped you can click on the image in the Weebly Editor and choose "Edit Image." On this pop up editor window you can rotate, crop, and also apply adjustments to your image such as brightness, contrast, or exposure. Try to edit your image so it appears as your actual artwork looks in real life. 

Publish your Website and Share your Web Address 

Once your site is built you can publish your website to the World Wide Web (AKA The Internet). Your website should be professional and school appropriate. Click on Publish at the top Right of the editor page. When you click Publish it will push any changes you made out to your website. Remember to click the publish button after you make edits to your site. You can click Publish as many times as you need to.

The link that shows up on the confirmation screen is the web address of your website. Copy and paste your website address and submit the URL to the Google Form linked below or in Google Classroom. You only need to send me your website one time. ​