Customizing Prose theme; where and how to add changes to style

[dogleg.com]

This is a continuation of a question that Susan partially answered earlier this morning in another category. However, I was really hoping to get an answer this afternoon or evening, so I am posting it again--I am new to this and very confused. I need some help with "mechanics."

I know that I have a page “Custom Code” for Prose in the Genesis tab on toolbar. Is that where I should put all changes?

If not, please let me know where.

If so, then I have some changes in the CSS box now, which someone placed there for me (I am not sure it will work or even if I will use it). It looks like this:

/** Do not remove this line. Edit CSS below. */

add_filter(‘genesis_comment_form_args’, ‘custom_comment_form_args’);
function custom_comment_form_args($args) {
$args['title_reply'] = ‘YOUR CHOSEN TEXT HERE’;
return $args;

Now, my biggest question is, if this is the area, then how exactly do I place further changes? on the line following “return $args;” or skip a line, or add some extra heading telling it what to do, or doesn’t it matter? Also, I do not know when something might belong in the CSS area as opposed to the Custom Functions area. Can I just copy out of my style sheet and paste it in here and then modify it as I’d like?

I also have a Genesis Simple Hooks plugin–it looks like changes can be made there as well. I know it seems simple to you, but when instructions just say “insert this snippet of code”–I don’t know where or above/below what, or in what order. If you could please clue me in a little, I would be very grateful. And, if I am understanding you, I should not make any changes to my style.css sheet because those are just wiped out with every update.

I want to add/create some font stacks–where would I do that? I am installing certain fonts from Typekit, and I know that the code is already in there for me. However, I have learned that they will not transfer to everyone, and I need to put font stacks in to cover all my bases so that an especially ugly generic font will not be substituted for mine. I know how to make the font string, I just don’t know what information is needed on top of that (such as code that tells the theme what to do and when to stop on the beginning and end of code snippet). I cannot find answers anywhere, and everyone seems to know except me.

So Sorry this is so long!

Thanks for any help

Paula

[SoZo]

Yes, that is where you add style changes but what you posted is PHP and should go in the custom functions box not the custom style box. Remove the function and then add your new style rules.

---

John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography

[Alirat]

To me it looks like the php code has been put in the custom css box not the custom php box where it should be.  Have you played around with the Design Settings under the Genesis tab? You can make a lot of changes there without having to touch the code.  I haven't used Typekit, I usually stick to regular web fonts except for the site titles and heading and use Google fonts with a plugin. Does Typekit have a plug in for WordPress?  The custom CSS box is where you would put the CSS for the fonts, for example - h1, h2 {font-family: [your registered font here] [fall back fonts here];}

The whole think about a child theme is that it won't get overwritten when an update comes out.

[wendycholbi]

Hi Paula,

I can totally understand your frustration. Prose is the only Genesis child theme (so far) that has the Custom Code screen and the Design Settings, and many people who know the Genesis Framework very well don't know this, because they've worked with other child themes but not Prose -- so they recommend making changes to style.css or functions.php.

Basically anytime you see anyone or any tutorial recommending that you change something in style.css, just mentally translate that to "add this code to Genesis --> Custom Code --> Custom CSS".

And anytime you see anyone or any tutorial recommending that you add something to functions.php, mentally translate that into "add this code to "Genesis --> Custom Code --> Custom Functions".

When you add something to one of the Custom Code fields, add it below the last line. You can optionally leave one blank line to make it easier for you, a human, to see the divisions between your snippets.

And you hit the nail right on the head when you said "Can I just copy out of my style sheet and paste it in here and then modify it as I’d like?" YES. Your changes/additions to Custom Code will be preserved when you update your theme, but any changes you make to style.css will be wiped out, which is why it says "do not edit under any circumstances".

Now, for your specific code snippet and questions above:

That code snippet is a PHP function, not CSS, so it's not doing anything for you in the Custom CSS section. You can (usually) tell CSS from PHP by looking for curly braces and the absence of parentheses; CSS statements have a selector (word or series of words) followed by a style declaration enclosed in curly braces, like this:

#h1 {
font-family: Baskerville, Times, 'Times New Roman', serif;
}

PHP snippets can have curly braces (I see one in your code snippet, and I suspect that snippet is actually missing a closing curly brace, but I'm much less fluent in PHP than I am in CSS), but parentheses, words like "function" and "filter", and phrases with underscores like custom_comment_form are some giveaways that the snippet is PHP rather than CSS.

That code snippet looks like it's supposed to allow you to customize the reply label on your comment form. There's actually a plugin that lets you do this without any code at all, called Genesis Simple Comments.

As for Typekit, font stacks are going to go in the Custom CSS field, and I'm not sure if Typekit provides the entire code snippet or not. My little CSS example above shows a sample font stack, with multiple-word font names enclosed in quotes, each font separated by a comma, and ending with a generic (either serif or sans-serif) as a fallback.

Hope this helps with some of your questions.

---

I love WordPress, Genesis, and the Prose child theme (my complete guide to using Prose is here: SiteSetupKit.com). Say hi on Twitter: @wendycholbi

[dogleg.com]

Thanks so much for your responses!  Sometimes when I look things up, the answers are there, but I don't have the background to understand them.

@alirat Typekit does have a plug in. They give you an ID and after you enter it, you can customize some font selectors from a box they have on their site; however, I don't think it allows for font stacks. Typekit is super-helpful and easy to use.

Thank you @SoZo and @wendycholbi--very helpful!

Paula

[SoZo]

You're welcome 🙂

---

John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography

[Author]

Posts