Updates to the site
Well, it has been some time since I’ve made any updates to the site. I initially used a theme that gave a portfolio look to the site. Unfortunately it was a little hokey, so I wanted to update it. In the last year I also picked up a new hobby and a wife, in that order. The wife-to-be had an interest in screen writing, so I decided that I would take over a Meetup group that would help me help her get a screen play published. Since I took over The RTP “Let’s Make a Movie” Meetup Group, I have done two movie projects and am currently working on the third. So, I decided that I would add movie work on this site as well. With that in mind, a overhaul was needed.
The first thing I needed to do was fix the theme. I found a couple I liked, but they broke the code highlighter. I stumbled upon this theme by RedEvolution, which had a nice color and handled things well, until I installed it. I figured since it was most of the way there, I would just alter it to get it all the way to my needs. Initially there wasn’t anything in the theme to prevent Pages that were at the top level from showing, that I didn’t want to show. I altered the header file that creates the Page navigation to only show the pages that I want. The change of code was inserting the include and sort order values to the page list call.
<div id="user3">
<ul><?php wp_list_pages('depth=1&include=1,2,3,4&sort_column=ID&sort_order=DESC&title_li='); ?></ul>
</div>
<!--user3-->
Next on the agenda was adding my logo image to the top of the site. The theme display the Blog Title without an option to add a personalized logo. I’m sure there is a plugin to do this, but I found some code to easily alter the header information to add the logo on the WordPress Forum. The thread was two years old, but the code was still valid. The change to the header file adds a div class for the logo, while leaving the Blog Title available to be placed by the style sheet.
<div class="logo"><h1 class="offscreen"><a href="<?php bloginfo('url'); ?>/"><?php bloginfo('name'); ?></a></h1>
<div class="bubble"><p><?php bloginfo('description'); ?></p></div>
</div>
The style sheet changes help place the Blog Title off of the visible page and sets the background image of the div to the logo image file residing in the images directory. I also had to do some creative padding to get the logo and Blog Tagline to show in the right place.
.logo{
position:relative;
z-index:1;
background: url(images/header-logo.png) no-repeat top left;
padding:12px 0 0 0;
}
.offscreen {
font-size: 0;
text-indent: -999em;
}
.bubble p{
color:#fff;
margin:0;
padding:0 0 0 30px;
}
Finally, I initially wanted my logo to change whenever the Category or Page changed. For example: if the Films Page was selected, then the logo would change to the DeanLogic Films logo. Unfortunately I haven’t gotten it all sorted out. I did manage to update the header to display the Category Description and Image for the selected Post. This code change to the header file can be found under the WordPress Codex. Simply just cycle through each of the categories for the post and get the Category Description and Category Slug. Then you will need to upload images to correspond with the image name created from the slug. For multiple categories, just append each description and image code together.
$catCount = 0;
foreach((get_the_category()) as $category) {
if($catCount == 0){
$catAbout .= $category->category_description;
$catImage = '<img src="' . get_bloginfo('template_directory') . '/images/' . $category->category_nicename . '.png" align="right" alt="' . $category->cat_name . '" />';
} else {
$catAbout = $catAbout . '&nbps;&nbps' . $category->category_description;
$catImage .= '<img src="' . get_bloginfo('template_directory') . '/images/' . $category->category_nicename . '.png" align="right" alt="' . $category->cat_name . '" />';
}
$catCount++;
}
$pageContent = $catAbout;
I will probably just create a image for each Page, since the Categories don’t match up exactly to each of the Pages. I initially wanted them to match up, but it didn’t work out logically for me. And while I was typing up this post the solution came to me. I did a search and found a way to get the Category information from the page slug parsed from the URI. It took me a couple of searches, but I finally found good example of using get_term_by. From this information, I updated the header file to include a step if the category was not found due to being a Page and not a Post.
if($catCount == 0){
$catSlug = current( explode( '/', trim( $_SERVER['REQUEST_URI'], '/' ) ) );
$tempCategory = get_term_by('slug', $catSlug , 'category');
$catName = $tempCategory->name;
$catImage = '<img src="' . get_bloginfo('template_directory') . '/images/category-' . $catSlug . '.png" align="right" alt="' . $catName . '" />';
$catAbout = $tempCategory->description;
}
I also had to make a small adjustment for when the site is on the home page. It tends to grab the first post category, so I have a check to see if there’s no URI length and then provide the text from the About Page. Here is the final code.
if(strlen($catSlug) < 1){
$pageData = get_page_by_path('about');
$catAbout = apply_filters('the_content', $pageData->post_content);
} else {
foreach((get_the_category()) as $category) {
if($catCount == 0){
$catAbout .= $category->category_description;
$catImage = '<img src="' . get_bloginfo('template_directory') . '/images/category-' . $category->category_nicename . '.png" align="right" alt="' . $category->cat_name . '" />';
} else {
$catAbout = $catAbout . '&nbps;&nbps' . $category->category_description;
$catImage .= '<img src="' . get_bloginfo('template_directory') . '/images/category-' . $category->category_nicename . '.png" align="right" alt="' . $category->cat_name . '" />';
}
$catCount++;
}
if($catCount == 0){
$tempCategory = get_term_by('slug', $catSlug , 'category');
$catName = $tempCategory->name;
$catImage = '<img src="' . get_bloginfo('template_directory') . '/images/category-' . $catSlug . '.png" align="right" alt="' . $catName . '" />';
$catAbout = $tempCategory->description;
}
}
Now all I have to do is make some better Category / Page images and start adding information from the films.
