Basic 1.6 to 1.8 Theme Upgrading

[Eric]

Some things to note:

This isn't an advanced solution, meaning the outcome won't be optimal. It's just a way for people to quickly upgrade a basic theme for 1.8. Consider it a starting point if you do have an advanced theme.

This generally won't work well for dark themes, seeing as they require much more customization and detail than a standard theme.

This tutorial assumes you have basic knowledge of MyBB's theme system.

So with that, let's do this!

Step 1
Set up the new theme.

Create a new theme on your 1.8 board, as well as a template set to go with it.



For the theme settings, make sure image directory and board logo are set to the same locations they were in the 1.6 version.




Step 2
Bring over the CSS.

In the theme settings, create a new stylesheet (Name it whatever you'd like) and paste in all the contents from global.css in the 1.6 version of the theme.



Now set it's load order to last, so most likely "8".




Step 3
Bring over the images.

Create a new folder in /mybbroot/images/ (For example, /mybbroot/images/mytheme/, and should retain the same folder name as was used in the 1.6 version) and copy all the contents of /mybbroot/images/ into it. Then, copy the contents of your 1.6 theme's images into the same folder.



Now, change the extension of collapse.gif and collapse_collapsed.gif to .png. (After deleting the originals)


Step 4
Bring over the [important] templates.

Copy the template contents from 1.6 to 1.8 for the following templates: header, header_welcomeblock_member, header_welcomeblock_guest, header_welcomeblock_member_admin, header_welcomeblock_member_moderator, footer.

Now, in your header template find:

{$pending_joinrequests}

And add this after:

{$awaitingusers}

Then, in your footer template, add this wherever you'd like your theme selection to appear:

{$theme_select}

And now you should at least have a working basic version of your theme. Keep in mind it won't look exactly the same, as we've taken the best approach at preserving new features of 1.8. Hopefully this can be a good starting point if nothing else.

Some things still won't work, for example your forum on/off/offlock icons will now be a CSS sprite. You can follow this tutorial if you'd like to use a new font based version of them. And feel free to ask any questions here about problems upgrading, I'll try my best to help!

[Euan T]

Nice simple guide Eric, should help people out a bit

[Eric]

Nice simple guide Eric, should help people out a bit

Thanks Euan, people have been getting lots of problems by trying to directly import their themes so I wanted to provide a more stable option while still being simple.

[Vanz]

Thank you for this tutorial.

[JonathanP]

Beginners doing this for the first time, make sure you put

<div class="wrapper">

in the header template as well.

[Eric]

Beginners doing this for the first time, make sure you put

<div class="wrapper">

in the header template as well.

Why do you suggest this? It will break any themes that people use this guide for as long as it's followed correctly. D:

[JonathanP]

Well, 1.6 don't have it and adding it makes it easier to adjust the width.

[Eric]

Well, 1.6 don't have it and adding it makes it easier to adjust the width.

Well, when people move over header/footer and global.css it will also bring whatever width wrapper that was used in the 1.6 version of the theme.

[JonathanP]

I suggested it because when i did this, i had to add wrapper in the header template, the width was stretched out.

[Eric]

I suggested it because when i did this, i had to add wrapper in the header template, the width was stretched out.

Likely an incorrect/missed step in the tutorial.