One of my favourite components of itch.io is how builders can take the creativity they put into their venture and show it on their venture/retailer pages. From the very starting, certainly one of itch.io’s guiding rules has been about giving builders a web page that they’ll customise with content material that they management. 

Sadly, itch.io’s venture web page theme editor hasn’t actually saved up with the event of the remainder of the location… till now. Thousands of strains later, the oldest a part of the location is now rewritten. Introducing the brand new theme editor!

Updating the theme editor has all the time been a problem for us. Thousands of builders use our web page editor to make some actually distinctive stuff, and once we make updates to it we now have to watch out about inadvertently breaking their designs. For this replace I analyzed recreation pages utilizing Custom CSS, since they’re essentially the most fragile. I seen 600+ venture pages, obtained to see a number of attention-grabbing stuff, and took notes in regards to the issues they did. The most typical modifications grew to become the inspiration for the brand new options which might be accessible in the present day, and those I’ve deliberate for the long run.

646 public video games have used customized CSS on @itchio, going by way of all of them now to think about new options so as to add to theme editor pic.twitter.com/rT0rke6QGc
— ↘️↘️ go to itch.io and purchase video games please 🙌🙏↙️↙️ (@moonscript) November 2, 2017

What’s new

This launch was principally involved with getting the rewrite out, so I’m calling it Phase 1. The architectural modifications will make strategy to many extra superior customization choices sooner or later. Here’s a short overview of what is new in the present day:

• Theme editor now shows from the aspect. Has been utterly rewritten with trendy elements.
• You can now choose any font accessible from Google fonts in your web page
• You can now individually management colours for buttons and headers
• You can management how the screenshots sidebar seems. On downloadable pages you possibly can conceal it, and on browser video games you possibly can carry it again
• The web page background picture can now be attachment fastened
• You can management the transparency of the BG2 space
• The default margins round screenshots have been improved (screenshots at the moment are inset and not contact the sting)

Many modifications have been additionally made to handle customers who work with CSS (you must have gotten an e mail about it!):

• A model new CSS Customization Guide that offers you some ideas, a structure of the web page from a CSS perspective, beneficial selectors to make use of, and pitfalls to be careful for.
• CSS generated by us will now use decrease priority CSS courses so it is simpler in your CSS to take priority with an ID selector.
• The variations between browser and downloadable venture pages have been normalized, they use the identical markup the place applicable.
• Flexbox is now used for alignment in lots of extra locations.

Go make some pages!

Try it out, and inform us what you suppose. With the inspiration improved it is a lot simpler for us to proceed including new customization choices. Please do not hesitate to depart a remark right here with any concepts you’d wish to see.

While engaged on this venture I had the chance to see a number of cool pages. You can test them out in my collections:

Enjoy