Hey there! "Edit theme" is accessed from viewing your game's page while signed into your account (rather than by editing your game from the Dashboard.)
If you are potentially interested in adding it to a resource website https://verzatiledevorg.github.io/Itchio_HandBook/docs/GettingStarted do let me know, trying to add knowledgable people together in one place and section. :) and your article would be a good fit if of course you would like to.
Question: Has the "banner replaces the title" part changed since this was published? On this very page, I believe I'm seeing both the banner and the title.
Absolutely did! I spent most of yesterday setting up my game's page to release it that evening, and I had this tab open the whole time, haha. It was very useful!
This is a phenomenal guide! I appreciate it SO SO MUCH! I was wondering, though— could you possibly tell me what kind of CSS you used to get the collections on your profile page to have their own separate containers? It looks really nice, and I'd like to set it up on my own profile.
The profile sections each have a div with the assigned class .inner_column. These sections are profile_header, profile_content, purchased_games, and collections. Collections is further divided into a separate row (class="collection_row") for each collection you display, and there is a child div with class .inner_column within each row.
I meant to do a styling guide at one point, but it ended up on the back-burner, and I just haven't had the time to get back to it.
Here's the custom CSS I'm using on my profile page at the moment:
I think Itch may have changed something about it's banner sizing. The 960px is resulting in blurry banners for me now. It seems like the default banner size on my desktop seems to be 1200px, in case you want to update this very helpful guide!
Thanks for the guide! I noticed that embedded web versions of the game also take precedence on the standard width of 960 for the banner, and will extend the banner width if the web game size (that you can set in page settings) is bigger. That could be a nice addition to the page top banner size explanations.
← Return to tool
Comments
Log in with itch.io to leave a comment.
how do I replace the left side cover img which automatically show up? I can't find the option that can edit it.
and that cover is not belong to my game.
How do I use "edit theme"? It doesn't appear on mine.
Hey there! "Edit theme" is accessed from viewing your game's page while signed into your account (rather than by editing your game from the Dashboard.)
Oh, I see. Thank you very much!
The limits for the background image on itch.io are 3840x2160px
If you are potentially interested in adding it to a resource website https://verzatiledevorg.github.io/Itchio_HandBook/docs/GettingStarted do let me know, trying to add knowledgable people together in one place and section. :) and your article would be a good fit if of course you would like to.
Thank you for this!!
Question: Has the "banner replaces the title" part changed since this was published? On this very page, I believe I'm seeing both the banner and the title.
Hey there! Good question!
No, that has not changed; the title you are seeing on this page is text I have entered directly into the Description field.
Ah, I see! Thanks for the clarification :)
Sure thing! Hope you found the guide useful. I do need to go through and give it a refresh sometime soon.
Absolutely did! I spent most of yesterday setting up my game's page to release it that evening, and I had this tab open the whole time, haha. It was very useful!
SO helpful for new creators, thank you so much for this guide!!
Thank you for the templates + explanations!
Absolutely appreciate these templates! I'm not making my items in photoshop or affinity, so I'm lying my way to victory through CSP. You're a gem! <3
Nice stuff
Excellent reference template.
This was extremely useful in publishing my own story, thank you so much!
Perfect!! So so useful thanks!
Thank you so much for this! Fantastic resource!
This is a phenomenal guide! I appreciate it SO SO MUCH!
I was wondering, though— could you possibly tell me what kind of CSS you used to get the collections on your profile page to have their own separate containers? It looks really nice, and I'd like to set it up on my own profile.
It's been a while since I've messed with it.
The class you're looking for is .inner_column.
The profile sections each have a div with the assigned class .inner_column. These sections are profile_header, profile_content, purchased_games, and collections. Collections is further divided into a separate row (class="collection_row") for each collection you display, and there is a child div with class .inner_column within each row.
I meant to do a styling guide at one point, but it ended up on the back-burner, and I just haven't had the time to get back to it.
Here's the custom CSS I'm using on my profile page at the moment:
.game_grid_widget {
text-align: left; !IMPORTANT!
}
.game_thumb {
border: solid #000 1px;
}
.inner_column {
background: #EDD5BE;
border: #271C14 solid;
padding: 50px 50px 30px 50px;
border-radius: 25px;
}
.footer {
background: #333;
border-top: #271C14 solid;
color: #fff;
}
.game_column::before {
content: "My Games";
font-size: 1.5em;
font-family: '04b_03',Lato,LatoExtended,sans-serif;
margin: 0 0 10px 0;
font-weight: bold;
display: block;
}
Really useful! Thanks for putting this together!
Very useful page! Thank you!
I think Itch may have changed something about it's banner sizing. The 960px is resulting in blurry banners for me now. It seems like the default banner size on my desktop seems to be 1200px, in case you want to update this very helpful guide!
Thanks for the heads up, I haven't fiddled with itch styling for a while. I'll take a look!
Thanks for the guide! I noticed that embedded web versions of the game also take precedence on the standard width of 960 for the banner, and will extend the banner width if the web game size (that you can set in page settings) is bigger. That could be a nice addition to the page top banner size explanations.
Thanks for this very useful page !