Installing and upgrading your xenforo style

[Ehren]

Follow these steps to install your xenfocus style.




Method 1 (for xenforo 2.2 or newer):

1. Download the style from the Client Area.

2. Unzip the file on your computer, and you should see:
- xenfocus-readme.html
- style-*****.zip

3. Log into your admin cpanel, select the "Appearance" tab > and click the Import button.



4. Browse for the .zip file from your computer and press Import.




5. Once the style has been imported, we want to create a Child style which allows us to easily modify and upgrade the style if necessary. To do so, click the Add style button at the top, add your own Title and Description, and change the Parent Style option to your newly installed xenfocus theme.



6. Now that your Child theme has been created, visit the Styles page and disable the Parent style for members since it's no longer necessary. Disabling the style simply removes it from the Style Picker at the bottom of your site. You can also set your Child style as default (if required).



7. All done! If you ever need to modify the style: modify the Child style but keep the Parent style untouched. If you ever need to upgrade the style, you simply import the new version, replace the Parent style when prompted, and your Child style will automatically update!

If you need to modify your theme, try and add all of your css changes into extra.less, and avoid modifying any of the template files if possible. This will make future theme updates very simple.



Method 2 (for xenforo 2.1 or older):

1. Download the style from the Client Area.

2. Unzip the file on your computer, and you should see:
- xenfocus-readme.html
- style-*****.xml
- "styles" folder which contains the images for your style

3. Using an FTP program, upload the styles folder to your xenforo folder. There will already be a styles folder, so simply merge the folders so they become one.

4. Log into your admin cpanel, select the "Appearance" tab > Import a style, and import the .xml file.

5. Once the style has been imported, we want to create a Child style which allows us to easily modify and upgrade the style if necessary. To do so, click the Add style button at the top, add your own Title and Description, and change the Parent Style option to your newly installed xenfocus theme.

6. Now that your Child theme has been created, visit the Styles page and disable the Parent style for members since it's no longer necessary. Disabling the style simply removes it from the Style Picker at the bottom of your site. You can also set your Child style as default (if required).

7. All done! If you ever need to modify the style: modify the Child style but keep the Parent style untouched. If you ever need to upgrade the style, you simply import the new version, replace the Parent style when prompted, and your Child style will automatically update!

If you need to modify your theme, try and add all of your css changes into extra.less, and avoid modifying any of the template files if possible. This will make future theme updates very simple.

 

[Ehren]

That's what I did and I loose all my modifications !

That presumably means you've been applying your modifications to your Parent theme rather than your Child theme, which is not the correct way to modify themes. This is mentioned in the Installation part of the tutorial

 

[Nicola]

Do i have to overwrite the CHILD or the PARENT style ???
I don't understand what you say : previous message you said I have to overwrite the PARENT style and now the CHILD style... Please be clear !! I'm not a developper...

 

[Ehren]

and now the CHILD style.

I have never said to overwrite the Child style. You should overwrite the Parent theme when installing theme updates, and you should apply your theme modifications (mega footer, colour changes, etc) to the Child theme.

Reading the tutorial again is likely the best idea. It mentions everything you need to know and answers all of the questions you are asking in detail.

 

[Nicola]

I understand... I did wrong at the beginning... and I effectively made my customization in the parent style rather than the child style.
My mistake. Sorry.

 

[gldtn]

sorry but once again upgrade to latest supportaed XF v2.0.12 was ok but applying the latest Uniform 2.0.12.1 destroyed my settings
- I followed the how to upgrade: fails
- I created a new style, from scratch: ok, but then trying to import and overwrite this default style with uniform = fails
now I just use the default style

summary: whatever I try (apply to parent style or to new style) = doesn't make it ...

I'm lost...any ideas?
Thanks

ps: I join a screenshot of what I get in all cases

UPDATE:

I disabled all addons, applied/overwrite style, and re enabled addons and it was ok
!!!

I'm having something very similar, but it only happens to the customized child theme of the Uniform that I made the changes to., tried what you mentioned above and nothing yet. @Ehren any ideas? Everything loads fine, but the header is messed up just like the screenshot above

 

[Ehren]

I'm having something very similar, but it only happens to the customized child theme of the Uniform that I made the changes to., tried what you mentioned above and nothing yet. @Ehren any ideas? Everything loads fine, but the header is messed up just like the screenshot above

Have you modified the PAGE_CONTAINER template file or any of the .less files (with the exception of extra.less) in your child theme?

 

[gldtn]

Have you modified the PAGE_CONTAINER template file or any of the .less files (with the exception of extra.less) in your child theme?

I might of have and did not remember. Either way I was able to quickly redo my customization as most of my edits is on my own base.less file.

Thank you!

 

[copenhavn]

Hello,

I just followed your tutorial for a correct installation oh this theme, but when I select it in my styles, here's the result of my forum.



Any ideas ?

 

[Ehren]

Hello,

I just followed your tutorial for a correct installation oh this theme, but when I select it in my styles, here's the result of my forum.

Hi there!

Are you using XenForo 2.1?

 

[copenhavn]

Hi there!

Are you using XenForo 2.1?

Hi ! No I'm on 2.0

I guess I know the problem now ...

 

[Ehren]

Hi ! No I'm on 2.0

I guess I know the problem now ...

Some themes are compatible with 2.0, however the 2.0 versions don't have the most recent features and bug fixes. You can download old versions by selecting them from the dropdown menu in the Download modal box

 

[copenhavn]

Ok Ehren, I'll give you a feedback asap.

Thanks for your help !

 

[Itworx4me]

I am trying to upgrade from the 2.0.0 series to the 2.1.0 series and get this error:

Oops! We ran into some problems.
The import could not be completed because the following issues were found:

The title of the style you're importing differs from the style you're overwriting. Is this the correct style?

If you are sure you want to continue with the import, select the 'Skip import checks' option and try again.

Just making sure you want me to select the skip import checks?

Thanks,
Itworx4me

 

[Ehren]

I am trying to upgrade from the 2.0.0 series to the 2.1.0 series and get this error:

Just making sure you want me to select the skip import checks?

Thanks,
Itworx4me

I guess the importer does numerous checks like that to ensure the correct style is being upgraded. Ticking the skip box should be fine

 

[copenhavn]

I just want to let you know that your solution to use an older version works fine. Thanks you

 

[invictus]

FYI, like others in this thread I followed the instructions and lost all my settings when upgrading.

I initially did not have a child theme, so I created one for my old theme first. I checked to make sure that the child theme Style Properties and all settings had copied from my old theme before importing the update. Everything looked good in my child theme, all customizations were present in the child theme exactly as I had them in the old parent theme.

Next, I imported the new theme update and chose the option to over-write the parent theme. After the import finished I lost all settings in my child theme.

 

[Ehren]

FYI, like others in this thread I followed the instructions and lost all my settings when upgrading.

I initially did not have a child theme, so I created one for my old theme first. I checked to make sure that the child theme Style Properties and all settings had copied from my old theme before importing the update. Everything looked good in my child theme, all customizations were present in the child theme exactly as I had them in the old parent theme.

Next, I imported the new theme update and chose the option to over-write the parent theme. After the import finished I lost all settings in my child theme.

Hello,

The steps which you followed technically aren't correct. You mentioned you originally had a single theme which you modified, and you then created a child. This means that your parent theme was modified and your child theme simply inherited those modifications. When you imported the new theme and replaced your parent theme, the changes which you had previously made were overwritten.

If the tutorial is followed correctly, you should have a parent theme (which is never modified) and a child theme (which contains your modifications). Your setup was the opposite way around, which is why your settings were lost.

 

[invictus]

Hello,

The steps which you followed technically aren't correct. You mentioned you originally had a single theme which you modified, and you then created a child. This means that your parent theme was modified and your child theme simply inherited those modifications. When you imported the new theme and replaced your parent theme, the changes which you had previously made were overwritten.

If the tutorial is followed correctly, you should have a parent theme (which is never modified) and a child theme (which contains your modifications). Your setup was the opposite way around, which is why your settings were lost.

Thanks for the info. Where is the distinction between "inherited" settings compared to any other modified settings? Adding a child theme copies all settings from the parent theme, but they appear to be the same as modifications made to the child theme. There is no "inherit" option in the child theme, it appears to have all modifications set in the child theme exactly as the parent did.

Anyway I hope it will work next time I update, as I now have a parent theme with no modifications and all my customization in the child theme.

 

[Ehren]

Adding a child theme copies all settings from the parent theme

The child theme inherits settings and code from the parent theme. There's no "inherit" option specifically, it just happens automatically.

Anyway I hope it will work next time I update, as I now have a parent theme with no modifications and all my customization in the child theme.

That's correct. When updating your theme, replace the parent theme and your child one will automatically be updated (since it'll inherit the parent code), while maintaining your settings.

 

[Bradison]

Follow these steps to install your xenfocus style.

1. Download the style from the Client Area.

2. Unzip the file on your computer, and you should see:
- xenfocus-readme.html
- style-*****.xml
- "styles" folder which contains the images for your style

3. Using an FTP program, upload the styles folder to your xenforo folder. There will already be a styles folder, so simply merge the folders so they become one.

4. Log into your admin cpanel, select the "Appearance" tab > Import a style, and import the .xml file.

5. Once the style has been imported, we want to create a Child style which allows us to easily modify and upgrade the style if necessary. To do so, click the Add style button at the top, add your own Title and Description, and change the Parent Style option to your newly installed xenfocus theme.

6. Now that your Child theme has been created, visit the Styles page and disable the Parent style for members since it's no longer necessary. Disabling the style simply removes it from the Style Picker at the bottom of your site. You can also set your Child style as default (if required).

7. All done! If you ever need to modify the style: modify the Child style but keep the Parent style untouched. If you ever need to upgrade the style, you simply import the new version, replace the Parent style when prompted, and your Child style will automatically update!

If you need to modify your theme, try and add all of your css changes into extra.less, and avoid modifying any of the template files if possible. This will make future theme updates very simple.

Seems people have had some issue with their installs. I don't want to mess up anything. Do you offer installation service??