September 23, 2014 at 8:53 pm #14001
I’m afraid I’m going to get myself in trouble.
I have been editing the style.css file available from the Appearance>Editor menu.
I thought that since it was a child theme, it would be okay. Now I’m wondering if I’ve overlooked something in the documentation and that changes should be done from Appearance>Edit CSS.
If this is the case, I will have to get a current copy of the style.css, compare the two versions, and place my changes in a new file.
Could anyone confirm or deny my assumptions here, and perhaps provide the name of their favorite tool for comparing documents. I have Filepad++ – I wonder if that does it.
Thanks!September 25, 2014 at 1:39 am #14017
You can make changes to the style.css file if you want, it’s no issue. Some people like to separate their customizations from their theme’s css and create a custom css file that won’t get overwritten if they override their theme files.
September 25, 2014 at 12:40 pm #14027
So…if they ever update the style.CSS file in a theme update, my changes will get overwritten.
to prevent problems in the event this happens, I suppose I”m back to
compare a current copy of my style.css and the theme style.css, identify the differences and place the changes in a custom.css file.
It seems like there’s going to be a lot of !important qualifiers.
<b>Could anyone perhaps provide the name of their favorite tool for comparing documents?</b>September 25, 2014 at 12:48 pm #14028WesModerator
@hiNooril Css changes are usually minor, so finding and comparing the differences between two stylesheets shouldn’t be that bad (depending on how much you’ve changed of course). The tool I use and recommend is this – http://www.diffchecker.com/
You won’t have much to worry about as most designers/developers just edit the css directly. Only the Genesis Framework is updated automatically, the child themes don’t have automatic updates since most people make their changes through the child theme. There is never a NEED to update the css if you already have a design that you want to keep, so you’ll never have to worry about updating it.
So if you’ve made a lot of changes you’ll be fine. If you haven’t then you could add in your changes in a separate css file as @eric mentioned. Either way will work fine.September 25, 2014 at 5:43 pm #14033
Thanks much for the tool. Fantastic.
I don’t understand the relevance of: “You won’t have much to worry about as most designers/developers just edit the css directly”
This is my first Genesis theme.
Genesis will update automatically?
And Epik, that will not update automaticallY?
When the child theme is ready for an update, I suppose just the files are made available, and you can update what you choose?
—I think mine has a lot of customization in the css. And is maybe the cause for the loss of mobile responsiveness. I have another
topic open for it.—I would appreciate any comments or specific direction I need to go to resolve it. —-September 25, 2014 at 5:43 pm #14034
Shoot, sorry, How can I get a copy of just the original style.css for Epik?September 25, 2014 at 11:21 pm #14045WesModerator
“When the child theme is ready for an update, I suppose just the files are made available, and you can update what you choose?”
Yes for Child themes that’s the way it works…..or you could completely install the new version if you wanted to….but of course that overrides any customizations you’ve made. So I’d stick to either making a custom file, or documenting the changes you’ve made and adjusting the new version.
“Shoot, sorry, How can I get a copy of just the original style.css for Epik?”
You can download the latest version of the theme’s style.css and use that as a reference……If you purchased from this site, check here from Appfinite – http://appfinite.com/my-account or if you purchased from StudioPress, check here – http://my.studiopress.comSeptember 26, 2014 at 12:34 am #14050
Okay, I’ll check it out tomorrow.
Some of the changes I made were to accomodate the width of the header/logo, width of the side and sidebar…and now the full main menu is not showing on mobile, and some other issues. I opened a topic a little over a day ago. No one has commented on it yet – can you take a look and tell me what direction I might go with it??September 26, 2014 at 11:11 pm #14071September 27, 2014 at 3:58 pm #14076
I appreciate it, Eric.
This one will do: http://appfinite.com/topic/bug-header-image-cut-off-or-sidebar-is-jacked-up/
I don’t see the one having to do just with and having Responsiveness in the title.September 27, 2014 at 5:00 pm #14078
The “genesis responsive slider” is also not responsive.
I had to do some customization there as well.
Thanks!!September 29, 2014 at 12:50 am #14088
Did you get this working already? Your site shows up fine on my end. I’m using an iphone to view everything, and the responsiveness is working…..Even when I resize my laptop browser to a mobile size it resizes just fine and shows up as it should.
Would you like a screenshot so you can see how it’s showing up from my end?
September 29, 2014 at 12:59 am #14094
Hi – Oh, that’s good news!
It’s definitely not working on Android. I think I have some screen shots I could send. Let me check.September 29, 2014 at 1:14 am #14096
Found it – there’s a bunch of screen shots embedded (not attached) from a Galaxy’s S4 d in an email.
I did a couple screen captures from that.
My looks exactly like the Galaxy.
Oh, I thought I could attach. I don’t see how now.September 29, 2014 at 11:02 am #14097September 29, 2014 at 12:07 pm #14100
http://i.imgur.com/oA8NiQe.png (Samsung Galaxy)
http://i.imgur.com/UybzAvk.png (Motorola Razer)
http://i.imgur.com/MM08Yti.png (LG Optimus) showing missing primary nav, slider image cut off
I’m using http://cybercrab.com/screencheck/ for these examples.
It also shows a problem for iPhones using this tool.
Originally, the problem was shown just by checking the site with the actual phones.
thanks!September 30, 2014 at 1:42 am #14106
Ok, I would definitely not use these tools as a way to check the mobile responsive results, but that’s just my opinon. What they are showing for you is completely opposite of what I’m seeing. I have several iPhones that I have just checked and none of them look like that. I also have checked a couple androids and they look fine as well. If I were you, I would check on an actual phone because these emulators do not show the actual result in the same way as a mobile phone would. Your site is showing up fine on nearly every device I look at. I’m aware not all devices are the same, but it’s looking just fine from what I’m looking at.
September 30, 2014 at 12:10 pm #14108
Hi, Eric. Thanks for doing that testing.
Because of the wide variety of devices, versions of devices and operating systems, I’m going to have to use an emulator.
It appears the one I picked was not accurate. I can no longer use Browserstack (need to find another good one).
The issue arose because the owner has a Samsung Galaxy and saw the problem there.
He sent me screen shots of it, which I was going to upload here.
Also, it’s not looking good on my LG Optimus
What Android devices / versions have you checked?
We already think it’s good on all Apple devices.October 2, 2014 at 12:42 am #14127
Ah, yes I’ve used Browserstack a couple times in the past as well.
The phone I tested with is a Droid Incredible….but I have no idea what the other phone was because it was borrowed from someone at a starbucks. I have a Droid Incredible that I keep to test sites on Android, although they still show up differently on other Android devices. Android is very fragmented, so there are many devices using Android that run totally different. Sometimes it’s hard to create something that works for all devices since the OS is coded differently. It’s frustrating, but hopefully Android can fix that part of their fragmented system (the reason this problem occurs with not only websites, but applications as well).
October 2, 2014 at 1:42 am #14131
Been working on this for a week with someone….looking at the Epic demo and my site…I think it would be better/take less time to take out all my home page edits and redo it to match the Epik demo.
Kill nearly everything I’ve done, except for images etc.
the 2 guys I hired are not able to get it done, no responses on the topic, “Need Help – Lost Mobile Responsiveness”
We have woo commerce integrated, and wouldn’t want to overwrite those changes.
I love the Epik home page and the layout of the inner pages.
Wes has guides on how to get the site like the demo…
What do you think about this idea…any suggestions on how to implement?
Or how to explain to a client/friend you’re starting over….October 2, 2014 at 3:21 pm #14138TrishaMCustomer
Lots of good advice already offered above, thought I’d just add my two cents.
Diffchecker is good if you’re online, I occasionally do a lot of work offline (while traveling etc). I don’t think you mentioned what computer you use, but if it’s a Mac then check out Text Wrangler…it’s great, it’s free, and it has a built-in file comparison tool that finds every difference between two copies of the same file (or any two or more files, but it really only makes sense when you’re comparing different versions of the same file).
Also, I belong to several (Meetup) users groups, for WordPress specifically and web design in general – many of us have different smartphones so we all help each other out with testing and screenshots….look around your local area for Meetup groups and dive in – they’re a great place to network and learn too.
And lastly, whenever I modify a style.css that came with a Theme, I generally always put my edits at the very bottom (well commented of course), which for the most part negates the need to use the !important declaration. Occasionally I do have to modify styles that appear earlier in the stylesheet (usually, but not always, when an earlier style has already specified !important), but if I do that I add comments using all caps so that I can spot them very easily in the future. This helps if I decided to update a Theme, because I can easily find all of my own edits from a backed-up copy.
As for modifying styles live using Appearance > Editor, there isn’t anything wrong with that as long as you’re backing up the stylesheet before applying your edits…it’s very easy to get two or three edits into making changes, have something break, and then find it difficult to put things back the way they were before you started editing.October 4, 2014 at 10:53 pm #14169
Good points, Trish, Thanks.
- The topic ‘Epik stylesheet changes’ is closed to new replies.