Creating a Website with Weebly
(WGU TDT 1: Task 1)
I chose to continue using Weebly as my website creator to update my personal education website. The steps below will allow you to create your own personal website similar to what mine currently looks like.
Steps:
1. Create an account at www.weebly.com, and it will immediately ask you if you want a business website or a personal website. I chose to create a personal website.
2. It will then ask you to select a theme. You can change this at any time if you do not like the theme that you initially chose. I chose a theme with a simple white-colored background, which is able to load much more quickly compared to having an image-based background.
3. Next, you can click the “start editing” button at the upper right-hand corner, which will then prompt weebly to ask if you would like to buy a domain name (you do not need to buy a domain name for others to access your website).
4. At this point it will load the premade theme website components, which includes titles, stock images, and sample text.
5. My first action was to update the website title and change it from text to include my personal logo. I did this by hovering over the sample title name, clicking the “logo” option, and uploading the photo from my computer.
6. Next, I changed the theme fonts for the entire website, where I changed the default fonts of all headers, paragraphs, hyperlinks, and image captions to be in the Nunito style font. I chose this font because it is the font I also use for all student-facing curriculum in my classroom. I chose to make the paragraph titles in a black color, and the paragraph text to be in a dark gray color. I changed the link color to be a dark orange, which matches the current school colors of my current school site.
7. To add new pages to my site, I clicked on the “pages” button at the menu tabs at the top of the page, and clicked the “+” button in the left menu tray. I chose to use standard pages for all of my web pages. I titled the pages and selected no header for all. For the “educator resources”, “student resources”, and “beardies in the classroom” pages, I selected the box to hide these pages in the navigation bar at the top. After this I dragged and dropped these resource pages to be under the “Resources” page tab in the main menu.
8. I then changed the home page to include a welcome header by clicking on the “build” tab at the top menu. I clicked the title button and dragged it and dropped it to the location I wanted. I typed what I wanted the text to be, and then from the text settings pop-up I chose to align the header in the center of the web page.
9. To add the text with three short paragraphs about what the website will contain, I stayed on the “build” tab and clicked the “text” button and dragged it to the desired location on the webpage. I clicked to edit the text to type a welcome message for any past or current students, other educators, and potential employers to the website.
10. I created hyperlinks within the text to the other pages in my website, such as my “portfolio” page, “educator resources”, and “beardies in the classroom” page. I did this by highlighting the text , and then clicking on the “create link” button that showed the image of chain links. I chose to link to other standard pages in the website, which then gave me the option to select the appropriate webpage from a menu. For the links that brought users outside of my website, I chose “website URL” instead of “standard page” when creating the hyperlink within the text. I also checked the “open in new window” checkbox so that users would still have my website tab open if they clicked away from the website.
11. To add images of my past school site mascots, I stayed on the “build” menu tab and then dragged-and-dropped the “image” button onto the location of where I wanted the image on my website. After this I clicked the” upload image” box and then uploaded the correct image file from my computer. To make the images next to each other, I dragged the “divider” build tool to align vertically on the right side of the image. This then allowed me to organize the images in columns.
12. To add headers and text to my additional webpages, I followed the same steps as I outlined before. To change the under-construction text to be in a bigger font size, I selected the text and clicked the “+” button on the text settings pop-up.
13. To change my website title I went to the “settings” tab on the top menu and then clicked ``general” on the left menu tray. I changed my site title to be more descriptive than the default, which is “My Site”. I then clicked the save button that was located to the right of the text box.
14. I also made sure that the site category was set to “personal” and then clicked save.
15. To publish my website, I clicked the blue “publish” button at the top right upper menu.
Steps:
1. Create an account at www.weebly.com, and it will immediately ask you if you want a business website or a personal website. I chose to create a personal website.
2. It will then ask you to select a theme. You can change this at any time if you do not like the theme that you initially chose. I chose a theme with a simple white-colored background, which is able to load much more quickly compared to having an image-based background.
3. Next, you can click the “start editing” button at the upper right-hand corner, which will then prompt weebly to ask if you would like to buy a domain name (you do not need to buy a domain name for others to access your website).
4. At this point it will load the premade theme website components, which includes titles, stock images, and sample text.
5. My first action was to update the website title and change it from text to include my personal logo. I did this by hovering over the sample title name, clicking the “logo” option, and uploading the photo from my computer.
6. Next, I changed the theme fonts for the entire website, where I changed the default fonts of all headers, paragraphs, hyperlinks, and image captions to be in the Nunito style font. I chose this font because it is the font I also use for all student-facing curriculum in my classroom. I chose to make the paragraph titles in a black color, and the paragraph text to be in a dark gray color. I changed the link color to be a dark orange, which matches the current school colors of my current school site.
7. To add new pages to my site, I clicked on the “pages” button at the menu tabs at the top of the page, and clicked the “+” button in the left menu tray. I chose to use standard pages for all of my web pages. I titled the pages and selected no header for all. For the “educator resources”, “student resources”, and “beardies in the classroom” pages, I selected the box to hide these pages in the navigation bar at the top. After this I dragged and dropped these resource pages to be under the “Resources” page tab in the main menu.
8. I then changed the home page to include a welcome header by clicking on the “build” tab at the top menu. I clicked the title button and dragged it and dropped it to the location I wanted. I typed what I wanted the text to be, and then from the text settings pop-up I chose to align the header in the center of the web page.
9. To add the text with three short paragraphs about what the website will contain, I stayed on the “build” tab and clicked the “text” button and dragged it to the desired location on the webpage. I clicked to edit the text to type a welcome message for any past or current students, other educators, and potential employers to the website.
10. I created hyperlinks within the text to the other pages in my website, such as my “portfolio” page, “educator resources”, and “beardies in the classroom” page. I did this by highlighting the text , and then clicking on the “create link” button that showed the image of chain links. I chose to link to other standard pages in the website, which then gave me the option to select the appropriate webpage from a menu. For the links that brought users outside of my website, I chose “website URL” instead of “standard page” when creating the hyperlink within the text. I also checked the “open in new window” checkbox so that users would still have my website tab open if they clicked away from the website.
11. To add images of my past school site mascots, I stayed on the “build” menu tab and then dragged-and-dropped the “image” button onto the location of where I wanted the image on my website. After this I clicked the” upload image” box and then uploaded the correct image file from my computer. To make the images next to each other, I dragged the “divider” build tool to align vertically on the right side of the image. This then allowed me to organize the images in columns.
12. To add headers and text to my additional webpages, I followed the same steps as I outlined before. To change the under-construction text to be in a bigger font size, I selected the text and clicked the “+” button on the text settings pop-up.
13. To change my website title I went to the “settings” tab on the top menu and then clicked ``general” on the left menu tray. I changed my site title to be more descriptive than the default, which is “My Site”. I then clicked the save button that was located to the right of the text box.
14. I also made sure that the site category was set to “personal” and then clicked save.
15. To publish my website, I clicked the blue “publish” button at the top right upper menu.
