School Website
Cleveland Public School
Problem:
The School's website was outdated in terms of its features, design, and content. As the existing system could not meet the School's requirements, they purchased a new website from Thrillshare. Although this helped them get a new front page, it still lacked the desired styling and functionality they hoped for.
Solution:
I inspected each page individually to design the website and determined the best layout and appearance. Afterward, I created templates and a site-wide stylesheet to make these changes consistent and effortless to maintain. Furthermore, I made several alterations to the website to meet the School's specific requirements. Custom JavaScript was necessary for many pages to implement additional features that make the website ideal for the School.
Challenges:
Displaying PDFs
Thrillshare cannot view PDF files without downloading them. This can be inconvenient when you want to preview a PDF before downloading it, especially when looking for a specific document. To address this issue, I developed a dropdown element block that can be integrated into web pages. This block makes it easy to access PDF files for display or download, highlight important links, and organize pages with folder structures, such as the district policies page.
Use Files From Google Drive
It was important for the school to be able to easily add files from Google Drive to certain pages on the website for quick maintainability and file sharing. For each of these pages, I created a shared Google Drive folder and set up a script that reads all the files, generates the URL to embed them, and generates the code to display the files in a dropdown block. When one of the school's web pages loads, it receives the cached data from the script's most recent execution.
Simplifying Updates
When adding custom elements such as dropdowns, it was essential to ensure that updating them was easy for any staff member. To achieve this, I created a JavaScript function that accepts a list of links and their types. The function then generates the dropdown code and replaces its own code block in the page structure. This means that staff only have to drag and drop a code block onto a page and paste a small script.
Gallery Page:
One of my favorite pages is the Gallery Page shown below. The School wanted to make the images in our news articles more visible because the articles disappeared from the home page after only a few days. To address this issue, I created the gallery page. It selects random images and displays them, and when you click on a photo, the page will take you to the article it came from. You can also filter your search by browsing old-school years, specific months, or all articles at once. The code won't display the same image twice until it lacks new photos.
School Board Page:
This page is an excellent representation of the website because of its varied content implementation. The page has a calendar widget displaying the date and time of the next School Board meeting, a Finance Articles section pulling all the news articles made by the school board, old board recordings synced from Google Drive, and meeting minutes edited using the dropdown method described in the Simplify Frequent Updates section.
Future Plans:
We plan to continue refining and expanding the website based on user feedback and evolving needs. This will include adding new features, improving existing ones, and ensuring the website remains a valuable resource for the school community.
Impact:
This project significantly improved the method for daily bulletins, making it easier for staff to maintain the data and view the information they want. Now, if you walk into any classroom or office, you'll see the Daily Bulletin web app sitting open.
