Build Your Own Business Website header image

How to Convert Code from Thesis Open Hook to a Custom Function

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

Whoops, you've found some premium content!

Watch the opening clip of this video to preview it,
the full video is available to paid members.

In this session we show how to convert code from Thesis Open Hook to a custom function by creating a function for the nav menu add_action thesis_hook_after_header that will take the code as a function and place that code in exactly the same spot as it was. We also show how to clean the code up in custom_functions.php and discuss the process of refactoring where we are taking a function and breaking it down into simpler component parts.

Video Transcript

Member: I’m embarrassed to say I’m still using Thesis Open Hook and still have some 1.8.5 installation but I do…

Rick: Sure.

Member:  And but I’m at the point where I really need to get rid of open hook and so I probably could work it out but I have a couple of really complicated sites that are translated and I use some php to switch out images and do other things and so.

Rick: I’ve just made you the presenter so we can see what you’re looking at.

Member: Okay, so this is one of the sites; it’s just a one page so but it’s translated. This particular one into Hungarian so.

Rick: Okay.

Member: The header image and the slider image rest it’s on a slider but just its feature image here. It switches when I switch translations and it could be that the software I’m using might handle that now but it didn’t when I initially served this template so. This area gets switched there are also a couple of other things that gets switched out.

Rick: What’s your code look like?

Member: Let me show it to you, it looks like…I found the code I was trying to figure out how in the heck to do this and someone else have done it and hosted the code. Thankfully I cut and pasted it so I’m not a coder when it comes to php I keep thinking I’m going to learn but I’ve haven’t yet. So, that’s my issue here is that I need to take this code and be able to put it into custom functions and put it in the hook. And make sure i get the right php code so I don’t take the site down.

Rick: And why do you have to do this?

Member: Well, I cannot upgrade open hook. I’m using like 2.2 something I think because something happen along the way when back in his version 3 that he added some to the code that it screws up my header. And other people had the same problem he never did identify why it was. I never could work it out. I spent hours trying to figure it out.

Rick: Uhuh.

Member: So I need to get rid of it cause I keep getting notices that I’ve got an old plugin and what I have found is that webhost are getting really. They don’t like it when you have old plugins because they think they’re going to hack so perhaps they can be. So, I’d like to get rid of it and put it in the custom php so I don’t have to worry about that?

Rick: Yeah.

Member: Biggest reason. So, I was assuming that there’s an easy way to just you know cut and paste put it in and; and if I know where the you know the… and the question marks go I should be good to go but maybe not. Maybe I’m asking too complex question if I am I don’t have to solve this today so.

Rick: Well, the right way to do this is not the way they are doing it.

Member: Okay, so you’re saying I should redo the code. Can we just solve the issue about leaving the code as it is by putting it into custom php or is that not doable? Then I learn I will code it the right way later.

Rick: Actually, you can do that so go ahead do you have a code editor?

Member: Yeah.

Rick: So, have you placed that code in the code editor?

Member: I have not yet. I took the custom function that was there and this is what was then like..

Rick: Okay.

Member:  so I just renamed it so I can play with it.

Rick: So, down below that one type function and then space and then nav_menu_style and then opening and closing parenthesis.

Member: Space or no space?

Rick: No space, and then an opening curly brace and then hit enter and enter again and a closing curly brace.

Member: Okay.

Rick: Now you have a function with a function name.

Member: Okay.

Rick: And what you can do is go copy your code that’s in the after header and place it inside that function. Okay.

Member: Now I’m assuming that I need to get the hook somewhere?

Rick: Okay, so now that you have done that you’re going to go down below that function; all the way below the function and say add action, we’ll in fact why don’t you copy the add action Thesis hook after header thing up above. Just copy that whole thing; no, under the  Move Nav Menu under Header. See there’s an add action statement right there? Right above your cursor a little higher, a little lower.

Member: Oh, up here.

Rick: That one,” add_action(‘thesis_hook_after_header’, ‘thesis_nav_menu’);” copy that whole line, paste it down below and then instead of ‘thesis_nav_menu’ you would place nav_menu_style. So copy your function name nav_menu_style, I would have just copied it and pasted it but that’s your style. So, what I’m going to do is take this code as a function and place that code in exactly the same spot as it used to be.

Member: And do I have to follow this for something like a question mark and a…? At the end of it, that’s what I don’t know; is really how it needs to be formatted within this file.

Rick: Well, you can leave it formatted exactly as it is.

Member: Okay.

Rick: It’s not formatted properly but it will work. So…

Member: And the part that it is not formatted properly is the part that we paste it in or?

Rick: Yes, the part that you paste it in is not formatted properly but you said you didn’t want to fix it so; you just want to use the code.

Member: Well I want to do this, I don’t know if you have time. Well, if you have time then…

Rick: Well, what you would do is to format this properly actually you have extra closing php tag anyway. See directly below the function we just created? See that closing php tag which is the question mark and the greater than sign?

Member: Here?

Rick: Directly above the function we just created?

Member: Okay, ah here.

Rick: That, that shouldn’t be there. So, if you delete that…

Member: Okay, so actually should I have pasted it all of this…

Rick: Well, just go ahead and delete that.

Member: Okay.

Rick: Just backspace, backspace. Okay, there you go and now actually would you copy all that code and place in the chat window for me?

Member: All these?

Rick: Yup, because you have opening php tags and closing php tags in the wrong spot.

Member: Okay.

Rick: So, well…

Member: Amazing that it worked.

Rick: Well no, it worked in the other…

Member: Oh, but they won’t work here.

Rick: Yeah,

Member: Is it that always the case? That, that something might work as php outside of the functions…

Rick: Well, the thing is that the program that you are using that is Open Hook assumes that you are in html document. And it starts off in html but…

Member: Right.

Rick: But custom functions php is actually a php document and so…

Member: Right, so there has to be something around the html.

Rick: Right, and so if we let’s see. Okay, I’m just going to create a new file. Php file, next…

Member: This is isn’t bit boring to everybody else?

Rick: Okay, so there’s the code that you sent me and if you’re using an error checking code editor it would have indicated to you that you had an error right.

Member: Okay, and that would be like NetBeans?

Rick: Like NetBeans or some other error checking code editor there are a number of them.

Member: Okay.

Rick: But the first thing is the way you indicate a comment is with a double slash or with a slash asterisk. You might want to look at my class.

Member: I know that there is a comment in here that is in here that is not…

Rick: Yeah, it was the “Nav Menu styling according to language /hu/”

Member: Okay, that’s how they came to me that’s interesting. Okay, I just copied it that way.

Rick: I know because it’s assuming it’s in an html document rather than in a php document.

Member: Oh, I see.

Rick:  So then you’re going to close out php, open up html and then well actually that was the only change that is needed be changed really.

Member: So if I just took those comments out I could paste from the next line down.

Rick: Yes, so…

Member: You know create a function then do add the add_action.

Rick: This is, hang on a second here. You have also to get rid of this closing; so this is a right way of doing this. A right way, now the way it should be done is this. I’m going to give you both pieces of code.

           function hungarian_menu_style() {
}

And then function_hungarian_menu_style should; we’re going to close out php.
function hungarian_menu_style() {
?>
}

And then go back to php
function hungarian_menu_style() {
?>
<?php
}

And then so this is the hungarian version

           function hungarian_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px; }
</style>
<?php
}

And then we are going to do the same for typical_menu_style
           function typical_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px; }
</style>
<?php
}
And we are going to take this one

Member: I know the specificity if I see this right cause i don’t see what you’re…

Rick: Oh, you can’t see my screen?

Member: No.

Rick: Okay, I think everybody else can maybe you want to just click on your…or maybe I’ve haven’t change the presenter. Rick Anderson, yeah I’m sorry my mistake.

Member: That’s okay.

Rick: Okay so this is what I was telling you I mean this is the way you would just clean that code up.

Member: Right.

Rick: You would comment like this and then you would take out that closing php tag and you would take out the opening php tag over here. So that’s one way to clean this up.

Member: So you don’t need those in the functions php? You don’t need the opening and closing?

Rick: Well, if you are leaving php you need to close it and if you are entering php you need to open it again.

Member: Okay.

Rick: But in custom functions php you’re starting php so you don’t need to open it for any reason. It is already open.

Member: Got you, okay so now I understand.

Rick: So, and so then what you would do here well in fact let’s just copy this one. This is the right way to do this

           function hungarian_menu_style() {
?>
<?php
}

And this would be typical_menu_style

           function hungarian_menu_style() {
?>
<?php
}
function typical_menu_style() {
?>
<?php
}

Member: Okay.

Rick: And then we’re going to copy this and paste it down there.

           function hungarian_menu_style() {
?>
<?php
}
function typical_menu_style() {
?>
<?php
}
function nav_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {  ?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php  }  else {  ?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
}

And this is going to be switch menu style

           function hungarian_menu_style() {
?>
<?php
}
function typical_menu_style() {
?>
<?php
}
function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {  ?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php  }  else {  ?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php  }
}

And then we’re going to say this

           function hungarian_menu_style() {
?>
<?php
}
function typical_menu_style() {
?>
<?php
}
function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {  ?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php  }  else {  ?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php  }
}
add_action(‘thesis_hook_after_header’, ‘nav_menu_style’);

And we are going to put this to wp_head,

           function hungarian_menu_style() {
?>
<?php
}
function typical_menu_style() {
?>
<?php
}
function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {  ?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php  }  else {  ?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php  }
}
add_action(‘wp_head’, ‘nav_menu_style’);
And,
function hungarian_menu_style() {
?>
<?php
}
function typical_menu_style() {
?>
<?php
}
function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {  ?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php  }  else {  ?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php  }
}
add_action(‘wp_head’, ‘switch_menu_style’);

And we’re going to call switch_menu_style the wp_head.

Member: Okay, why not a Thesis hook?

Rick: Because styles do not belong inside the body of the html document and that’s what they’ve done. They put a style inside the body of html document and they don’t belong there. They belong in the head of the document.

           function hungarian_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php
}
function typical_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php
}
function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {  ?>

                          <?php  }  else {  ?>
<?php  }
}
add_action(‘wp_head’, ‘switch_menu_style’);

Member: Okay, I don’t really understand why or ?

Rick: Well, because it’s not right. I mean it works but the head of the document and it’s suppose to get any styles that are declared in the document itself are supposed to be in the head.

Member: So, outside of a css document if you’re declaring a style you go in the head. Is that what you’re saying?

Rick: And well, declaring css documents also goes in the head.

Member: Okay.

Rick: Right, this little piece of code here <style type=”text/css”>,

           function hungarian_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php
}
function typical_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php
}
function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {  ?>

                          <?php  }  else {  ?>
<?php  }
}
add_action(‘wp_head’, ‘switch_menu_style’);

Member: Uhuh.

Rick: That always belongs in the head and never belongs anywhere else.

Member: Okay, got it.

Rick: And so what you’re doing here is you’re creating a function that you’re going to place in the head in the case of the hungarian menu and the function that you’re going to put in the head in every other case. And then you’re getting rid of these opening and closing php tags

           function hungarian_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php
}
function typical_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php
}
function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {  ?>

                          <?php  }  else {  ?>
<?php  }
}
add_action(‘wp_head’, ‘switch_menu_style’);

Because you’re never leaving, you’re never leaving php for these functions,

           function hungarian_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php
}
function typical_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php
}
function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
}  else {
                          }
}
add_action(‘wp_head’, ‘switch_menu_style’);

And then what you do is you say, okay if it’s the hungarian then choose a hungarian_menu_style and so you place the function name there,

           function hungarian_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php
}
function typical_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php
}
function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
hungarian_menu_style();
}  else {
}
}
add_action(‘wp_head’, ‘switch_menu_style’);

And if it’s typical then you do the typical_menu_style,

           function hungarian_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php
}
function typical_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php
}
function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
hungarian_menu_style();
}  else {
typical_menu_style();
}
}
add_action(‘wp_head’, ‘switch_menu_style’);

And you place that function name there.

Member: Let me ask you something.

Rick: Uhuh.

Member: The way this, the whole thing is basically on the it knows its hungarian when it sees that the page is in /hu/?

Rick: Right.

Member: So, if that’s not part of it how’s it going to know it’s hungarian?

Rick: Because it’s a SERVER[‘REQUEST_URI’]

Member: Okay.

Rick: The SERVER[‘REQUEST_URI’] is going to include that.

Member: Okay.

Rick: So that happens way before there’s any kind of…in fact that happens SERVER[‘REQUEST_URI’] happens before WordPress assigns what theme is being used.

Member: Right, okay.

Rick: So way before the head.

Member: So you, I’m sorry I totally missed what you did. So you added on top of the nav menu style then created more functions here. So you just expanded this.

Rick: Well, let’s just forget nav_menu_style()

Member: Pardon me?

Rick: Let’s just forget it because it’s, let’s forget it nav_menu_style() because it’s not right.

Member: But that’s where that, that the server function is. Isn’t it?

Rick: Well, actually I put the server function down here in switch_menu_style().

           function hungarian_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php
}
function typical_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php
}
function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
hungarian_menu_style();
}  else {
typical_menu_style();
}
}
add_action(‘wp_head’, ‘switch_menu_style’);

Member: Okay.

Rick: So, if string position includes /hu/, then use this function. And that function is right here.

           function hungarian_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php
}
function typical_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php
}
function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
hungarian_menu_style();
}  else {
typical_menu_style();
}
}
add_action(‘wp_head’, ‘switch_menu_style’);

Member: Okay.

Rick: Else, use this function and that function is this right here.

           function hungarian_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php
}
function typical_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php
}
function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
hungarian_menu_style();
}  else {
typical_menu_style();
}
}
add_action(‘wp_head’, ‘switch_menu_style’);

And then we are adding this function to the head,

           function hungarian_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php
}
function typical_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php
}
function switch_menu_style() {
//Nav menu styling according to langeuage /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
hungarian_menu_style();
}  else {
typical_menu_style();
}
}
add_action(‘wp_head’, ‘switch_menu_style’);

So now WordPress knows to place this code in the right spot and has a mechanism for choosing which piece of code to use, right. This assumed, well this places the code in the body of the text below the header. And you don’t want the code below the header. You want this code to be inside the head of the document.

           function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {  ?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php  }  else {  ?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php  }
}
add_action(‘thesis_hook_after_header’, ‘nav_menu_style’);

Member: Okay.

Rick: So what this does is we’ve created two different functions; I mean this is good coding practice any way splitting it up to making it small.

           function hungarian_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php
}
function typical_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php
}
function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
hungarian_menu_style();
}  else {
typical_menu_style();
}
}
add_action(‘wp_head’, ‘switch_menu_style’);

Member: Right, you know I can see that this is way beyond my skills. I won’t be able to do rest of this at all by myself. So, I think I’m just damn lucky that it worked the way it was; because I don’t see how I can do this at my level of not knowing depthly about php. I mean I am making an attempt to learn it but I, I am not there yet so I’m not going to be able to do it. I don’t think. I’m a bit lost I mean I sort of understand what you’re doing here and I; but I don’t see me without somebody’s guidance being able to do the rest of it. Because I don’t understand everything you did I see you do it but I couldn’t duplicate it.

Rick: Okay, well what we’ve done though is we’ve first off started with the knowledge. That <style> declarations belong in the head of the document.

Member: I got that part.

Rick: And in WordPress the correct hook to place anything in the head of the document is wp_head.

           add_action(‘wp_head’, ‘switch_menu_style’);

Member: Okay, I got that I won’t forget that part.

Rick: Okay so we’ve created a function and the way you create a function is you say the keyword function first

           function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
hungarian_menu_style();
}  else {
typical_menu_style();
}
}

And then give it a name,

           function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
hungarian_menu_style();
}  else {
typical_menu_style();
}
}

 And then give it your opening and closing parenthesis and then opening and closing braces,

           function switch_menu_style() {
//Nav menu styling according to langeuage /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
hungarian_menu_style();
}  else {
typical_menu_style();
}
}

So, that’s our function and then inside that function we’ve said now we’re going to use string position at the server request uri we’re going to say,

           function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
hungarian_menu_style();
}  else {
typical_menu_style();
                          }
           }

If that exists then call this function,
function switch_menu_style() {
//Nav menu styling according to langeuage /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
hungarian_menu_style();
}  else {
typical_menu_style();
}
}

And if it doesn’t exists then call this function,

           function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
hungarian_menu_style();
}  else {
typical_menu_style();
}
}

Member: And those are the ones I’ve got it.

Rick: And these functions are really simple. These functions just spit the html out.

           function hungarian_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php
}
function typical_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php
}
function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
hungarian_menu_style();
}  else {
typical_menu_style();
}
}
add_action(‘wp_head’, ‘switch_menu_style’);

Member: Okay. And the reason you have the php what you call this, the getting in the php code because it’s html.

Rick: Because this stuff is html right. This is closing php,

           function hungarian_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php
}
function typical_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php
}
function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
hungarian_menu_style();
}  else {
typical_menu_style();
}
}
add_action(‘wp_head’, ‘switch_menu_style’);

Going in the html,

function hungarian_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php
}
function typical_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php
}
function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
hungarian_menu_style();
}  else {
typical_menu_style();
}
}
add_action(‘wp_head’, ‘switch_menu_style’);

Member: Right.

Rick: And then opening up php,

           function hungarian_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php
}
function typical_menu_style() {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php
}
function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
hungarian_menu_style();
}  else {
typical_menu_style();
}
}
add_action(‘wp_head’, ‘switch_menu_style’);

Member: Okay, I guess I learn more than I think.

Rick: You could also do it this way. Instead,

           function switch_menu_style() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  1px; margin-left:  42px }
</style>
<?php
}  else {
?>
<style type=”text/css”>
.custom .menu a, .custom .menu li ul { letter-spacing:  2px; margin-left:  57px }
</style>
<?php
}
}
add_action(‘wp_head’, ‘switch_menu_style’);

I mean this is short enough. You know if you have lots of different choices then you would isolate each choice in its own function and then have a switch; that switch is between them. Now, you should go look at I mean you should watch some of the Customize Thesis Like a Pro videos that are related to Thesis 1.8.5. Because I do cover all these stuff pretty thoroughly in those.

Member: I did a long time ago, probably about a year and a half when I first joined your site.

Rick: Yeah.

Member: But it seems to me that the php didn’t get more involved. Maybe I’m wrong, maybe I should go back and look in a bit.

Rick: Well, there’s some really advance stuff in there too but…

Member: Okay.

Rick: But I’m going to put all these stuff in the chat window for you so you can see your various choices here. But you shouldn’t be writing php yourself if you’re not using a error checking code editor.

Member: Okay, I’ve already installing NetBeans.

Rick: So, I just put it in the chat window so you can copy and paste all that.

Member: Okay.

Rick: Actually menu style, I’m going to do this one more time here. One last one. And say, preferred and then take that and it’s not absolutely preferred. Until you start having lots of if fail statements to try and make up you know essentially having a bunch of control logic. Once you have a bunch of control logic you want to separate your logic from the actual action.

Member: Got it. A “T” got missed in the place of the typical_menu_style at the bottom, near the bottom.

Rick: Okay.

           function switch_menu_style_preferred() {
//Nav menu styling according to language /hu/
if(strpos($_SERVER[‘REQUEST_URI’], ‘/hu/’)  !== false)  {
hungarian_menu_style();
}  else {
typical_menu_style();
}
}
add_action(‘wp_head’, ‘switch_menu_style’);

Member: I’m going to work up those two then.

Rick: I just didn’t click the whole thing I think, so. But that’s how, this is called refactoring.

Member: Refractoring?

Rick: Yes; Or factor, refactoring.

Member: Refactoring.

Rick: When you are taking a function and breaking it down into simpler and more efficient component parts.

Member: Cause I could use it again?

Rick: While you can use it again it’s also very easy to read and very easy to maintain. Because now if you want to change the hungarian thing all you have to do is change that one little function.

Member: Right.

Rick: You don’t have to try and figure out anything else so.

Member: The other one that switch images I guess that’s also CSS.

Rick: Is it CSS? Yeah, if it’s CSS you would do exactly the same thing. And actually, although you could the css in this function. Right, if all you’re doing is writing CSS and you’re switching on exactly the same server request then you just group all the CSS together. You wouldn’t have two separate functions.

Member: Okay.

Rick: Right, so then you would put the hungarian css in this one and the typical css in this one. And switch menu style might not be the right name for any more but I mean you just name it something that makes sense.

Member: Right.

Rick: And include all of the CSS together rather than having multiple functions that adds css to the head of the document. If it’s the same criteria which it is. Right, if it’s hungarian then write all these extra css and if it’s not then don’t.

Member: Right. Okay.

Rick: What was probably the easiest thing to do is actually just include that css in your css file in your custom css file and then add the custom body class of hungarian or hu to the pages that are hungarian. And then, you know it would be .custom .hu menu a and…

Member: I’m not sure where would I, have to use the php to add the class then?

Rick: No, cause Thesis has a built in custom body class system where you just open up the page and it’s got a place for you down there in the meta boxes for custom css class. And you would just write…

Member: Okay. I have to see that if it’s, I’ve seen that because I am using wp… a multilingual wpml? So I assume that it’s still there when I go and look at that page. I never thought about that.

Rick: Well and wmpl probably adds its own body classes based on language, I mean you can check the body class and see.

Member: You’re so smart.

Rick: But that’s what, it’s actually what I would do instead of this. Because you don’t really, if it’s CSS and it’s based on something specific Thesis gives you the ability to be that specific.

Member: Right. Okay.

Rick: And it will speed up the loading of your site because the next time somebody comes there they will have cached the custom css file and it will have less data that’s being passed every time a page loads. You will have you know some number of less questions that php has to ask. And so, it’s just faster and more efficient not to do it like this; if all you’re doing is css, then Thesis gives you the opportunity to add the custom body class with the end I’m betting what’s the URL of the site?

Member: It’s really long, it’s the previous site hungrypreview.hershkovitzipgroup.com

Rick: Can you paste it in the chat window?

Member: Sure.

Rick: Cause I think, I’ll bet you will find that the body class is already added by wpml. Now you noticed when I put my code in the chat window it’s actually a chat window not the question box right?

Member: Oh, sorry yeah. Yes, I did actually I didn’t; the chat window closed.

Rick: No, it’s fine. Inspect element, let’s see if we look at the body there is no custom. If we go to Hungarian, no it doesn’t have; it’s not adding a custom…

Member: body class.

Rick: Body class based on the language that’s chosen so rather than doing that you would just add it yourself in Thesis. You know what I’m talking about?

Member: Yeah, I think so it’s in the page editor.

Rick: Yeah, each page and post has the ability to for you to specify so.

Member: Right, and I assume that’s still the case because you know when you translate this you get another rendition of the screen but I guess it’s a Thesis screen. I never really thought about it.

Rick: Yeah.

Member: I was focused on just pasting my translation in there.

Rick: Well, that’s what I would do first is I would look to see if you could do that first. Is see if you can add the custom body class to this and then just put that stuff in your CSS.

Member: I think so I can tell you right now if you want to look on it. Actually, no you don’t get; the translation does not go into a Thesis page. It goes into the translation editor in wpml.

Rick: Okay, I see.

Member: Now, let me see if I pull that page up in just the page editor and see if I can; actually there is a maybe a way I can go in. Okay, I can open it up in a page so and here is custom fields. Or that was custom fields not class for a minute where is class?

Rick: Well.

Member: But I’m getting the regular page so I could get to it.

Rick: Okay.

Member:  I think I’ll try it and see if it work.

Rick: Sure, that’s what I would do.

Member: You’re so smart.

Rick: And I’m being to close down and leave. I’m half hour late so.

Member: Oh, okay I didn’t realized you got a place to go I’m so sorry.

Rick: No, it’s okay. Yeah.

Member: Thank you very much.

Rick: You’re welcome.

Member: I really appreciate it.

Rick: You betcha.

Member: And I’ll let you know, I’ll play with this and might you know what happens.

Rick: Okay, have a good evening.

Member: Okay, you too. Bye Rick.

Rick: Bye bye.

0 Comments… add one

Save $200 on Membership Now!

Start learning today for as little as
$0.82 PER DAY!
THIS IS A LIMITED TIME OFFER!
Subscription Options
0 comments… add one

Leave a Comment