[Rob CParticipant]

Hi,

Since I started using X Theme I made edits to the CSS and some .php files. I did not create a child theme – these edits were made to the original folder.

I now realise that updating to the latest theme version will potentially cause a few problems because of this.

I understand that, from the beginning, I should’ve installed a child theme and made edits to that. Instead, I am in this situation.

I would like to update my version of X Theme without causing any issues; visitors will hopefully not see any difference. I would also like to have a child theme so that I can make edits in future without having to worry about new versions coming out and my website changing again.

How would I go about doing this? There are essentially two results that I would like:
-No change in the visual aspects of my website when I update the X theme version
-A child theme that I can edit freely in the future

Is this possible?

The URL is http://www.neondystopia.com

Thanks for your help in advance.

Rob

[RubinKeymaster]

Hey There,

You will have to create a child theme and slowly move all the files that you’ve modified from your parent theme to the child theme. Once you’ve moved all your changes to the child theme you can activate the child theme and import the Customizer settings of your parent theme to your child theme then you can start updating your parent theme to the latest version. One thing to keep in mind is that we’ve changed the .x-container-fluid class to .x-container in our latest updates, so whenever you see any of your child theme files that have this class you have to replace it manually to your new one once you’ve updated the parent theme to the latest version.

Hope that helps.

[Rob CParticipant]

Hi,

Thanks for your response.

I can’t seem to find how to Export the Customizer options.

Under Tools > Available Tools I only have ‘Press This’ and ‘Categories and Tags Converter’.

There is Tools > Import and Tools > Export but they appear to relate to WordPress pages, posts, etc.

Where should I be looking?

Thanks

EDIT

OK I found it under Addons > Customizer Manager. I Exported the settings, activated the child theme, then imported the settings. There’s a few things that are not working properly, though.

My main nav menu has disappeared.
The first widget on my sidebar has disappeared.
The third footer widget has disappeared.
Icons are not showing (for example, the Spy Glass for the Search box). No icons are showing properly.

On top of this, when I activate the child theme the CSS is entirely screwed up. The style.css is there in the child theme directory AND I’ve copied over the updated stack version to the child theme, but the only way I can get the CSS to update is if I actually paste all the CSS code from ethos.css to the main style.css.

This is really not running smoothly…

[ChristopherModerator]

Hi there,

You need to update theme and plugins, You can validate your product to use automatic update.
activate your child theme. You do not need to add ethos.css in style.css file.
After updating clear browser cache and check again.

Hope it helps.

[Rob CParticipant]

Once the theme is updated I won’t be able to revert back to my original version, will I?

The problem I expect would be that, if I update the theme, activate the child theme, then have to return to the original theme it’ll be completely different…

EDIT: OK so I’ve activated the child theme, updated the original theme, and all the rest.

The only way I can get it to use the CSS I want is by doing what I did before – to swap the style.css of the child theme with ethos.css of my previous theme…

Also, the footer widgets and icons are still missing from the website, some CSS padding seems to have disappeared, and my top sidebar widget is missing.

Can you take a look at let me know how I can fix this?

[Nabeel AModerator]

Hi Rob,

Upon checking your site, I see you’ve not updated your Visual Composer plugin, please ensure that you update BOTH X to v3.2.1 and the Visual Composer to v4.3.5, as these releases are meant to be paired together. If only one is updated, there will be some potential JavaScript/styling conflicts.

[Rob CParticipant]

Hi,

I have validated with a key, but I am unable to tell if automatic updates are working.

The Visual Composer plugin is saying that it needs to be updated, yet it cannot update it. The other option I have is to download the latest version from CodeCanyon (v 4.4.2) which costs $28.

I cannot find a way to update this plugin. Is there another option?

EDIT

OK, had to delete the original plugin and then download the entire X theme package again and install just that plugin.

My issues remain:

-I renamed ethos.css to style.css in child theme main folder instead of just using ethos.css in child theme CSS folder.
-Top sidebar (text) widget and Footer widgets (menu + Links) disappeared after update.
-Icons (social, search, slider, etc) disappeared after update. Had to place fonts folder in domain root folder.

[ChristopherModerator]

Hi there,

#1 I don’t understand why you need to rename ethos.css? Child theme has one CSS file named style.css.
Please provide us with specific detail in this case.

#2 You have cache plugin activated, Please deactivate it and clear browser cache and test again, It may solve #3 issue as well.

#3 Please delete font folder so we can see the issue .

Thank you.

[Rob CParticipant]

OK.

#1 Ignore, please. I thought changes to CSS would be made to a CSS file in the child theme under css>site>stacks>ethos.css instad of the root style.css file. This is fine.

#2 Deactivating and clearing the browser cache showed the footer. The footers appear to be floating, though. If I add a text widget to Footer 3 it is on the left. If I had Footer 1 or 2 it pushes it right. Is there a way to have the footers be in a fixed position as they were before? e.g. Footer 3 stays on the right, regardless of whether or not I have any content in Footer 1 or Footer 2.

#3 Icons are now showing with the Fonts folder deleted. There are still Console errors, though…

 GET http://www.neondystopia.com/fonts/font_awesome/font-awesome.woff?v=4.0.3 
(index):866 GET http://www.neondystopia.com/fonts/foundation_social/foundation-social.woff?v=1.0 
(index):1 GET http://www.neondystopia.com/fonts/font_awesome/font-awesome.ttf?v=4.0.3 
(index):1 GET http://www.neondystopia.com/fonts/foundation_social/foundation-social.ttf?v=1.0 

We’re nearly there! As far as I can tell, just an issue with #2 and #3

[ChristopherModerator]

Hi there,

#2 Please try this :

footer .x-column {
float: right;
}

#3 There is a folder in root directory/fonts/foundation_social which returns 404 which means can not be found, This path addressed somewhere in your files, Find it and change its path to absolute URL.

But i can confirm that it’s not related to X.

Hope it helps.

[Rob CParticipant]

#2 works (it floats it right), but it’s not a fixed location.

I thought usually the Footer widgets were in fixed positions. 1 to the left, 2 in the middle, and 3 on the right. How comes they are floats now?

#3 was related to X.

There was a line at the bottom of the previous ethos.css that had a relative position to the font folder (the older X theme version). I have now deleted the reference to font-social and changed the path of the font-awesome files to an absolute one in the main X theme folder.

@font-face
{
    font-family:'fontawesome';src:url("http://www.neondystopia.com/wp-content/themes/x/framework/fonts/font_awesome/font-awesome.eot?v=4.0.3");src:url("http://www.neondystopia.com/wp-content/themes/x/framework/fonts/font_awesome/font-awesome.eot?#iefix&v=4.0.3") format("embedded-opentype"),url("http://www.neondystopia.com/wp-content/themes/x/framework/fonts/font_awesome/font-awesome.woff?v=4.0.3") format("woff"),url("http://www.neondystopia.com/wp-content/themes/x/framework/fonts/font_awesome/font-awesome.ttf?v=4.0.3") format("truetype"),url("http://www.neondystopia.com/wp-content/themes/x/framework/fonts/font_awesome/font-awesome.svg?#fontawesome&v=4.0.3") format("svg");font-weight:normal;font-style:normal;
}

[Paul RModerator]

Hi Rob,

The footer widgets are always float to left, but since footer 1 and 2 have no contents it pushes the third one to the left.
The only way to have the third one go to the right is by using the css code given above or you could set a default height for the footer widgets by using the code below.

.x-colophon.top .x-column {
    min-height:150px;
}

With regards to #3

Font awesome is being added by the theme by default, no need to add a code for it.

Hope that helps.

[Author]

Posts