Author: Aaron Belchamber

Senior Cloud Software Engineer and 25+ years experienced video production, video editing and 3D animation services for a variety of global clients including local video production here in Jacksonville, Florida.

Ensure certain elements on a page display in matching heights throughout.

02/26/2014 Aaron Belchamber 1 Comment

There are some new CSS tricks coming out that will allow for this to be done natively, but until then, here’s a way to make sure that all elements in a page, say gallery thumbnails or excerpts from posts, all display their full texts and are all sized the same.  Without using this fix after page load, some elements may display taller than others, and if these elements are floating in the page, they may definitely not display in a nice even grid as intended.same-height-of-elements-in-pageWith a few lines of jQuery (make sure you load the newest version via CDN) you just simply assign the elements you want to have the same height with the same unique class, like “same-height-group-1” or something short you can remember.  Then, change out the “.class-to-resize” in the script below with the actual class you assigned the elements.  From now on, after a page loads, all the elements assigned that same class will all have the same height, and you will never have to worry about those “sticky” floating blocks that ruin the whole look of your page.


<script type="text/javascript">
// You might probably want to envelope the below in a $(document).ready() function

max_h=0;

$(".class-to-resize").each(function(){

this_h=$(this).height();
if (this_h>max_h) { max_h=this_h;}

});

// Now, cycle through again to resize all elements to the maximum height

if (max_h>0){
$(".class-to-resize").each(function(){

$(this).height(max_h);

});

}

</script>

Tell a browser not to cache a page

02/26/2014 Aaron Belchamber No Comments

So simple, but yet, so under used.  Force the browser to reload the page’s contents without loading anything from its temporary cache.

What the heck does “pragma” mean?  Let’s be pragmatic and find out!


<meta http-equiv="pragma" content="no-cache" />

Add an RSS post thumbnail to an RSS feed

02/26/2014 Aaron Belchamber 3 Comments

RSS feeds are handy, but let’s face it, images do say so much more than words.  They stand out and grab attention, they help people identify blocks of information quicker.  They really are worth 1,000 words if you think about it.  Sometimes, a lot more….

Add this to your template or into your functions.php file:


function rss_post_thumbnail($content) {
global $post;
if(has_post_thumbnail($post->ID)) {
$content = '<p>' . get_the_post_thumbnail($post->ID) .
'</p>' . get_the_content();
}
return $content;
}
add_filter('the_excerpt_rss', 'rss_post_thumbnail');
add_filter('the_content_feed', 'rss_post_thumbnail');

Connecting to PDO as an object

02/26/2014 Aaron Belchamber No Comments

Moving from procedural with mysql_connect, etc to PDO objects should be an easy transition.  It’s so much faster and reliable, too.  The “mysql” library in PHP will soon be deprecated, so you hold-outs won’t have a choice.  It’s actually less code to write and get whole queries into resulting arrays much faster.  Trust me!

Here’s how you instance a new PDO object and connect to your MySQL database through PDO:


<?php

/*** mysql hostname ***/
$hostname = 'localhost';

/*** mysql username ***/
$username = 'username';

/*** mysql password ***/
$password = 'password';

try {
$dbh = new PDO("mysql:host=$hostname;dbname=mysql", $username, $password);
/*** echo a message saying we have connected ***/
echo 'Connected to database';
}
catch(PDOException $e)
{
echo $e->getMessage();
}
?>

 

Center a Div and other HTML blocks

02/26/2014 Aaron Belchamber No Comments

CSS can often be tricky.  What do we need to do to get all those pesky browsers to show things the way we want?!  Sometimes, I marvel at the patience of people who find out, after hours, just how to nudge something properly one way or get the body of text to flow and display just the way they’re asked to do it.  So, something so basic, why is it sometimes so much trouble?  And do we need to write all this just to center a block?!  Why can’t we just say “align:center”?!  Don’t get me started on VERTICAL alignment, that’s not nearly as easy as table cells made such a trick out to be….

Add this to any of your CSS or inline where needed and make sure no other margins are defined:


margin-left:auto;margin-right:auto;

Note:  Be sure a width and height of this block element is also defined!