<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" media="screen" href="/~d/styles/rss2full.xsl"?><?xml-stylesheet type="text/css" media="screen" href="http://feeds.feedburner.com/~d/styles/itemcontent.css"?><rss xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:sy="http://purl.org/rss/1.0/modules/syndication/" xmlns:slash="http://purl.org/rss/1.0/modules/slash/" xmlns:feedburner="http://rssnamespace.org/feedburner/ext/1.0" version="2.0">

<channel>
	<title>Geek the Freak Out! It's Joseph Hinson!</title>
	
	<link>http://geekoutwith.me</link>
	<description>Doing right by the internet since I learned how.</description>
	<lastBuildDate>Fri, 03 Feb 2012 13:58:31 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.2.1</generator>
		<atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="self" type="application/rss+xml" href="http://feeds.feedburner.com/geekoutwithme" /><feedburner:info uri="geekoutwithme" /><atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="hub" href="http://pubsubhubbub.appspot.com/" /><feedburner:emailServiceId>geekoutwithme</feedburner:emailServiceId><feedburner:feedburnerHostname>http://feedburner.google.com</feedburner:feedburnerHostname><item>
		<title>Shortcode to show all files attached to post as list [showfiles]</title>
		<link>http://feedproxy.google.com/~r/geekoutwithme/~3/Bd-uJfjeCSM/</link>
		<comments>http://geekoutwith.me/2012/01/shortcode-to-show-all-files-attached-to-post-as-list-showfiles/#comments</comments>
		<pubDate>Thu, 12 Jan 2012 21:37:31 +0000</pubDate>
		<dc:creator>Joseph</dc:creator>
				<category><![CDATA[Code]]></category>
		<category><![CDATA[Web Dev]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://geekoutwith.me/?p=1430</guid>
		<description><![CDATA[Here&#8217;s the code:
// [showfiles]
function dump_files($atts) {
        extract(shortcode_atts(array(), $atts));
        global $post;
        $return = '';
        $children = get_children( 'numberposts=-1&#38;orderby=menu_order&#38;order=ASC&#38;post_type=attachment&#38;&#8230;]]></description>
			<content:encoded><![CDATA[<p>Here&#8217;s the code:</p>
<pre>// [showfiles]
function dump_files($atts) {
        extract(shortcode_atts(array(), $atts));
        global $post;
        $return = '';
        $children = get_children( 'numberposts=-1&amp;orderby=menu_order&amp;order=ASC&amp;post_type=attachment&amp;post_parent='.$post-&gt;ID );
        if ($children) :
        $return .= '&lt;ul&gt;';
        foreach ($children as $child) {
        $return .= '&lt;li&gt;
            &lt;a href="'.$child-&gt;guid.'"&gt;'.$child-&gt;post_title.'&lt;/a&gt;';
            if ($child-&gt;post_content):
                $return .='&lt;br&gt;'.$child-&gt;post_content;
            endif;
            $return .='&lt;/li&gt;';
            } // endfor
        $return .='&lt;/ul&gt;';
        endif;
        return $return;
}
add_shortcode("showfiles", "dump_files");
// end shortcode</pre>
<p>This shortcode should go in your functions.php theme file. It is designed to pull in all post attachments, if any exist, and then print them out on the page in an unordered list. You can additionally specify mime types as a parameter in the get_children() function.</p>
<p>Use it in your theme by typing [showfiles] in your content.</p>
<img src="http://feeds.feedburner.com/~r/geekoutwithme/~4/Bd-uJfjeCSM" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://geekoutwith.me/2012/01/shortcode-to-show-all-files-attached-to-post-as-list-showfiles/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		<feedburner:origLink>http://geekoutwith.me/2012/01/shortcode-to-show-all-files-attached-to-post-as-list-showfiles/</feedburner:origLink></item>
		<item>
		<title>WordPress Function to change Background to Featured Image</title>
		<link>http://feedproxy.google.com/~r/geekoutwithme/~3/7HLxf2sXEJY/</link>
		<comments>http://geekoutwith.me/2011/09/wordpress-function-to-change-background-to-featured-image/#comments</comments>
		<pubDate>Fri, 23 Sep 2011 20:08:09 +0000</pubDate>
		<dc:creator>Joseph</dc:creator>
				<category><![CDATA[Snippets]]></category>
		<category><![CDATA[Web Dev]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://geekoutwith.me/?p=1419</guid>
		<description><![CDATA[I needed this functionality, and decided to create a function. Since it was so easily digestable, I figured I&#8217;d just post it here.
Here&#8217;s the function
function set_post_background() {
	global $post;
	$bgimage = wp_get_attachment_image_src( get_post_thumbnail_id( $post-&#62;ID&#8230;]]></description>
			<content:encoded><![CDATA[<p>I needed this functionality, and decided to create a function. Since it was so easily digestable, I figured I&#8217;d just post it here.</p>
<p>Here&#8217;s the function</p>
<pre>function set_post_background() {
	global $post;
	$bgimage = wp_get_attachment_image_src( get_post_thumbnail_id( $post-&gt;ID ), "Full");
	if (!empty($bgimage)) {
		return '&lt;style type="text/css"&gt;body {background-image: url('.$bgimage[0].');}&lt;/style&gt;';
	}
}</pre>
<p>Here&#8217;s what it does:</p>
<ol>
<li>The featured image source is pulled from the post data</li>
<li>If the featured image URL exists, the function prints a <code>style</code> tag that sets the body&#8217;s <code>background-image</code> to that url. If not, it doesn&#8217;t do anything.</li>
</ol>
<p>Call this function anywhere in your theme like so:</p>
<pre>&lt;?php echo set_post_background(); ?&gt;</pre>
<p>And that&#8217;s it.</p>
<h3>Futher Reading:</h3>
<ul>
<li><a href="http://codex.wordpress.org/Post_Thumbnails" target="_blank">WordPress Post Thumbnails</a></li>
<li><a href="http://codex.wordpress.org/Function_Reference/wp_get_attachment_image_src">Get Attachment Source</a></li>
</ul>
<img src="http://feeds.feedburner.com/~r/geekoutwithme/~4/7HLxf2sXEJY" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://geekoutwith.me/2011/09/wordpress-function-to-change-background-to-featured-image/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		<feedburner:origLink>http://geekoutwith.me/2011/09/wordpress-function-to-change-background-to-featured-image/</feedburner:origLink></item>
		<item>
		<title>Customize Password Protected Text Using Custom Fields [WordPress]</title>
		<link>http://feedproxy.google.com/~r/geekoutwithme/~3/-ke0mOGG0RE/</link>
		<comments>http://geekoutwith.me/2011/08/customize-password-protected-text-using-custom-fields-wordpress/#comments</comments>
		<pubDate>Fri, 12 Aug 2011 03:00:43 +0000</pubDate>
		<dc:creator>Joseph</dc:creator>
				<category><![CDATA[Tips]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://geekoutwith.me/?p=1411</guid>
		<description><![CDATA[I haven&#8217;t posted in a very long time, but as soon as I stumbled on this functionality I had to share it immediately, so here it is:
It is possible to add a filter function to add new text to the password protected page. The code to add to your functions.php files is as follows:
&#60;?php
add_filter( '&#8230;]]></description>
			<content:encoded><![CDATA[<p>I haven&#8217;t posted in a very long time, but as soon as I stumbled on this functionality I had to share it immediately, so here it is:</p>
<p>It is possible to add a filter function to add new text to the password protected page. The code to add to your functions.php files is as follows:</p>
<pre>&lt;?php
add_filter( 'the_password_form', 'custom_password_form' );
function custom_password_form() {
	global $post;
	$label = 'pwbox-'.( empty( $post-&gt;ID ) ? rand() : $post-&gt;ID );
	$o = '&lt;form action="' . get_option('siteurl') . '/wp-pass.php" method="post"&gt;
	' . __( "This post is password protected and this is what I want to say about that. To view it please enter your password below:" ) . '
	&lt;label for="' . $label . '"&gt;' . __( "Password:" ) . ' &lt;/label&gt;&lt;input name="post_password" id="' . $label . '" type="password" size="20" /&gt;&lt;input type="submit" name="Submit" value="' . esc_attr__( "Submit" ) . '" /&gt;
	&lt;/form&gt;
	';
	return $o;
}
?&gt;</pre>
<h3>But with just a tiny bit more coding&#8230;</h3>
<p>&#8230;and an if statement, you can add a check to see if a custom field exists, and if it does, to spit it out instead of using the default text. Added code is in <span style="background-color: #ffff99;">Yellow.</span></p>
<pre>add_filter( 'the_password_form', 'custom_password_form' );
function custom_password_form() {
	global $post;
	$label = 'pwbox-'.( empty( $post-&gt;ID ) ? rand() : $post-&gt;ID );
	$o = '&lt;form class="protected-post-form" action="' . get_option('siteurl') . '/wp-pass.php" method="post"&gt;<span style="background-color: #ffff99;">';</span>
<span style="background-color: #ffff99;"> if (get_post_meta($post-&gt;ID, 'password-prompt-text', true)) {</span>
<span style="background-color: #ffff99;"> $o .= get_post_meta($post-&gt;ID, 'password-prompt-text', true);</span>
<span style="background-color: #ffff99;"> } else {</span>
<span style="background-color: #ffff99;"> $o .='&lt;p&gt;'. __( "This post is password protected. To view it please enter your password below:" ).'&lt;/p&gt;';</span>
<span style="background-color: #ffff99;"> }</span>
	<span style="background-color: #ffff99;">$o .= '</span>&lt;label for="' . $label . '"&gt;' . __( "Password:" ) . ' &lt;/label&gt;&lt;input name="post_password" id="' . $label . '" type="password" size="20" /&gt;&lt;input type="submit" name="Submit" value="' . esc_attr__( "Submit" ) . '" /&gt;
	&lt;/form&gt;';
	return $o;
}</pre>
<p>The variable <code>$o</code> begins return a string. My if statement in yellow, interrupts the string with an if statement to see if the post has a custom field called <code>password-prompt-text</code>, and if it does, uses it instead of the text &#8220;This post is password protected&#8230;&#8221;.</p>
<p>Using this method, you can provide HTML into the description, so go crazy. I used <code>H2</code> for title, then a paragraph for description. The cool thing about this, is that because of the else: it degrades nicely if you don&#8217;t have the custom field added to the post.</p>
<p>Hope that helps somebody.</p>
<p><span style="font-size: small;">Credit to <a href="http://profiles.wordpress.org/mfields/">Michael Fields</a> for the original code, Googled and found <a href="http://wordpress.org/support/topic/how-do-i-change-password-protected-text">here</a>. Also mentioned at <a href="http://www.wordimpressed.com/wordpress/change-wordpress-default-password-protected-text/">WordImpressed</a>.</span></p>
<img src="http://feeds.feedburner.com/~r/geekoutwithme/~4/-ke0mOGG0RE" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://geekoutwith.me/2011/08/customize-password-protected-text-using-custom-fields-wordpress/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		<feedburner:origLink>http://geekoutwith.me/2011/08/customize-password-protected-text-using-custom-fields-wordpress/</feedburner:origLink></item>
		<item>
		<title>jQuery Resizer! – resize objects that are greater than a specified width</title>
		<link>http://feedproxy.google.com/~r/geekoutwithme/~3/7HwORuB_qoI/</link>
		<comments>http://geekoutwith.me/2011/02/jquery-resizer-resize-objects-that-are-greater-than-a-specified-width/#comments</comments>
		<pubDate>Wed, 09 Feb 2011 04:35:49 +0000</pubDate>
		<dc:creator>Joseph</dc:creator>
				<category><![CDATA[Adventures]]></category>
		<category><![CDATA[Geek Out Lab]]></category>
		<category><![CDATA[jQuery]]></category>
		<category><![CDATA[Tips]]></category>
		<category><![CDATA[Web Dev]]></category>

		<guid isPermaLink="false">http://geekoutwith.me/?p=1390</guid>
		<description><![CDATA[Today I launched the new design of Escape From Cubicle Nation, which I&#8217;m very proud to have worked on. Props to Brian Morykon for the design, Joseph Hinson for the code.
My last order of business in coding the site was that some of the Youtube videos and embeds had been inserted at a width of 640 pix&#8230;]]></description>
			<content:encoded><![CDATA[<p>Today I launched the new design of Escape From Cubicle Nation, which I&#8217;m very proud to have worked on. Props to Brian Morykon for the design, Joseph Hinson for the code.</p>
<p>My last order of business in coding the site was that some of the Youtube videos and embeds had been inserted at a width of 640 pixels, which was 90 pixels wider than the content area. With CSS, the options are really only to choose <code>overflow: hidden;</code>, which then only cuts off the content that is wider, instead of resizing it. So, I wrote a quick little script that some folks might find helpful. May I introduce <strong><em>jQuery resizer</em></strong>.</p>
<p>Here&#8217;s the actual function for my fellow geeks:</p>
<pre>function resizer( selectors, w ) {
 jQuery(selectors).each(function() {
 var owidth = jQuery(this).width(); var oheight = jQuery(this).height();
 if (owidth &gt; w) {
 var newH = (oheight * w / owidth);
 jQuery(this).attr({
 width: w,
 height: newH
 });
 }; // endif
 });
}</pre>
<p>Essentially the function loops through every selector you give it, checks it against the width you give it, and if it&#8217;s wider, it will recalculate the attributes of width and height based on their original values to scale the image down, it takes two attributes, the selector, and the width. The function can be called like so:</p>
<pre>resizer('.content iframe', 500);</pre>
<p>Additionally, you can give it a comma separated list of selectors, like so:</p>
<pre>resizer('.content iframe, .content embed, .content object, .content img', 500);</pre>
<p>So, the very straightforward, bottom line usage is as follows:</p>
<pre>&lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" charset="utf-8" src="appropriate-path/jq-resizer.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript"&gt;
jQuery(document).ready(function() {
 resizer('iframe, img', 550);
});
&lt;/script&gt;
</pre>
<p>You can see a <a href="http://geekoutwith.me/lab/resizer.html" target="_blank">quick demo</a> here.</p>
<h3 class="button"><a title="jQuery Resizer - Resize most html elements quickly and easily." href="http://geekoutwith.me/lab/files/jq-resizer.js.zip">Click to download the js file (in a zip).</a></h3>
<img src="http://feeds.feedburner.com/~r/geekoutwithme/~4/7HwORuB_qoI" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://geekoutwith.me/2011/02/jquery-resizer-resize-objects-that-are-greater-than-a-specified-width/feed/</wfw:commentRss>
		<slash:comments>8</slash:comments>
		<feedburner:origLink>http://geekoutwith.me/2011/02/jquery-resizer-resize-objects-that-are-greater-than-a-specified-width/</feedburner:origLink></item>
		<item>
		<title>A Bunch of New [old] Posts</title>
		<link>http://feedproxy.google.com/~r/geekoutwithme/~3/R7SIiIhK9-8/</link>
		<comments>http://geekoutwith.me/2011/02/a-bunch-of-new-old-posts/#comments</comments>
		<pubDate>Thu, 03 Feb 2011 03:36:12 +0000</pubDate>
		<dc:creator>Joseph</dc:creator>
				<category><![CDATA[site updates]]></category>

		<guid isPermaLink="false">http://geekoutwith.me/?p=1385</guid>
		<description><![CDATA[Tim wrote a series when I first started called &#8220;The 21 Days of WordPress Tips&#8221;, which I think there were something like 18 of&#8230;but I digress. We&#8217;ve been getting traffic on those posts for awhile, and he knew I was geeking out over here, so he told me to export them to this blog an&#8230;]]></description>
			<content:encoded><![CDATA[<p>Tim wrote a series when I first started called &#8220;The 21 Days of WordPress Tips&#8221;, which I think there were something like 18 of&#8230;but I digress. We&#8217;ve been getting traffic on those posts for awhile, and he knew I was geeking out over here, so he told me to export them to this blog and redirect the traffic. So, you can check out the posts (some really good tips) <a href="/category/21-days-of-wordpress-tips">by following this link</a>.</p>
<p>I&#8217;m also planning on getting my newsletter up and running that will have semi-regular monthly or bi-weekly emails with random tid-bits and tips I come across. Basically just things I want to share with anyone who cares. So you can expect to see that up here on the sidebar pretty soon.</p>
<img src="http://feeds.feedburner.com/~r/geekoutwithme/~4/R7SIiIhK9-8" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://geekoutwith.me/2011/02/a-bunch-of-new-old-posts/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		<feedburner:origLink>http://geekoutwith.me/2011/02/a-bunch-of-new-old-posts/</feedburner:origLink></item>
		<item>
		<title>What to do if a WordPress automatic upgrade fails</title>
		<link>http://feedproxy.google.com/~r/geekoutwithme/~3/BgoDC3F3Kbw/</link>
		<comments>http://geekoutwith.me/2011/01/what-to-do-if-wordpress-automatic-upgrade-fails/#comments</comments>
		<pubDate>Sun, 30 Jan 2011 02:54:58 +0000</pubDate>
		<dc:creator>Joseph</dc:creator>
				<category><![CDATA[Tips]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://geekoutwith.me/?p=1350</guid>
		<description><![CDATA[If you&#8217;ve ever been upgrading a WordPress installation and had it fail, leaving you in the dark depths of maintenance mode, you&#8217;ll agree with me that it can be quite a headache. Much like a site launch or a database move, it can take either 5 minutes, or 5 hours, but it never seems to fall in b&#8230;]]></description>
			<content:encoded><![CDATA[<p>If you&#8217;ve ever been upgrading a WordPress installation and had it fail, leaving you in the dark depths of maintenance mode, you&#8217;ll agree with me that it can be quite a headache. Much like a site launch or a database move, it can take either 5 minutes, or 5 hours, but it never seems to fall in between.</p>
<p>So if you start the WordPress upgrade and it gets locked up and leaves you hangin&#8217;, here&#8217;s what you do:</p>
<p><strong style="font-size:80;">Note: You should always backup your database and wp-content directory before beginning a WordPress update, even an automatic one. Also, you should ALWAYS rename a default theme like TwentyTen to a different name or it might get overwritten in an automatic update.<br />
</strong><br />
1) Download the latest version of WordPress from <a href="http://wordpress.org">WordPress.org</a></p>
<p>2) With an FTP program (FileZilla for Mac/PC, Cyberduck for Mac; I prefer Transmit, bit it ain&#8217;t free). Upload the entire WordPress install, except for the wp-content folder. This should overwrite all files in the WordPress Core. Unless you&#8217;ve messed with the core (which you shouldn&#8217;t have), this will not affect your files.</p>
<p>3) Remove the file called &#8220;.maintenance&#8221; from your site&#8217;s root directory (this is what is triggering the maintenance message).</p>
<p>4) Navigate to the appropriate wp-admin folder. WordPress will ask you to upgrade the database. Click the button and your back to where you were before, only now your upgraded.</p>
<p>I hope someone finds this helpful.</p>
<img src="http://feeds.feedburner.com/~r/geekoutwithme/~4/BgoDC3F3Kbw" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://geekoutwith.me/2011/01/what-to-do-if-wordpress-automatic-upgrade-fails/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		<feedburner:origLink>http://geekoutwith.me/2011/01/what-to-do-if-wordpress-automatic-upgrade-fails/</feedburner:origLink></item>
		<item>
		<title>Easy way to check for child pages (children) in WordPress</title>
		<link>http://feedproxy.google.com/~r/geekoutwithme/~3/pPSrIKCjscs/</link>
		<comments>http://geekoutwith.me/2010/12/easy-way-to-check-for-child-pages-children-in-wordpress/#comments</comments>
		<pubDate>Thu, 02 Dec 2010 04:06:56 +0000</pubDate>
		<dc:creator>Joseph</dc:creator>
				<category><![CDATA[Tips]]></category>
		<category><![CDATA[WordPress]]></category>
		<category><![CDATA[wordpress]]></category>

		<guid isPermaLink="false">http://geekoutwith.me/?p=1339</guid>
		<description><![CDATA[I was trying to create a sub-navigation menu that would only show if there were child pages in WordPress the other day, but to my knowledge, there is no has_children() or has_child() type of conditional available. I&#8217;m sure it&#8217;s because there are so many other ways to check for children.&#8230;]]></description>
			<content:encoded><![CDATA[<p>I was trying to create a sub-navigation menu that would only show if there were child pages in WordPress the other day, but to my knowledge, there is no <code>has_children()</code> or <code>has_child()</code> type of conditional available. I&#8217;m sure it&#8217;s because there are so many other ways to check for children. Still, it would be nice. But here&#8217;s how I did it, feel free to copy my code.</p>
<p>In any single.php template, use this code:</p>
<h3>Using <code>$post->ID</code></h3>
<pre>&lt;?php

$pages = get_posts('numberposts=-1&amp;orderby=menu_order&amp;order=ASC&amp;post_type=page&amp;post_status=publish&amp;post_parent='.$post-&gt;ID);

if (!empty($pages)) {

$has_children = true; // Page has children

} ?&gt;</pre>
<h3>Using <code>get_the_ID()</code></h3>
<pre>&lt;?php

$the_ID = get_the_ID();

$pages = get_posts('numberposts=-1&amp;orderby=menu_order&amp;order=ASC&amp;post_type=page&amp;post_status=publish&amp;post_parent='.$the_ID);
if (!empty($pages)) {
$has_children = true; // Page has children

} ?&gt;</pre>
<p>Now you&#8217;re even set to loop through your pages to create your sub-menu.</p>
<p>Hope someone finds that helpful</p>
<h3>Further Reading</h3>
<ul>
<li><a href="http://codex.wordpress.org/Template_Tags/get_posts">WordPress Template Tag: get_posts()</a></li>
</ul>
<img src="http://feeds.feedburner.com/~r/geekoutwithme/~4/pPSrIKCjscs" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://geekoutwith.me/2010/12/easy-way-to-check-for-child-pages-children-in-wordpress/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		<feedburner:origLink>http://geekoutwith.me/2010/12/easy-way-to-check-for-child-pages-children-in-wordpress/</feedburner:origLink></item>
		<item>
		<title>Make iframes load after page content (with jQuery)</title>
		<link>http://feedproxy.google.com/~r/geekoutwithme/~3/G6iAKWTIz4E/</link>
		<comments>http://geekoutwith.me/2010/10/make-iframes-load-after-page-content-with-jquery/#comments</comments>
		<pubDate>Fri, 15 Oct 2010 13:44:02 +0000</pubDate>
		<dc:creator>Joseph</dc:creator>
				<category><![CDATA[Adventures]]></category>
		<category><![CDATA[jQuery]]></category>
		<category><![CDATA[Web Dev]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://geekoutwith.me/?p=1330</guid>
		<description><![CDATA[In my work I create a lot of WordPress sites for my clients, and often times we&#8217;ll put the share links and social proof in the footer of each post. Some time ago, facebook introduced the like button for public use with iframes, which makes it very easy to incorporate just about anywhere, the only p&#8230;]]></description>
			<content:encoded><![CDATA[<p>In my work I create a lot of WordPress sites for my clients, and often times we&#8217;ll put the share links and social proof in the footer of each post. Some time ago, facebook introduced the like button for public use with iframes, which makes it very easy to incorporate just about anywhere, the only problem is that the iframes slow down the loading of the site, especially effecting things like javascript functionality, sometimes, it hangs on waiting for facebook, so instead of my content loading, I&#8217;m waiting on facebook:</p>
<p><img class="alignnone" title="Waiting on Facebook" src="http://geekoutwith.me/skitch/waiting_on_facebook-20101015-092219.png" alt="" width="187" height="19" /></p>
<p>I&#8217;ve been trying to come up with a solution for this. So I asked my friend <a href="http://viewchange.com">Brian Morykon</a> his thoughts. He suggested using spans instead of iframes, then when the dom was ready to replace the spans with iframes throughout, that way it would load after everything else. I tried it, and it worked. The only thing that is a little different here is that I am only using the <code>src</code> attribute from the spans, the other parameters I&#8217;m filling in on <code>.replaceWith()</code></p>
<h3>Facebook Like button (using span instead of iframe)</h3>
<pre>&lt;div class="facebooklike"&gt;
 &lt;span class="facelike" src="http://www.facebook.com/plugins/like.php?href=&lt;?php the_permalink(); ?&gt;&amp;amp;layout=button_count&amp;amp;show_faces=false&amp;amp;width=60px&amp;amp;action=like&amp;amp;colorscheme=light&amp;amp;height=21"&gt;&lt;/span&gt;
&lt;/div&gt;</pre>
<h3>jQuery function to find and replace spans with class &#8216;facelike&#8217;:</h3>
<pre>jQuery("span.facelike").each(function() {
 var url = jQuery(this).attr("src");
 jQuery(this).replaceWith('&lt;iframe src=' + url + ' scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:60pxpx; height:21px;" allowTransparency="true" /&gt;');
 });</pre>
<p><strong>Note:</strong></p>
<ol>
<li>The jQuery is replacing the span with class &#8216;facelike&#8217; with an iframe, with the attribute the same as the span. the other parameters (frameborder, style, scrolling) get passed from the jquery and not pulled out of each span (it&#8217;s much easier this way, plus you can change them all at once if you need to adjust).</li>
<li>This doesn&#8217;t have anything to do with jQuery, more with WordPress, but I&#8217;m using the_permalink() to pass the url to like, so you have to run this inside the loop.</li>
</ol>
<img src="http://feeds.feedburner.com/~r/geekoutwithme/~4/G6iAKWTIz4E" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://geekoutwith.me/2010/10/make-iframes-load-after-page-content-with-jquery/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		<feedburner:origLink>http://geekoutwith.me/2010/10/make-iframes-load-after-page-content-with-jquery/</feedburner:origLink></item>
		<item>
		<title>WP-Snippets.com – Great Resource</title>
		<link>http://feedproxy.google.com/~r/geekoutwithme/~3/eF7lUIBYCHk/</link>
		<comments>http://geekoutwith.me/2010/10/wp-snippets-com-great-resource/#comments</comments>
		<pubDate>Tue, 12 Oct 2010 00:55:11 +0000</pubDate>
		<dc:creator>Joseph</dc:creator>
				<category><![CDATA[Sites]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://geekoutwith.me/?p=1326</guid>
		<description><![CDATA[I write a lot of code snippets on this site, some stuff is found by searching for the solution to a specific problem, others are found by trying to do new things with WordPress. I was thinking of creating a site with code Snippets that could be downloaded by anyone who stumbled on the site, and submitted b&#8230;]]></description>
			<content:encoded><![CDATA[<p>I write a lot of code snippets on this site, some stuff is found by searching for the solution to a specific problem, others are found by trying to do new things with WordPress. I was thinking of creating a site with code Snippets that could be downloaded by anyone who stumbled on the site, and submitted by other users. I still like that idea, but I wanted to share a site I found that may be of use to you until I build (or don&#8217;t build) the one I have an idea for.</p>
<p><a href="http://wp-snippets.com">WordPress Snippets (http://wp-snippets.com)</a> is a really neat resource that has lots of little known WordPress snippets. They&#8217;re adding more every day, it&#8217;s very exciting for a geek like me, so I thought it would be exciting for other geeks too.</p>
<p>Almost all of the code snippets are best used in your functions.php file. <a href="http://wp-snippets.com">Go, have fun.</a></p>
<img src="http://feeds.feedburner.com/~r/geekoutwithme/~4/eF7lUIBYCHk" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://geekoutwith.me/2010/10/wp-snippets-com-great-resource/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		<feedburner:origLink>http://geekoutwith.me/2010/10/wp-snippets-com-great-resource/</feedburner:origLink></item>
		<item>
		<title>Quick demo of the CSS Extractor for WordPress Comments</title>
		<link>http://feedproxy.google.com/~r/geekoutwithme/~3/J1ezYgVrPJw/</link>
		<comments>http://geekoutwith.me/2010/10/quick-demo-of-the-css-extractor-for-wordpress-comments/#comments</comments>
		<pubDate>Tue, 05 Oct 2010 03:32:39 +0000</pubDate>
		<dc:creator>Joseph</dc:creator>
				<category><![CDATA[Geek Out Lab]]></category>
		<category><![CDATA[Tips]]></category>
		<category><![CDATA[Web Dev]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://geekoutwith.me/?p=1322</guid>
		<description><![CDATA[Below is a quick video that shows how the CSS Extractor tool can be used to quickly pull css classes from your site&#8217;s markup, specifically with the WordPress comments, that are generated dynamically.

]]></description>
			<content:encoded><![CDATA[<p>Below is a quick video that shows how the <a href="http://geekoutwith.me/lab/css-extractor/">CSS Extractor tool</a> can be used to quickly pull css classes from your site&#8217;s markup, specifically with the WordPress comments, that are generated dynamically.</p>
<p><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="568" height="380" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="allowFullScreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="src" value="http://www.youtube.com/v/lA3lJfXQ3g8?fs=1&amp;hl=en_US&amp;rel=0" /><param name="allowfullscreen" value="true" /><embed type="application/x-shockwave-flash" width="568" height="380" src="http://www.youtube.com/v/lA3lJfXQ3g8?fs=1&amp;hl=en_US&amp;rel=0" allowscriptaccess="always" allowfullscreen="true"></embed></object></p>
<img src="http://feeds.feedburner.com/~r/geekoutwithme/~4/J1ezYgVrPJw" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://geekoutwith.me/2010/10/quick-demo-of-the-css-extractor-for-wordpress-comments/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		<feedburner:origLink>http://geekoutwith.me/2010/10/quick-demo-of-the-css-extractor-for-wordpress-comments/</feedburner:origLink></item>
	</channel>
</rss>

