Create a custom “Download” post type using WordPress

Download Custom Post Type in WordPress

This is page 2 of 3. For the first part please go to page 1

The jQuery for the upload button needed can either be added inline or in an external file. I’ve decided to add it inline (the final code has the external commented out, almost ready to use)

/**
 * Adds the script needed for the file upload
 */
function jayj_download_metabox_script() {

   $screen = get_current_screen(); 

   // Make sure we are on the Download screen
   if ( isset( $screen->post_type ) && $screen->post_type == 'jayj_download' ) : ?>

	<script type="text/javascript">
	jQuery(document).ready(function($){

	   var formfield;

	   // Open upload window
	   $('#upload-file-button').click(function() {
		formfield = $('#download-file').attr('name');
		tb_show( '','media-upload.php?type=image&TB_iframe=true' );
		return false;
	   });

	   // user inserts file into post. only run custom if user started process using the above process
	   // window.send_to_editor(html) is how wp would normally handle the received data
	   window.original_send_to_editor = window.send_to_editor;

	   window.send_to_editor = function(html) {
		if (formfield) {
		   // Get the src value from the image
		   fileurl = $('img', html).attr('src');

		   // The upload is not an image! Get the href instead
		   if( fileurl === undefined )
			fileurl = $(html).attr('href');

		   // Insert it into the text box and close
		   $('#download-file').val(fileurl);

		   tb_remove();
		} else {
		   window.original_send_to_editor(html);
		}
	   };
	});
        </script>

	<?php
	endif;
}

add_action( 'admin_footer', 'jayj_download_metabox_script' );

The whole metabox code together: Watch at Github or below

Once the new meta box has been added it looks like this

Create the archive

The download archive page can be found at example.com/downloads (we defined the slug earlier)

Based on your theme, the archive will properly be using the archive.php template file to display the downloads. But luckily WordPress first looks for the archive-{posttype}.php template, in our case archive-jayj_download.php

Create that in your current theme. The markup I use is based on the default theme, Twenty Eleven. You should change the markup to fit to your theme and style. So I recommend you copy the code from archive.php into your new file.

First, just before if ( have_posts() ) : add

/**
 * Customize the loop
 */
$args = array(
	'post_type' => 'jayj_download',
	// Show all downloads
	'posts_per_page' => -1,
	// Exclude hiding downloads
	'meta_key' => '_hide_download',
	'meta_value' => 1,
	'meta_compare' => '!=',
);

query_posts( $args );

This will replace the loop with our new one. Let me explain it

'post_type' => 'jayj_download'

First we make sure it’s in the download post type

'posts_per_page' => -1,

This will show all your downloads at the same. If you change it to 10, it will show 10

'meta_key' => '_hide_download',
'meta_value' => 1,
'meta_compare' => '!=',

This might look strange to you. What we do there is to only include downloads that don’t have 1 as value in the _hide_download because 1 means that the “Hide download” in our metabox is checked.


Go to the next page for the rest of the tutorial

By in WordPress | Published September 2, 2011

+5

Posts in this series

8 Responses to Create a custom “Download” post type using WordPress

  1. Marlon siger:

    Really usefull! Thanks for sharing.

  2. Rajat Agarwal siger:

    Hi,

    Can you please throw any light on adding a “pay to download” method in custom download post type? Or any recommendation of any plugin which can be used to achieve this?

    Thanks,
    Rajat.

  3. Pingback: Create a custom “Download” post type using WordPress - Part 2 | Jayj.dk

  4. Pingback: Hello Downloads! | "Download" Post Type

  5. Pingback: welikesport by dogriad38370 - Pearltrees

  6. Pingback: Part 2: Create a custom "Download" post type using WordPress

Leave a Reply