<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	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/"
	>

<channel>
	<title>Jared Atchison&#187; how to</title>
	<atom:link href="http://www.jaredatchison.com/category/wordpress/how-to/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.jaredatchison.com</link>
	<description>WordPress Consultant and Genesis Developer</description>
	<lastBuildDate>Fri, 27 Jan 2012 05:34:04 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Exclude categories from WordPress search results</title>
		<link>http://www.jaredatchison.com/2011/10/20/exclude-categories-from-wordpress-search-results/</link>
		<comments>http://www.jaredatchison.com/2011/10/20/exclude-categories-from-wordpress-search-results/#comments</comments>
		<pubDate>Thu, 20 Oct 2011 03:00:21 +0000</pubDate>
		<dc:creator>Jared</dc:creator>
				<category><![CDATA[how to]]></category>
		<category><![CDATA[snippet]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://www.jaredatchison.com/?p=859</guid>
		<description><![CDATA[Excluding a category (or categories) from the WordPress search results is easy peezy, however, that doesn&#8217;t stop most of the snippets I&#8217;ve found from doing it wrong.]]></description>
			<content:encoded><![CDATA[<p>Excluding a category (or categories) from the WordPress search results is easy peezy, <em>however,</em> that doesn&#8217;t stop most of the snippets I&#8217;ve found from doing it wrong.</p>
<div id="gist-1300302" class="gist">

        <div class="gist-file">
          <div class="gist-data gist-syntax">
              <div class="highlight"><pre><div class='line' id='LC1'><span class="cp">&lt;?php</span></div><div class='line' id='LC2'><br/></div><div class='line' id='LC3'><span class="nx">add_filter</span><span class="p">(</span> <span class="s1">&#39;pre_get_posts&#39;</span><span class="p">,</span> <span class="s1">&#39;ja_search_filter&#39;</span> <span class="p">);</span></div><div class='line' id='LC4'><span class="sd">/**</span></div><div class='line' id='LC5'><span class="sd"> * Exclude category 7 from search results.</span></div><div class='line' id='LC6'><span class="sd"> *</span></div><div class='line' id='LC7'><span class="sd"> * @since ?.?.?</span></div><div class='line' id='LC8'><span class="sd"> * @author Jared Atchison</span></div><div class='line' id='LC9'><span class="sd"> * @link https://gist.github.com/1300302</span></div><div class='line' id='LC10'><span class="sd"> *</span></div><div class='line' id='LC11'><span class="sd"> * @param WP_Query $query Existing query object</span></div><div class='line' id='LC12'><span class="sd"> * @return WP_Query Amended query object</span></div><div class='line' id='LC13'><span class="sd"> */</span></div><div class='line' id='LC14'><span class="k">function</span> <span class="nf">ja_search_filter</span><span class="p">(</span> <span class="nv">$query</span> <span class="p">)</span> <span class="p">{</span></div><div class='line' id='LC15'><br/></div><div class='line' id='LC16'>	<span class="k">if</span> <span class="p">(</span> <span class="nv">$query</span><span class="o">-&gt;</span><span class="na">is_search</span> <span class="o">&amp;&amp;</span> <span class="o">!</span><span class="nx">is_admin</span><span class="p">()</span> <span class="p">)</span></div><div class='line' id='LC17'>		<span class="nv">$query</span><span class="o">-&gt;</span><span class="na">set</span><span class="p">(</span> <span class="s1">&#39;cat&#39;</span><span class="p">,</span><span class="s1">&#39;-7&#39;</span> <span class="p">);</span></div><div class='line' id='LC18'><br/></div><div class='line' id='LC19'>	<span class="k">return</span> <span class="nv">$query</span><span class="p">;</span></div><div class='line' id='LC20'><br/></div><div class='line' id='LC21'><span class="p">}</span></div></pre></div>
          </div>

          <div class="gist-meta">
            <a href="https://gist.github.com/raw/1300302/6574d689381cc99ebbaeb0c934b903c07eca1674/gistfile1.aw" style="float:right;">view raw</a>
            <a href="https://gist.github.com/1300302#file_gistfile1.aw" style="float:right;margin-right:10px;color:#666">gistfile1.aw</a>
            <a href="https://gist.github.com/1300302">This Gist</a> brought to you by <a href="http://github.com">GitHub</a>.
          </div>
        </div>
</div>

]]></content:encoded>
			<wfw:commentRss>http://www.jaredatchison.com/2011/10/20/exclude-categories-from-wordpress-search-results/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Taking advantage of the template_include filter</title>
		<link>http://www.jaredatchison.com/2011/10/02/taking-advantage-of-the-template_include-filter/</link>
		<comments>http://www.jaredatchison.com/2011/10/02/taking-advantage-of-the-template_include-filter/#comments</comments>
		<pubDate>Sun, 02 Oct 2011 02:35:02 +0000</pubDate>
		<dc:creator>Jared</dc:creator>
				<category><![CDATA[how to]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://www.jaredatchison.com/?p=836</guid>
		<description><![CDATA[If you are like me, you often want to control what template file WordPress uses. Some of the methods I&#8217;ve seen around the internet try to use template_redirect. Others are even worse and employ sticking tons of conditionals inside WordPress template files (eg category.php). Well I am here to tell you there is a much easier way. [...]]]></description>
			<content:encoded><![CDATA[<p>If you are like me, you often want to control what template file WordPress uses. Some of the methods I&#8217;ve seen around the internet try to use <strong>template_redirect</strong>. Others are even worse and employ sticking tons of conditionals inside WordPress template files (eg category.php).</p>
<p>Well I am here to tell you there is a much easier way. It&#8217;s fairly unknown and sparsely documented. It&#8217;s the <strong>template_include</strong> filter.<span id="more-836"></span></p>
<p>The use cases for template_include are endless but I will give you a great example where I recently took advantage of it.</p>
<p>Let&#8217;s say you have a category structure like below:</p>
<ul>
<li>Audio</li>
<li>News</li>
<ul>
<li>Local</li>
<li>Health</li>
<li>Technology</li>
<li>Sports</li>
<li>Politics</li>
<li>Travel</li>
</ul>
<li>Videos</li>
</ul>
<p>Looks straight forward, right? Using the normal <a href="http://codex.wordpress.org/Template_Hierarchy">WordPress template hierarchy</a> you can easily target these categories. We all know <strong>category-news.php</strong> would be used when viewing the News category or <strong>category-health.php</strong> would take care of the Health category.</p>
<p>However, what if you want to create a unique template for all the News <em>sub-categories</em>? Here are the two options you will usually find.</p>
<ol>
<li>Create a category.php file and use conditionals to target the individual sub categories. Lame!</li>
<li>Create a template file for each sub-category (category-local.php, category-health.php, etc). Even more lame!</li>
</ol>
<p>I want to have <em>one</em> template file that will be used for all the News sub-categories, not conditionals or duplicate scattered everywhere. With single snippet (which would be in functions.php) using the template_include filter this can be done!</p>
<div id="gist-1256954" class="gist">

        <div class="gist-file">
          <div class="gist-data gist-syntax">
              <div class="highlight"><pre><div class='line' id='LC1'><span class="cp">&lt;?php</span></div><div class='line' id='LC2'><span class="nx">add_filter</span><span class="p">(</span> <span class="s1">&#39;template_include&#39;</span><span class="p">,</span> <span class="s1">&#39;ja_template_check&#39;</span> <span class="p">);</span></div><div class='line' id='LC3'><span class="k">function</span> <span class="nf">ja_template_check</span><span class="p">()</span> <span class="p">{</span></div><div class='line' id='LC4'>	<span class="k">global</span> <span class="nv">$template</span><span class="p">;</span></div><div class='line' id='LC5'><br/></div><div class='line' id='LC6'>	<span class="k">if</span> <span class="p">(</span> <span class="nx">is_category</span><span class="p">()</span> <span class="p">){</span></div><div class='line' id='LC7'><br/></div><div class='line' id='LC8'>		<span class="c1">// Get category information</span></div><div class='line' id='LC9'>		<span class="nv">$cat</span> <span class="o">=</span> <span class="nx">get_query_var</span><span class="p">(</span> <span class="s1">&#39;cat&#39;</span> <span class="p">);</span></div><div class='line' id='LC10'>		<span class="nv">$category_info</span> <span class="o">=</span> <span class="nx">get_category</span><span class="p">(</span> <span class="nv">$cat</span> <span class="p">);</span></div><div class='line' id='LC11'><br/></div><div class='line' id='LC12'>		<span class="c1">// News sub-categories, where 7 is the ID for News</span></div><div class='line' id='LC13'>		<span class="k">if</span> <span class="p">(</span> <span class="nv">$category_info</span><span class="o">-&gt;</span><span class="na">parent</span> <span class="o">==</span> <span class="mi">7</span> <span class="p">){</span></div><div class='line' id='LC14'>			<span class="nv">$template_file</span> <span class="o">=</span> <span class="nx">get_stylesheet_directory_uri</span><span class="p">()</span> <span class="o">.</span> <span class="s1">&#39;/subcategory-news.php&#39;</span><span class="p">;</span></div><div class='line' id='LC15'>			<span class="k">return</span> <span class="nv">$template_file</span><span class="p">;</span></div><div class='line' id='LC16'>		<span class="p">}</span></div><div class='line' id='LC17'>	<span class="p">}</span></div><div class='line' id='LC18'>	<span class="k">return</span> <span class="nv">$template</span><span class="p">;</span></div><div class='line' id='LC19'><br/></div><div class='line' id='LC20'><span class="p">}</span></div></pre></div>
          </div>

          <div class="gist-meta">
            <a href="https://gist.github.com/raw/1256954/191b6524fc628c5ffcce613bcb68156dd1a15fd4/gistfile1.aw" style="float:right;">view raw</a>
            <a href="https://gist.github.com/1256954#file_gistfile1.aw" style="float:right;margin-right:10px;color:#666">gistfile1.aw</a>
            <a href="https://gist.github.com/1256954">This Gist</a> brought to you by <a href="http://github.com">GitHub</a>.
          </div>
        </div>
</div>

<p>The code above first checks to see if you are looking at a category. If that is true it then checks to see if the parent category ID is 7. Finally, if this checks out it uses a template file I created,  subcategory-news.php.</p>
<p>Pretty easy, right?</p>
<p><em>Props to <a href="http://twitter.com/#!/wpmuguru">@wpmuguru</a> for sending me in this direction.</em></p>
]]></content:encoded>
			<wfw:commentRss>http://www.jaredatchison.com/2011/10/02/taking-advantage-of-the-template_include-filter/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>Fetch total custom post type count</title>
		<link>http://www.jaredatchison.com/2011/08/08/fetch-total-custom-post-type-count/</link>
		<comments>http://www.jaredatchison.com/2011/08/08/fetch-total-custom-post-type-count/#comments</comments>
		<pubDate>Mon, 08 Aug 2011 21:28:29 +0000</pubDate>
		<dc:creator>Jared</dc:creator>
				<category><![CDATA[how to]]></category>
		<category><![CDATA[snippet]]></category>
		<category><![CDATA[WordPress]]></category>
		<category><![CDATA[custom post types]]></category>

		<guid isPermaLink="false">http://www.jaredatchison.com/?p=750</guid>
		<description><![CDATA[I recently was working on my own Genesis CRM (similar&#160;to what Bill Erickson has released). Unlike the other CRMs out there I decided to create a custom post type for my contacts instead of doing a bunch of magic to use posts. In a few places throughout the app I needed to pull the total [...]]]></description>
			<content:encoded><![CDATA[<p>I recently was working on my own Genesis CRM (similar&nbsp;to what Bill Erickson <a href="http://www.billerickson.net/wordpress-genesis-crm/">has released</a>).</p>
<p>Unlike the other CRMs out there I decided to create a custom post type for my contacts instead of doing a bunch of magic to use posts. In a few places throughout the app I needed to pull the total number of contact entries in the database.</p>
<p>Turns out, it is <strong>very</strong> easy to do! Just a few lines of code, which you can see below. Make sure and change <em>contact</em> to the name of your post type.</p>
<pre class="brush: php; title: ; notranslate">
function ja_total_post_count() {
	global $wpdb;
	$numposts = $wpdb-&gt;get_var(&quot;SELECT COUNT(*) FROM $wpdb-&gt;posts WHERE post_type = 'contact'&quot;);
	if (0 &lt; $numposts) $numposts = number_format($numposts);
	return $numposts;
}
// To use...
echo 'Number of total contacts: ' . ja_total_post_count();
</pre>
]]></content:encoded>
			<wfw:commentRss>http://www.jaredatchison.com/2011/08/08/fetch-total-custom-post-type-count/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Removing menus in WordPress 3.1+</title>
		<link>http://www.jaredatchison.com/2011/02/01/removing-menus-in-wordpress-3-1/</link>
		<comments>http://www.jaredatchison.com/2011/02/01/removing-menus-in-wordpress-3-1/#comments</comments>
		<pubDate>Tue, 01 Feb 2011 22:20:47 +0000</pubDate>
		<dc:creator>Jared</dc:creator>
				<category><![CDATA[how to]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://www.jaredatchison.com/?p=524</guid>
		<description><![CDATA[Removing menus from the dashboard has always been a pain in the ass. It usually involved digging through $menu trying to find what you want to unset. Until now! Well, almost now. WordPress 3.1 has two new nifty functions: remove_admin_menus() and remove_submenu_page(). Removing menu items is now as easy as&#8230;]]></description>
			<content:encoded><![CDATA[<p>Removing menus from the dashboard has always been a pain in the ass. It usually involved digging through <code>$menu</code> trying to find what you want to unset.</p>
<p><strong>Until now</strong>! Well, almost now. WordPress 3.1 has two new nifty functions: <code>remove_admin_menus()</code> and <code>remove_submenu_page()</code>. Removing menu items is now as easy as&#8230;</p>
<pre class="brush: php; title: ; notranslate">
add_action('admin_menu', 'remove_admin_menus');
function remove_admin_menus(){
	remove_menu_page('edit.php'); // Posts
	remove_menu_page('upload.php'); // Media
	remove_menu_page('link-manager.php'); // Links
	remove_menu_page('edit-comments.php'); // Comments
	remove_menu_page('edit.php?post_type=page'); // Pages
	remove_menu_page('plugins.php'); // Plugins
	remove_menu_page('themes.php'); // Appearance
	remove_menu_page('users.php'); // Users
	remove_menu_page('tools.php'); // Tools
	remove_menu_page('options-general.php'); // Settings
}
</pre>
]]></content:encoded>
			<wfw:commentRss>http://www.jaredatchison.com/2011/02/01/removing-menus-in-wordpress-3-1/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Rotating banners in WordPress with jQuery</title>
		<link>http://www.jaredatchison.com/2009/11/12/rotating-banners-in-wordpress-with-jquery/</link>
		<comments>http://www.jaredatchison.com/2009/11/12/rotating-banners-in-wordpress-with-jquery/#comments</comments>
		<pubDate>Thu, 12 Nov 2009 18:39:44 +0000</pubDate>
		<dc:creator>Jared</dc:creator>
				<category><![CDATA[how to]]></category>
		<category><![CDATA[jQuery]]></category>
		<category><![CDATA[WordPress]]></category>
		<category><![CDATA[Banners]]></category>
		<category><![CDATA[jcarousel]]></category>

		<guid isPermaLink="false">http://www.jaredatchison.com/?p=104</guid>
		<description><![CDATA[Important Note: This post is quite dated as it is from 2009. Everything mentioned below will still work, however, since this post was written there have been several plugins released that are worth considering first. Make sure and check out the list below! WP-Cycle Genesis Slider (requires the Genesis Framework) jQuery Slider These are the [...]]]></description>
			<content:encoded><![CDATA[<div class="infoboxblue">
<h4>Important Note:</h4>
<p>This post is quite dated as it is from 2009. Everything mentioned below will still work, <em>however</em>, since this post was written there have been several plugins released that are worth considering first. Make sure and check out the list below!</h4>
<ul>
<li><a href="http://wordpress.org/extend/plugins/wp-cycle/">WP-Cycle</a></li>
<li><a href="http://wordpress.org/extend/plugins/genesis-slider/">Genesis Slider</a> (requires the <a href="/go/genesis/">Genesis Framework</a>)</li>
<li><a href="http://wordpress.org/extend/plugins/jquery-slider/">jQuery Slider</a></li>
</ul>
<p>These are the ones I recommend. If these do not fit the bill there are <a href="http://wordpress.org/extend/plugins/search.php/page/1?q=jquery+slider">tons to choose</a> from on WordPress.org
</div>
<p>Recently I had a project that needed to have a rotating banner on the main page. Most rotating banners out there are connected to feature posts or articles. <a href="http://woothemes.com">WooThemes</a> and some of <a href="http://mattbrett.com">Matt Brett&#8217;s</a> projects often use this method.</p>
<p>This wasn&#8217;t going to cut it for me. I needed to have rotating banners that were not associated to any posts, could link off site, be updated/maintained by the client, and preferably <em>not use any custom field voodoo</em>. The last thing I wanted to do was use a post category since it would be major over kill.</p>
<p>So I came up with a solution that fit all my requirements above and works great. Figured I would share what I did in case anyone else needs a similar solution.</p>
<p>The rotating banners were accomplished using:</p>
<ul>
<li>jQuery</li>
<li><a href="http://sorgalla.com/jcarousel/">jQuery Carousel plugin</a></li>
<li>WordPress Link Manger</li>
</ul>
<p>Let&#8217;s get started here.</p>
<h4>Step 1: setup a link category</h4>
<p>When you&#8217;re logged into the WP admin panel, click on <em>Links</em> on the left (under <em>Media</em>, above <em>Pages</em>). The <em>Links</em> section will expand and now we need to create a Link Category.</p>
<div id="attachment_105" class="wp-caption aligncenter" style="width: 610px"><a href="http://www.jaredatchison.com/wp-content/uploads/2009/11/add_link_cat.png" rel="shadowbox[sbpost-104];player=img;"><img class="size-large wp-image-105" src="http://www.jaredatchison.com/wp-content/uploads/2009/11/add_link_cat-600x409.png" alt="add_link_cat" width="600" height="409" /></a><p class="wp-caption-text">Add your Banner category</p></div>
<p>After you have added your Banner category (or whatever you decide to name it) you want to find the ID for that category. There are 2 ways you can do this. First, place you cursor over the category and look in browser status bar.</p>
<p><a href="http://www.jaredatchison.com/wp-content/uploads/2009/11/find_cat.jpg" rel="shadowbox[sbpost-104];player=img;"><img class="aligncenter size-large wp-image-106" src="http://www.jaredatchison.com/wp-content/uploads/2009/11/find_cat-600x418.jpg" alt="find_cat" width="600" height="418" /></a></p>
<p>The second option is to use Sivel&#8217;s <a href="http://wordpress.org/extend/plugins/simply-show-ids/">Simply Show IDs plugin </a>which will tell you the ID. Either way, just make sure you note what the ID is for your category since we will need it later.</p>
<h4>Step 2: add some banners</h4>
<p>Now we will add some links to the category. Click Add New under Links.</p>
<p><a href="http://www.jaredatchison.com/wp-content/uploads/2009/11/add_link.jpg" rel="shadowbox[sbpost-104];player=img;"><img class="aligncenter size-large wp-image-107" src="http://www.jaredatchison.com/wp-content/uploads/2009/11/add_link-528x600.jpg" alt="add_link" width="528" height="600" /></a></p>
<p>The name and description is for your reference and will not be shown or used. Make sure you place the link in the category you created. Lastly you will need to put the location of the image in the<em> Image Address</em> field. The easiest way is to upload your banners using the WordPress Media manager. If you go that route your image location will be something similar to http://yoursite.com/wp-contents/uploads/11/09/banner.jpg.</p>
<h4>Step 4: downloading&nbsp; and moving jQuery Carousel</h4>
<p>Now that we have the banner category created and some links/images in the category we need to get things setup behind the scenes.</p>
<p>First, download <a href="http://sorgalla.com/jcarousel/">jQuery Carousel</a>.</p>
<p>Secondly, unzip the files. You will see a bunch of files, most of which we won&#8217;t need.</p>
<p>Open up your theme folder (/wp-contents/themes/yourtheme/) and create a folder inside called <strong>js</strong>.</p>
<p>Now we need to move <strong>jquery.jcarousel.pack.js</strong> <em>or</em> jquery.jcarousel.js (look in the /libs/) to this folder. The path should be similar to <strong>/wp-contents/themes/yourtheme/js/jquery.jcarousel.pack.js</strong></p>
<p>Note: It is up to you which version of jCarousel you use. I prefer the packed version since it is smaller and we will not need to do any editing.</p>
<p>After the jCarousel javascript file has been moved we need to move over the CSS. Open jquery.jcarousel.css, copy the contents, and paste it into your theme&#8217;s style.css.</p>
<p>So to recap, you should have:<br />
/wp-contents/themes/yourtheme/js/jquery.jcarousel.pack.js<br />
/wp-contents/themes/yourtheme/style.css (should contain the CSS from jquery.jcarousel.css)</p>
<h4>Step 5: setting up jCarousel and jQuery</h4>
<p>Once you have added the necessary jCarousel CSS to your theme&#8217;s style.css you will need to edit it to meet the dimensions of your banner.</p>
<pre class="brush: css; title: ; notranslate">
/* @group jcarousel */

.jcarousel-banners {
 border: 1px solid #cfcfcf;
 margin:0 0 30px 0;
}

.jcarousel-container {
 position: relative;
}

.jcarousel-clip {
 z-index: 2;
 padding: 0;
 margin: 0;
 overflow: hidden;
 position: relative;
}

.jcarousel-list {
 z-index: 1;
 overflow: hidden;
 position: relative;
 top: 0;
 left: 0;
 margin: 0;
 padding: 0;
}

.jcarousel-list li,
.jcarousel-item {
 float: left;
 list-style: none;
 /* We set the width/height explicitly. No width/height causes infinite loops. */
 width: 578px;
 height: 130px;
}

/**
 * The buttons are added dynamically by jCarousel before
* the&lt;/pre&gt;
&lt;ul&gt;
&lt;ul&gt;list (inside the&lt;/ul&gt;
&lt;/ul&gt;
&lt;div&gt;described above) and
 * have the classnames &quot;jcarousel-next&quot; and &quot;jcarousel-prev&quot;.
 */
.jcarousel-next {
 display: none;
}
.jcarousel-prev {
 display: none;
}

.jcarousel-banners .jcarousel-list li,
.jcarousel-banners .jcarousel-item {
 position: relative;
 float: left;
 list-style: none;
 width: 578px;
 height: 130px;
}

.jcarousel-banners .jcarousel-container-horizontal {
 width: 578px;
}

.jcarousel-banners .jcarousel-clip-horizontal {
 width: 578px;
 height: 130px;
}

.jcarousel-banners .jcarousel-item {
 width: 578px;
 height: 130px;
}
</pre>
<p>Above is what the CSS looks like for my website. The size of the banners is 578x130px. Change this to the size of your banners. You might need to do some further tweaking later.</p>
<p>Now the CSS is done and jCarousel is in place we need to tell WordPress to use jQuery and jCarousel when it loads a page.</p>
<p>Open up <strong>functions.php</strong> inside your theme directory. You may have to create it if your theme does not have one. Now add this:</p>
<pre class="brush: php; title: ; notranslate">
if (!is_admin()) {
wp_enqueue_script('jquery');
wp_enqueue_script('jcarousel','/wp-content/themes/yourtheme/js/jquery.jcarousel.js',false,false);
}
</pre>
<p>WordPress includes many scripts out of the box, one of them being jQuery, so there is no need for us to download it. The code snippet tells WordPress &#8211; as long as we are not in the admin panel &#8211; to load jQuery and the jCarousel script.</p>
<h4>Step 6: finishing things up on the front end</h4>
<p>Your banners have been created, the files have been moved, and WordPress now knows to use jQuery and jCarousel when a page loads &#8211; almost done!</p>
<p>The last thing we need to do is add the code to grab the banners and make them work.</p>
<p>Open up&nbsp; <strong>index.php</strong> or <strong>home.php</strong> (the location you want to place your banners)&nbsp; in your theme directory and use this snippet:</p>
<pre class="brush: php; title: ; notranslate">&lt;/pre&gt;
&lt;div id=&quot;banners&quot;&gt;
&lt;ul&gt;
&lt;ul&gt;&lt;!--?php wp_list_bookmarks( 'categorize=0&amp;category=49&lt;&amp;title_li=&amp;before=
	&lt;li--&gt;&amp;after=&lt;/ul&gt;
&lt;/ul&gt;
&lt;ul&gt;&amp;show_images=1&amp;show_description=0' ); ?&gt;&lt;/ul&gt;
&lt;/div&gt;
&lt;pre&gt;
</pre>
<p>This snippet will grab links you created earlier and only show the images. Make sure you change category=49 to your category ID.</p>
<p>Lastly, open <strong>header.php</strong> in your theme directory. Place the code snippet below in between the &lt;head&gt; &lt;/head&gt; tags &#8211; usually right after you see wp_head();</p>
<pre class="brush: jscript; title: ; notranslate">
jQuery(document).ready(function($) {
$('#banners').jcarousel({
scroll: 1,
auto: 4,
wrap: 'last',
animation: 'slow',
buttonNextHTML: null,
buttonPrevHTML: null
});
});
</pre>
<p>The jQuery that comes with WordPress runs in non conflict mode, which is why do not use the typical document ready call. jCarousel is very configurable, so I suggest you check out all the <a href="http://sorgalla.com/projects/jcarousel/#Configuration">different options</a> and make sure your settings are set for the functionality you desire.</p>
<h3>Step 7: Profit.</h3>
<p><strong><em>That&#8217;s it!</em></strong> If you followed all the steps right you should have a rotating banner on your site.</p>
<p>I found this to be a better solution that any of the plugins I found. We didn&#8217;t have to do anything crazy, use posts, or write any plugins. Normally I would provide a demo of this in action but I have a feeling the client I did this for would rather not be mentioned.</p>
<p>If you have an questions or problems, feel free to leave a comment.</p>
<p>If you do expereince problems, a few things to double check/tweak:</p>
<ul>
<li>view your source to make sure WP is calling jQuery and jCarousel</li>
<li>check to make sure you have the correct category ID</li>
<li>modify the CSS if things don&#8217;t render correctly</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://www.jaredatchison.com/2009/11/12/rotating-banners-in-wordpress-with-jquery/feed/</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
	</channel>
</rss>

<!-- Performance optimized by W3 Total Cache. Learn more: http://www.w3-edge.com/wordpress-plugins/

Minified using disk: basic (Feed is rejected)
Page Caching using disk: enhanced

Served from: www.jaredatchison.com @ 2012-02-05 02:33:06 -->
