The History of how I made this WordPress Website: Part 2

Posted by on January 22nd, 2021 in News

My website is almost finished, so I decided to take the time to write the second blog entry. actually, the website was finished at the end of december 2020, I was busy with other projects until now and some texts and images were still missing. Excuses excuses.

I finished the design of the desktop version of the website, and was really happy with it. I then went on to look at how making a website responsive actually works. Luckily it was exactly as I imagined it. basically, you define a certain screensize, and then you can create new css classes or override existing ones when the screensize is met. so to make a website responsive, you simply define a screensize for tablets and then one for mobiles, and adjust css classes.
Most of the time, it was fine to simply modify some elements of some classes to make them look good, in some cases I had to define a new structure for the page, or a new ordering, switching from horizontal to vertical ordering for the hire-me page, for example.

It took a couple of days to make everything work, and I am sure there are some bugs somewhere, but I am fairly happy with it. I am also glad that this method of making a website responsive was just dull work and not a completely new system I had to learn.

I also managed to create color variables for every color that I use in this website. So I can instantly recolor the whole site, everywhere, to whatever color I want. (stupid free templates…. not allowing me to do that…I’ll show them…)

A cool thing I managed to do is to have my latest video at the front page of my website, and I actually managed to add it as an option in the customize section of WordPress. Now I can simply exchange the current video manually whenever I want, as an admin. You might ask yourself, why not just getting the latest upload from youtube automatically, with code? I thought about that, but decided that the video on the front page of my website should not actually be the latest video, but instead the most current video that I want to represent my work. I would rather the video be a song of mine that I particularly enjoy, rather than an update video on my life.

I had a funny idea (at least I think it’s funny) to implement a hover image exchange for the logo on the front page, that would show me in my armchair in different positions. I committed to the bit, but it was super annoying to code in javascript. I never used javascript in a web environment, and had a ton of problems when researching how to implement what I wanted. My search results would clash with jquery solutions, which I could easily discern from simple javascript, but it still added to my confusion.
I finally managed to make it work. My initial goal was to simply read all image files from a folder and then randomly display them. I had to compromise, and manually add every image file into an array. I could not find a way to read folders with javascript, which was a bummer. but, the rest worked! so now, whenever you hover over the logo, a random image appears!
I think it’s funny. I am stupid like that.

The last thing I implemented was a paypal donate button. it’s in the top right in the navigation bar. go ahead, try it out! ; )

All in all, I would not say that I am a web developer now, but I think that the website is a successful project that I am quite happy with. I look forward to adding more content to it, more blog posts, more project pages, more albums, songs and especially more images to the armchair gag. Hopefully, when I can finally get a haircut, I can redo the images.

My first finished project. Praise the Sun!