Archive for the ‘Code’ Category
Custom Post Type Admin Icons
Let’s face it, its pretty awesome having the ability to add a custom icon to your admin menus for custom post types. Here is a bit of code we added to the function.php file of our theme for a recent project. All you need to do is drop your custom icons in the images directory of you theme and tweak the code below. “Newsletters” and “Events” are the names of our 2 custom post types for this project.
add_action( 'admin_head', 'cpt_icons' );
function cpt_icons() {
?>
<style type="text/css" media="screen">
#menu-posts-newsletters .wp-menu-image {
background: url(<?php bloginfo('template_url') ?>/images/mail.png) no-repeat 6px -17px !important;
}
#menu-posts-events .wp-menu-image {
background: url(<?php bloginfo('template_url') ?>/images/calendar-blue.png) no-repeat 6px -17px !important;
}
#menu-posts-newsletters:hover .wp-menu-image, #menu-posts-newsletters.wp-has-current-submenu .wp-menu-image,
#menu-posts-events:hover .wp-menu-image, #menu-posts-events.wp-has-current-submenu .wp-menu-image {
background-position: 6px 7px!important;
}
</style>
<?php }
You can find a sweet collection of icons and further direction at RandyJensenOnline.com.
Da Categorie(s): Code, Custom Post Types, Wordpress
The Events Calendar Doesn’t Display Today’s Event on Upcoming Events Page
We’ve seen this issue a couple times on a few different sites. It seems to come and go and is always a major issue when it happens. The Events Calendar plugin will stop displaying today’s event on the upcoming events page and move it to the past events page which leads to chaos if you’re in the process of promoting that event. Here is a simple fix to correct this problem, remember to update this code each time you upgrade the plugin.
On line 15 of this file:
/wp-content/plugins/the-events-calendar/the-events-calendar.class.php
Replace this:
const DBDATETIMEFORMAT = 'Y-m-d G:i:s';
With this:
const DBDATETIMEFORMAT = 'Y-m-d';
The Events Calendar and Custom Post Types
The Events Calendar plugin is outstanding for tracking events within WordPress sites and blogs. The integration of templates into your own theme means you don’t risk overwriting updates each time you upgrade the plugin. This is probably the strongest event calendar plugin we’ve used, but that doesn’t mean there aren’t some tweaks that could be made. Unfortunately, all events are listed as regular posts in WordPress; this works fine, but if you’re a neat-freak like we are, you like to have everything in its own place using custom post types. Because The Events Calendar doesn’t support custom post types (yet), we have to force it a little. It’s actually pretty easy and only take a little bit of code to complete, check it out below.
On line 1029 of this file:
/wp-content/plugins/the-events-calendar/the-events-calendar.class.php
Replace this:
public function addEventBox( ) {
add_meta_box( 'Event Details', __( 'The Events Calendar', 'Events_textdomain' ),
array( $this, 'EventsChooserBox' ), 'post', 'normal', 'high' );
}
With this:
public function addEventBox( ) {
add_meta_box(
'Event Details', __( 'The Events Calendar', 'Events_textdomain' ),
array( $this, 'EventsChooserBox' ), 'post', 'normal', 'high' );
add_meta_box( 'Event Details', __( 'The Events Calendar', 'Events_textdomain' ),
array( $this, 'EventsChooserBox' ), 'events', 'normal', 'high' );
}
The word “events” on line 6 is the name of your custom post type. We use “events” because, well, they are events.
Now that the events are showing in your custom post types, you’ll need to edit the events templates, these are kept in the “events” directory within your theme. All you need to do is tweak the query to pull the custom post type, so add the following line of code right before the loop starts:
<?php query_posts('post_type=events&category_name=events&eventDisplay=upcoming'); ?>
Da Categorie(s): Code, Custom Post Types, Plugins, Wordpress
Contact Form 7 Clear Default Value
Contact Form 7 is one of our favorite form plugins because its updated regularly and there are a ton of extensions you can install that make the user-experience that much more rewarding; our favorite is the Database Extension. One feature that people have been asking about for quite some time is the ability to clear the default value of a field onClick or onFocus. This can be done easily by changing a couple lnes of code in the plugin, but remember, when you upgrade Contact Form 7, you’ll need to reapply this change.
On line 89 in this file:
/wp-content/plugins/contact-form-7/modules/text.php
Replace this:
$html = '<input type="text" name="' . $name . '" value="' . esc_attr( $value ) . '"' . $atts . ' />';
With this:
$html = '<input type="text" name="' . $name . '" value="' . esc_attr( $value ) . '"' . $atts . ' onfocus="if(this.value==\''; $html = $html . esc_attr( $value ) . '\') this.value=\'\';" onblur="if(this.value==\'\') this.value=\'' . esc_attr( $value ) . '\';" />';
And on line 88 in this file:
/wp-content/plugins/contact-form-7/modules/textarea.php
Replace this:
$html = '<textarea name="' . $name . '"' . $atts . '>' . esc_html( $value ) . '</textarea>';
With this:
$html = '<textarea name="' . $name . '"' . $atts . ' onblur="if (this.value == \'\') {this.value = \'' . esc_html( $value ) . '\';}" onfocus="if (this.value == \'' . esc_html( $value ) . '\') {this.value = \'\';}">' . esc_html( $value ) . '</textarea>';
With those 2 tweaks you should be able to clear the default value each time the user clicks the text field or text area.
CSS Min-Height Hack
Okay, let’s just say we’re not huge fans of hacking code, any code. We love conforming to web standards and we do all we can to stick within the guidelines presented to us by the almighty w3c. That being said, there will be times when you come up against something that requires a quick fix for an issue that has no real solution; well web ,compliant solution that is. Below is a great work arond for the min-height styles issue, if you have no idea what we’re talking about, bookmark this cause sooner or late you’ll come across a scenario where this would come in handy.
.example {
min-height: 280px;
height: auto !important;
height: 280px;
}
The above code works in IE6, IE7, IE8, Firefox, and Chrome. We haven’t found anything it hasn’t worked on yet, if you find an issue in a browser, please let us know and we’ll update this post.
