Category: web development

even more responsive-ier

finally took care of a nagging part of my site… the top slideshow. it wasn’t responsive before and now it is

it’s based off the responsive slider plugin. i had to make a minor change to it so it would show six slides per page load, choosing randomly from the library of slides. by default, it would show x amount of slides, where x is set in the settings > reading section (“Blog pages show at most”)

default

$slides = new WP_Query( array( 'post_type' => 'slides', 'order' => 'ASC', 'orderby' => 'menu_order' ) );

updated

$slides = new WP_Query( array( 'post_type' => 'slides', 'order' => 'ASC', 'orderby' => 'rand', 'posts_per_page' => 6 ) );

i actually didn’t expect the 'orderby' => 'rand' part to do what it did (choose randomly from the library of slides), but i’m pretty happy with it. this way, i can upload as many slides and not have to worry about ordering them in any special way

'posts_per_page' => 6 is what controls the amount of slides that are shown in the slideshow

yes, i’m aware that this will be killed if i update the plugin…

behold, the power of $wpdb!

the $wpdb object is crazy powerful. with it, you can access almost anything in your database

this is extremely helpful when doing plugin development…

recently at work, i was tasked to do this project:

  • create a wordpress plugin that requires a separate database table
  • the table will house data imported from several excel files
  • admin will be able to add/edit/delete entries
  • create a template that will display the data, dropdowns will help filter information: date, location
  • sort by date, then event name

$wpdb was used heavily in this plugin and it works well

Read more »

fun with custom post types!

i’ve added a new feature to my site: custom post types. you can see the page here — as you can see, it’s all of my sketches i’ve done since last august

code

functions.php
first add this to allow for featured images (if it’s not already in there):

add_theme_support( 'post-thumbnails' );

This part will register the custom post type to wordpress

add_action( 'init', 'create_sketch' );
function create_sketch() {
$labels = array(
'name' => _x('Sketches', 'post type general name'),
'singular_name' => _x('Sketch', 'post type singular name'),
'add_new' => _x('Add New Sketch', 'Sweet'),
'add_new_item' => __('Add New Sketch'),
'edit_item' => __('Edit Sketch'),
'new_item' => __('New Sketch'),
'view_item' => __('View Sketch'),
'search_items' => __('Search Sketches'),
'not_found' => __('No Sketches found'),
'not_found_in_trash' => __('No Sketches found in Trash'),
'parent_item_colon' => ''
);

$supports = array('title', 'editor', 'revisions', 'thumbnail', 'comments');

register_post_type( 'sketches',
array(
'labels' => $labels,
'public' => true,
'supports' => $supports
)
);
}

Read more »

wordpress: get post slug

originally found this on josh stauffer’s site. just wanna add to my site so i can pull it up easily

$slug = basename(get_permalink());

php: modifying a filename

needed to do this to make wordpress choose the thumbnail image instead of the full-sized image — since some people like to upload gernormous images (recall that wordpress uploads a whole set of images when you upload one)

so this adds a suffix (in this case, “-150×150”) to the of the filename, BUT before the file extension

anyway, here it is:

// set your suffix
$thumbnail_suffix = "-150x150";

// $featured_image is the filename. this would be determined above this code snippet
// determine the length of the filename, including the extension
$length = strlen ($featured_image);

// get the first part of the filename (before the extension)
$temp1 = substr ($featured_image, 0, $length-4);

// get the second part of the filename (the extension)
$temp2 = substr ($featured_image, $length-4, $length);

// stick the suffix in between the two halves
$featured_image_updated = $temp1.$thumbnail_suffix.$temp2;

you might be saying, “but joey.. why don’t you just use something like explode to break up the filename?” well you really don’t know what the filename will be — it could have a bunch of dots in it… if you could figure it out, great. let me know what you did.

at least you know every image file that’ll be uploaded will be a “.” and then three characters after.

wordpress: back to (grand)parent

was challenged at work and couldn’t think of a proper solution. i knew it was possible, but didn’t know how to execute it

this is what happens when you don’t know all the tools you have available to you…

thank god for the wordpress community

background

this makes absolutely no sense without any background! essentially i have a splash page that goes to several sub-sites. when you get to a sub-site, i want each sub-site’s home to go back to its own home location, not the splash page, which would be 

< ?php echo get_option('home'); ?>

code

< ?php //parent variables
	$parent = get_post($post->post_parent);
	$parent_title = get_the_title($parent);
	$grandparent = $parent->post_parent;
	$grandparent_title = get_the_title($grandparent);?>

	< ?php // is the homepage the granparent?
	if ($grandparent == is_page('0')) { ?>
	<li><a href="/<?php echo get_permalink($grandparent); ?>">Back to < ?php echo $grandparent_title; ?></a></li>
	<li><a href="<?php echo get_permalink($post->post_parent); ?>">Back to < ?php echo $parent_title; ?></a></li>

	< ?php // is the homepage the parent?
	} elseif ($post->post_parent ==is_page('0')) {?>
   <li> <a href="<?php echo get_permalink($post->post_parent) ?>">Back to < ?php echo $parent_title; ?></a></li>

    < ?php // I must be a top level page!
	} else { ?> <!-- no parent to show -->
< ?php }?>

wordpress php snippets

here are a bunch of frequently used code snippets i’ve used with many of my projects

* i really should know these by now… but what are ya gonna do?

linking to the homepage

    <a href="<?php echo get_option('home'); ?>">...</a>

    image references

      <img src="<?php bloginfo('stylesheet_directory'); ?>/images/FILE_NAME.jpg"
alt="<?php bloginfo('name'); ?>" title="<?php bloginfo('name'); ?>" />

      dynamic widgets

        <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('WIDGET_NAME') ) : ?>
<?php endif; ?>

        then, in functions.php, add this:

        register_sidebar(array('name'=>'WIDGET_NAME',
'before_widget' => '',
'after_widget' => '',
'before_title' => '<h3>',
'after_title' => '</h3>',
));

        custom fields – mentioned before on my site, but just to have ’em all together

          <?php $VARIABLE_NAME=get_post_meta($post->ID, "CUSTOM_FIELD_NAME", true);
if (get_post_meta($post->ID, "CUSTOM_FIELD_NAME", true)) {
echo ("<img src=\"FULL_PATH_TO/$VARIABLE_NAME\" />");
} ?>

          copyright

            &copy; <?php echo date('Y'); ?> - <?php bloginfo('name'); ?>

            more coding funzz!

            on the topic of “figuring things out wrt coding” — i was working on converting a site to wordpress and was trying to figure out how to get a home page movie to appear ONLY on the home page (easily).
            so i looked around and found out there was a wordpress function called “is_front_page()”

            so, along with a nifty fade in/fade out script, i created this in the header.php file:

            <?php
  if ( is_front_page() ) {
  echo "
    <div class=\"hpmovie\">
      <div id=\"xlide\">
        <img src=\"wp-content/themes/[THEMENAME]/images/5.jpg\"
          alt=\"\" />
        <img src=\"wp-content/themes/[THEMENAME]/images/11.jpg\"
          alt=\"\" />
        ...
      </div>
    </div>
  ";
  }
?>

            so basically, if it’s the home page, it’ll write stuff to the page… boom

            coding fun!

            so this won’t make sense to any of you, but i was pretty proud of myself when i made this. i used various xsl elements to basically have the page pull data from an xml document:

            xsl

            ...
<xsl:variable name="readmore">
  <xsl:choose>
    <xsl:when test="@readmore != ''">
      <xsl:value-of select="@readmore" />
    </xsl:when>
    <xsl:otherwise>
      See all <xsl:value-of select="@title" />
    </xsl:otherwise>
  </xsl:choose>
</xsl:variable>
<div style="font-size:8pt;">
  <a href="{@url}"><xsl:value-of select="$readmore" /></a>
</div>
...

            this is a sample of the xml that it pulls:

            <page id="..." title="Newsletters" url="newsletters.asp"
  thumbnail="include/media/images/products-newsletters.gif"
  description="blah blah blah">

            so since there isn’t a title attribute to this node, it’ll default to the title. on the page, it’ll say “See all Newsletters”

            i made it myself! yay

            Older
            Newer