The vast majority of the questions on the StudioPress forums for Genesis framework child themes are related to the general WordPress community who has been introduced to user-friendly premium themes not being web developers or programmers. The average website owner has no idea how to look for what to change or what options there are in changing something.
That is why people like me have a nearly-endless market of professionals of other industries needing my industry’s skills to make their vision happen.
A lifetime of learning
While it takes thousands of hours to learn a craft to the point of being both proficient and efficient, there are some simple things that the average person can handle once they are shown the tools to use and some instructions on how to use them. For those people, this should help them along the way with simple tasks.
A recap of the tools
In case you didn’t click the link in the previous paragraph, here is what you absolutely need:
First, either Chrome or Firefox web browsers. In them is a feature when you right-click an element on the screen that says “Inspect Element” in the right-click context menu (yours will likely look different based on OS and browser plugins that alter the context menu).
This will bring up a frame inside the browser window that shows you both the generated HTML of the page and the CSS code all the way down the system of CSS files that each element uses to generate how it looks and behaves (upon hover, click, etc.).
Second, you need a text editor. Any editor (even TextEdit or Notepad) will do, but there are syntax highlighting editors that color different syntax in the language you’re typing in (usually just CSS, PHP, HTML, and JS). Those would be Sublime Text, skEdit, TextMate, or Notepad++.
Third, you need to stop using your hosting cPanel, Plesk, or other control panel to go to the file manager or FTP add-on screen in the browser. People who edit files on the server should use an FTP client. I’m a Mac guy, so I use Transmit 4 (one of the best $30 I spent on my Mac software library) and there are a few good options for Windows. This will let you navigate to the theme folder on your host and directly open a file so when you save it, it loads the update to the server and you can refresh the browser – more importantly, it lets you undo a mistake and go back many steps in history to recover a from a string of mistakes.
What are some basics?
The questions that are most easily addressed in a general post like this are CSS issues. These are typically questions about the appearance, spacing, alignment, or other visual cues. Sometimes something can be handled with either CSS or PHP, such as having something not appear on certain pages, like single posts. Let’s look at the CSS items first.
CSS
It’s a rather simple syntax to get the hang of the majority of layout and appearance items necessary to wireframe a site or change up the text appearance on a site pretty significantly. With the exception of adding Google Webfonts to a child theme via the functions.php file, 98% of font edits will be done in CSS. Here are some common attributes and links to their use:
text-transform
font-decoration
color
font-family
font-size
font-weight
min-height
padding
background
border
list-style-type
box-shadow
text-shadow
opacity
height
float
postion
display
overflow
clear
max-width
PHP
PHP is more of a programming language than CSS, which is just syntax that can do some neat stuff. With PHP, you can add information to the database, connect to remote services, jump in and out of HTML syntax, and construct new plugins and themes. It is the backbone of WordPress. Here is what PHP looks like for one of the child theme’s functions.php file:
There are two main places to look for how to change something that doesn’t look like it’s a CSS edit: functions.php and the page template being used (home.php, page_landing.php, etc.). Once in there, the themes are documented well enough that you should be able to find what you’re looking for and try to alter or remove code.
This is how the majority of us learned PHP – by breaking hundreds of things and learning from those mistakes. You WILL break things and you WILL get frustrated. It’s best to learn on a development install rather than your live site, but working with real-world situations makes you very strong in what you learn.
Hey Jesse,
Great tips and I love the point about breaking things. Don’t be afraid to get in there and break things – it’s how you learn!
Also, a decent free FTP client for both Mac & Windows: Filezilla.
Cheers,
Carrie
Thanks, Carrie. I’m pretty sure I had to use a new theme on my first site just about every week because I’d break it beyond use as I learned CSS and PHP and was using the WP editor instead of FTP. Those were the days!
I remember a Twitter poll on WIndows FTP clients and another on text editors and I couldn’t remember the two that I’d never heard of before that exchange. I know Sublime Text is cross-platform, though.
Lots of encouragement here Jesse to help people jump in and try a few things.
“It’s best to learn on a development install rather than your live site”
Agree with that – if it goes wrong no harm done just start again.
I use XAMPP and this was the post that got me started with a local setup for WordPress…
http://sixrevisions.com/tutorials/web-development-tutorials/using-xampp-for-local-wordpress-theme-development/
It’s a bit dated but I’ve not found anything better.
Agree with Carrie about using Filezilla as an FTP client.
I prefer Bitnami WordPress stacks – http://wiki.bitnami.com/Applications/BitNami_Wordpress_Stack to that and working locally is great to ensure you don’t blow anything up. I don’t work on client work locally because that’s just another migration, but it’s great for learning and even faster than the fastest hosted site – makes plugin development SUPER EASY…
I’ve been considering purchasing Genesis because I hear so many good things about it and a lot of the sites I like I find out are using Gensis.
I currently use iThemes Builder and Headway. I’m not unhappy with either of those, I just like having different options and tools available. What are your thoughts on buying the Pro Plus package or just Genesis or maybe Genesis with one child theme. I’m torn on whether I would use the child themes enough to warrant the Pro Plus package. I am by no means an expert on CSS or coding but I know my way around good enough to be able to do most anything I need to in style.css or functions.php by trial and error or other means. I build a good many sites for myself and have expanded this past year into doing some client work as well. I’d appreciate your thoughts. Thanks.
Good question, Keith. From a programming and developer perspective, those other two are bloated to allow a lower technical class to make major modifications, while Genesis’ power is in hooks and an entire supportive community of developers creating plugins and sharing snippets.
As for which package, Pro-Plus is definitely worth the money, because you get all updates, all future themes, and support. It’s great to have a ton of child themes to start off as a base (theme modification) and steal code from for projects – you can learn by reverse engineering – but if you are provided PSDs to develop, then you need only Genesis and create your own child themes or use a blank theme like Bones or Bill Erickson’s (he’s making a new one for 2.0).
I’ve used probably 2/3 of the themes and purchased 3 or 4 community themes, Bones, and used Bill’s at least 8 times. Just stay away from Theme Forest Genesis child themes.
Thanks Jesse. I pulled the trigger and bought it tonight. I did the
Pro package. Now I need a new client to build something for so I can
justify it in my mind that it was a necessary business expense!
I’m
just now getting into it but I like it already. Even when I used
Builder or Headway I would end up in the style or functions files
editing stuff. I was a Thesis user from back too so a lot of this looks
familiar. Looking forward to digging into this over the weekend,
figuring things out and learning stuff from the Genesis community.
Thanks
for the push that I needed. Also, you should have a nice fresh
commission sale in your affiliate account because I used your link.
I’m sure you’ll be quite pleased with it as you use it more and more. I recommend not using anything else for a few months to really immerse yourself in the code to become highly efficient.
Hooray! Thank you! I’m quite new at all this stuff and am just learning to modify the CSS in Genesis child themes (with much help from w3schools.com). Your post answered a bunch of questions I haven’t been able to find answers to elsewhere – it seems that a lot of posts assume that the user already knows the right tools to use! Could you clarify something for me? I’ve been playing around with BBEdit (though I know you don’t use it anymore from the other post) – I think I can access my files via ftp from within BBEdit, therefore can I use just this rather than a text editor + FTP client? Is there something I’m missing with this assumption? Thanks 🙂
Yes, BBEdit does both.
My assumptions were covered in this post: https://www.petersenmediagroup.com/business-tips/tools-of-the-trade-for-wordpress-developers/
Yes, I read that one too. Thanks, Jesse.
Nice write up. You really wrote it well! My only concern? I have zero knowledge in this thought I did here and there a little..if you know what I mean.
Thinking of modifying some of the themes especially eleven40 but want to know first 🙂
I mean…in deep deep details.
Thanks for sharing!
Reginald
Thanks.
Can you finish your question, though? I don’t see a question in “but want to know first.” I think it’s missing a big thought in there between “know” and “first.”
If you’ve got zero knowledge, then you’re not really going to be able to do any of this without learning it. You can try this plugin that extends what you can do in Genesis without code: http://jkp.me/17Ds2nB
Hey mate.
Sorry for that. Didn’t really state it properly. I mean I am concerned because I have yet to learn lots of coding. So dreams of creating a theme will be hard.
Yes I heard that before. Still considering! Of course…that’s the last option!
Haha
Reginald