Build Your Own Business Website header image

Community Library Website – Part 32, Add Custom Menus to the Catalog Page

Difficulty Level -

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.

This is the thirty second in a series of live lessons on using WordPress and Thesis as a Content Management System (CMS). In this lesson we continue working on our new catalog page and add the first custom menu using functions in our custom_functions.php file. This allows us to specify that the menus only show up on the catalog page. We use similar code to what we used when we created the Footer Menu for our new menus. Then in our custom.css file we create styling for these menus.

Community Library Website – Case Study Part 1 – Site Organization
Community Library Website – Case Study Part 2 – Create Custom Post Types
Community Library Website – Case Study Part 3 – Custom Post Type Configuration
Community Library Website – Case Study Part 4 – Custom Taxonomy Decisions – Theory
Community Library Website – Case Study Part 5 – Custom Taxonomy Decisions – Practical Application
Community Library Website – Case Study Part 6 – Incorporating Existing Data Into the Project
Community Library Website – Case Study Part 7 – Creating Hierarchical Custom Taxonomies
Community Library Website – Case Study Part 8 – Creating Non-Hierarchical Custom Taxonomies
Community Library Website – Case Study Part 9 – Creating Custom Post Meta
Community Library Website Case Study – Part 10a – Restore the Database Using BackupBuddy
Community Library Website Case Study- Part 10 – Creating Custom Post Meta – Continued
Community Library Website – Part 11 – Importing Existing Data to the Website
Community Library Website – Part 12 – Prepare Existing Data for import by the CSV Importer plugin
Community Library Website – Part 13 – Import Existing Data Using the CSV Importer Plugin
Community Library Website – Case Study Part 14 – Date in Permalink Configuration
Community Library Website – Part 15 – Importing Images
Community Library Website – Part 16b – Final Data Import
Community Library Website – Part 17 – Add Thesis Post Meta to Custom Post Type
Community Library Website – Part 18 – Add WordPress 3.0 Menus
Community Library Website – Part 19 – Add Post Meta and Taxonomy Information to the Post Display
Community Library – Part 20 – Add topics and audience to book display
Community Library – Part 21 – Display the Rest of the Post Meta in the Post
Community Library Website – Part 22, Create the Permalink Structure
Community Library – Part 23 – Remove Custom Post Meta from Post Display
Community Library Website – Part 24, Add Taxonomy and Post Meta Data to the Teaser
Community Library Website – Part 25, Add Taxonomy Data to the Teaser
Community Library Website – Part 26, Adjust the Teaser Styling Using Design Options
Community Library Website – Part 27, Styling the Teaser Using CSS
Community Library Website – Part 28 – Fine Tune the Teaser Display
Community Library Website – Part 29, Designing a Custom Catalog Page
Community Library Website – Part 30, Using a Query String in a URL
Community Library Website – Part 31, Adding Custom WordPress Menus
Community Library Website – Part 32, Add Custom Menus to the Catalog Page
Community Library Website – Part 33, Add Another Custom Menu to the Catalog Page
Community Library Website – Part 34, Troubleshooting Custom Menus
Community Library Website – Part 35, Add Styling to WordPress Menus
Community Library Website – Part 36, Add HTML Markup to WordPress Menus
Community Library Website – Part 37, Add WordPress Menus to Archive Pages
Community Library Website – Part 38, Add and Style a List of Tags
Community Library Website – Part 39, Add a Search Box to the Sidebar
Community Library Website – Part 40, Add Links to the Sidebar
Community Library Website – Part 41, Add Taxonomy Drill Down Browsing
Community Library Website – Part 42, Custom Loop to Display Custom Post Types
Community Library Website – Part 43, Simple Custom Query
Community Library Website – Part 44, Custom Taxonomy Query
Community Library Website – Part 45, Add Thesis HTML Structure to Teasers
Community Library Website – Part 46, Display Posts from the Last 60 Days
Community Library Website – Part 47, Custom Loop If Have Posts
Community Library Case Study – Part 48, Increase the Number of Posts that Display on the Custom Catalog
Community Library Website – Part 49 – Naming Conflicts in Custom Taxonomies
Community Library Website – Part 50 – Find and Replace Semi-colons in the Database
Community Library Website – Part 51 – Modify Taxonomy Names Directly in the Database
Community Library Website – Part 52 – Sort Posts by Meta Value
Community Library Website – Part 53 – Show the Term Label Only when a Term Exists
Community Library Website – Part 54 – Sort Archive Posts by Meta Value
Community Library Website – Part 55 – Add Sort Order to Custom Taxonomy

Video Transcript

And while we’re waiting for that to refresh itself, let’s just go over to our custom functions php file. Remember 2 weeks ago, we added this footer menu? Well, we’re going to copy this and do exactly the same thing. So we copy that code and we’re going to make… this function is going to add the adult menu to the catalog page and args equals array menu is going to be adult menu instead of footer menu. And then menu class instead of footer menu here again, we’re going to say adult.

And then what we want to do is we only want this on the catalog page so we will put a conditional statement in. If is page and we need to get the page id for that… if is page and then we’ll finish wrapping this up into that. So now, we’ve wrapped our arguments in this if is page and then what we’ll do is we will… it’s not Thesis hook footer, it’s going to be Thesis hook after content and this is going to be adult menu. Paste that function name there.

And so now what we’re doing is we are adding to Thesis hook after content the byob adult menu and then we’ll have…and the adult menu is going to have this menu class of adult menu which is going to let us add that special styling to it. Let’s go ahead and save it.

And actually, before we get too far into this, I just want to go ahead and open… I want to go to our custom CSS file too and let’s see, here’s our footer menu. We’re going to copy the footer menu and this is going to be the adult menu. And list style none except it’s adult and adult… save this and let’s see, Pam’s got a question so I’m going to unmute her microphone. Go ahead, Pam.

Oh…

You said… when I used… wouldn’t after content put the menu after the teasers? Now the answer to that generally is yes although in this case, it’s no because this here is not the content. This is a custom query that we are going to write that is going to fall after this. You might put a brief sentence up here of content and you might have no content, just have this title.

Okay, I understand.

So that’s why it’s after content because it’s not… this is not going to be content. Okay so we uploaded that… no, we didn’t upload it. We just saved it. Now we’re going to upload it and let’s see, let’s try to have this up and ready to go. Library, connect, WP content, themes, thesis_18, custom, custom functions php. We’re going to upload to our site and the custom CSS, we’re going to upload to our site. And let’s just go see what it looks like. Obviously, we haven’t styled anything and it might not look right at all but let’s just try it. Oh, cancel. Let’s see, save the menu… okay, custom catalog.

Okay so after content, it didn’t really take me where I wanted to go. I guess we need to look at that hook one more time. But you can see the menu down here. I must have been after content box. It could also be… we could also use after post, I think. Let’s go to the user’s guide here and look at our hooks and Thesis hook after… I just used after content. Maybe it’s after content box. No, it’s not after content box. It’s either further down. After content… oh no, actually, it’s not further down but it’s still not the right one. After content… oh no, actually, it’s not further down but it’s still not the right one. I think what we want to do is like Thesis hook after post box or something like that. Let’s see, if there’s a one post…if more than one post is… hook fires for each of them. So Thesis hook after post… format entry after post so it’s after post box then, Thesis hook after post box.

And Pam asks, “Can we change the name of this stuff?” and of course, we can.

So let’s see, let’s come back over to here and Thesis hook after post box, save it, upload it. Let’ see, let’s just close that one and refresh it. Okay, there we go. Now it’s here.

And then the next thing we need to do then is we want to style this so it’s… well okay, let’s get rid of your adult references in here first. So… oh you’re right. This is showing on every page at the moment. I did not look up page id. Thank you for pointing that out.

If we go to pages and we look at browse our library catalog, that is post id 200. You can see that down here at the bottom, right? Hover there again, post id 200. So then we’ll come back over to the code… if is page… that did add itself to every page. If is page 200…you know, we may as well add the other menu here too while we’re doing this. So if we come back over to menus, Appearance and Menus… where am I? There we go, okay let’s change that to nonfiction. Okay and let’s change this one to nonfiction…or right to fiction without the adult. So we don’t have the adult in front of it. Okay, save.

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