When I first started building a website, I really just wanted a simple blog to showcase my capstone projects. So, I bought a domain, plugged it into Blogger but quickly found myself running into limitations with my custom code. I can be a little bit perfectionistic, so creating content on Blogger’s platform became somewhat of a pain and ultimately moved to WordPress where I knew I’d have more control..
And now.. here we are 🙂
I’d like to say I’m done, but if you’ve ever owned a website you know it’s never actually that simple. There’s a lot of follow-up work and maintenance to work on.
Process Overview
The code I wrote for Blogger was a combination of CSS, HTML and JavaScript, which I moved over here.. although I’ll have to run some more tests on the JavaScript. First, I wrote a CSS file on my own with custom variables in CSS and combined some of the properties together. For the HTML, I decided to create a template that I can just copy is what I am using now, but had to make some minor alterations so that it would be suitable for WordPress.
Tools For Speed Coding
The whole point of growth marketing is to be faster than everyone else. I use a hybrid development model where I use a coupld of drag and drop / WYSIWYG blocks, but still use custom blocks when I need more control. Originally my entire site was custom coded on Blogger. My helpers for this were Ada (my ChatGPT’s name), Visual Studio, GitHub‘s co-pilot; and for this blog post: Grok AI Imagine.
- Visual Studio: I use this to code faster in real time. A long time ago I remember staring at code for an hour trying to just find one tiny mistake like a random missing closing quote or bracket; misplaced tags, etc. The mistakes were usually something simple but annoying to look for.
- GitHub Co-pilot: I also have GitHub’s co-pilot (Claude) for auto-recommendations; or repetitive code corrections when there’s something I don’t like.
- ChatGPT: I use ChatGPT more than anything. While I don’t trust it enough to design a website, I do trust it enough to combine files and give me revisions. In this case, I had ChatGPT scan the XML file for this platform and look for any items that would be safe to remove – which is over 4,300 lines of code (image below.) Afterwards I would test it, see how if it worked and a few times it broke the code, other times it would display strangely. So I’d inspect, edit it, test, edit, test, etc. The final step in the process was having Ada combine the files together and extract anything unnecessary.
The Final XML & CSS Files I Used
I’ll be uploading the files and linking them here, so this is a placeholder for now. I still have a LOTTTTT left to do – mainly updating all of my meta-descriptions, titles and looking for consistency errors.
Final Product
We’re on the homestretch. There are still some broken links but we’ve come a lONG way since the orignal layout and original theme. In later posts I will share the exact code for the XML and CSS files as well as some before/after and a some better screenshots of how the process behind the scenes looked. 🙂
On my To-do board is:
- edit main blog pageThe format on my main blog page is incomplete and will be transformed into a homepage with articles; similar to newspaper or modern blog sites. My inspiration is something like HubSpot’s blog home, but obviously it will be less busy because I don’t always have time to blog (esp right now when I am studying like crazy) and once the site is complete, it mainly just be a portfolio and testing grounds for Google Analytics
- Write JavaScriptI need to write a script for that captures labels, which I will be able to ue later as a plugin for more scripts (recommended articles, featured article)
- Move homepage to blogRight my homepage is makeshift while I get the actual blog page to display properly
- Continue classes with University of Michigan’s Dr. Charles Severance with advanced Python, Ruby and Django – I am taking paid courses, but he has tons of free coding lessons and tutorials on his website!
- Most exciting, is my work on Project Diana – a tool that automates DMCA and deepfake takedown processes from scraping website URLs to submitting forms all the way to sending emails to copyright violators.
