CXLLUM
A Very Full Day
Welcome back to my coding journey! Today was one of those days where I sat down thinking "I'll just do one quick thing" and ended up down about six different rabbit holes. All good ones though!
I started off finally tackling something that had been bugging me for a while: my header and footer were copy-pasted onto every single page, which meant if I ever wanted to change the nav, I'd have to update it everywhere. Not exactly efficient. So I built header.php and footer.php as shared templates and just include them on every page now. Update once, changes everywhere. Genuinely such a satisfying fix.
Of course, first attempt broke things in a fun way; I ended up with the header showing up twice on one page because I forgot to delete the old hardcoded version. Classic.
While I was in the header, I figured I'd add Google Tag Manager so I can actually see if anyone besides me ever visits this site. Turns out that opened a whole new can of worms: consent. So now I've got a proper cookie banner (styled to look like my terminal windows, obviously) with Accept and Reject buttons, and analytics only fires if someone actually says yes. I also wrote up a privacy page listing exactly which cookies get set — turns out it's just two _ga cookies and one localStorage entry for remembering your choice. Small, but nice to have it all documented properly.
Somewhere in the middle of all that I tried adding a typewriter effect to my homepage hero, just to see what it'd look like. It was genuinely really cool, but after testing it on a spare page, I decided I actually prefer the static version, sometimes the simple thing is the right thing. I did keep messing with the hero though, and added a subtle dot grid pattern to the background using a CSS radial gradient. That one I'm keeping... it gives the page a bit more life without being distracting.
Naturally, adding the dot grid then revealed that my footer was sitting way too far down the page on mobile, which took a bit of digging (turns out 100vh on phones doesn't account for the browser's address bar — who knew) before landing on 100dvh as the fix.
To round the day off, I got a bit distracted from starting my second project (yes, I know, I'll get to it) and tried to make a terminal-window graphic I could use for an Instagram post. First version wouldn't import properly into Illustrator, turns out patterns and filters in SVGs don't always play nice with Illustrator's importer, but a simpler flat-shapes version worked perfectly, and I even learned how to build my own dot grid pattern directly in Illustrator for it.
Key Features
- Shared header/footer templates via PHP includes
- Google Tag Manager + cookie consent banner
- Privacy page with full cookie disclosure
- Dot grid background on the homepage hero
- Mobile viewport height fix (
100dvh)- Terminal-window graphic for social media
Second project tomorrow. Probably. We'll see what happens!