Recently I came across a simple, yet amazingly fun web game called “A Dark Room”. I become addicted to the game, and yet, once I beat the game, I felt like it needed more, I was missing something. Being that I am mainly a designer, I thought instantly of the visuals, and so I set out to create my own add-on to allow for visuals to be made of the game! Here’s how to use it:
- Drag this link to your bookmark bar:
“A Dark Village”
- Go to the game here:
- Click on the bookmark you just put on your bookmark bar from step 1.
That’s it! Assuming that you did it right, the add-on I created will show up for you in-game. I modified the game enough that it should for the most part be completely playable through my addition. However if it does present an issue, you can always just hit the close button (in the top left) or refresh your browser. If you do refresh your browser, you will need to click on the bookmark again to get it started.
Earlier this year, I came across the “srcset” tag, and was intrigued by the benefits that it offered and allowed for when it comes to making images “responsive” on the web. I did my research, and an a fan of the work done by https://responsiveimages.org/. In fact, they have their own version of a responsive image plugin made for WordPress. However after using theirs, and doing my own research I was disheartened to see that it only worked for images that are assigned as the featured item. This meant that it would not “fix” all the images across a blog from the hundreds of other posts already created, with lots of images built into the content region. This was not good enough for me…
So that’s when I sat down and whipped up a little plugin https://wordpress.org/plugins/post-script-responsive-images/ that take care of this problem. Essentially it looks over your entire post, searches for any image tags, then replaces it with a newly rendered version that includes the necessary “srcset” tags. This plugin will allow for on-the-fly image resizing to the new size needed, and will automatically work with any previously uploaded images as well.
This is how your image code looks for a smaller image: