Skip to content

Instantly share code, notes, and snippets.

@dcondrey
Created July 19, 2014 08:21
Show Gist options
  • Star 3 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save dcondrey/059dec0c5b01197c9f11 to your computer and use it in GitHub Desktop.
Save dcondrey/059dec0c5b01197c9f11 to your computer and use it in GitHub Desktop.
Modify Wordpress Post Formats and display them as a horizontal tab bar along the top of the post editor page.
<div class="post-editor-block" id="post-editor-audio-fields" style="display: none;">
<label for="post-editor-audio-embed"><?php _e('Audio URL (oEmbed) or Embed Code', 'post-format'); ?></label>
<textarea name="_format_audio_embed" id="post-editor-audio-embed" tabindex="1"><?php echo esc_textarea(get_post_meta($post->ID, '_format_audio_embed', true)); ?></textarea>
</div>
<div id="post-editor-quote-fields" style="display: none;">
<div class="post-editor-block">
<label for="post-editor-quote-source-name"><?php _e('Source Name', 'post-format'); ?></label>
<input type="text" name="_format_quote_source_name" value="<?php echo esc_attr(get_post_meta($post->ID, '_format_quote_source_name', true)); ?>" id="post-editor-quote-source-name" tabindex="1" />
</div>
<div class="post-editor-block">
<label for="post-editor-quote-source-url"><?php _e('Source URL', 'post-format'); ?></label>
<input type="text" name="_format_quote_source_url" value="<?php echo esc_attr(get_post_meta($post->ID, '_format_quote_source_url', true)); ?>" id="post-editor-quote-source-url" tabindex="1" />
</div>
</div>
<div class="post-editor-block" id="post-editor-code-fields" style="display: none;">
<label for="post-editor-gist-url"><?php _e('URL (enter the Gist share URL)', 'post-format'); ?></label>
<input type="url" name="_format_gist_url" value="<?php echo esc_attr(get_post_meta($post->ID, '_format_gist_url', true)); ?>" id="post-editor-gist-url" size="80" tabindex="1" />
<label for="post-editor-code-inline"><?php _e('Plain Text Code (Gist is recommended, for improved formatting and highlighting)', 'post-format'); ?></label>
<textarea name="_format_code_inline" id="post-editor-code-inline" tabindex="1"><?php echo esc_textarea(get_post_meta($post->ID, '_format_code_inline', true)); ?></textarea>
</div>
jQuery(function($) {
var CF = CF || {};
CF.postFormats = function($) {
return {
switchTab: function(clicked) {
var $this = $(clicked),
$tab = $this.closest('li');
if (!$this.hasClass('current')) {
$this.addClass('current');
$tab.siblings().find('a').removeClass('current');
this.switchWPFormat($this.attr('href'));
}
},
switchWPFormat: function(formatHash) {
$(formatHash).trigger('click');
switch (formatHash) {
case '#post-format-0':
case '#post-format-aside':
case '#post-format-chat':
CF.postFormats.standard();
break;
case '#post-format-status':
case '#post-format-link':
case '#post-format-image':
case '#post-format-gallery':
case '#post-format-video':
case '#post-format-quote':
case '#post-format-audio':
CF.postFormats[formatHash.replace('#post-format-', '')]();
}
$(document).trigger('post-formats-switch', formatHash);
},
standard: function() {
$('#post-editor-link-url, #post-editor-quote-fields, #post-editor-code-fields, #post-editor-audio-fields, #post-editor-gallery-preview').hide();
$('#titlewrap').show();
$('#postimagediv-placeholder').replaceWith($('#postimagediv'));
},
status: function() {
$('#titlewrap, #post-editor-link-url, #post-editor-quote-fields, #post-editor-code-fields, #post-editor-audio-fields, #post-editor-gallery-preview').hide();
$('#postimagediv-placeholder').replaceWith($('#postimagediv'));
$('#content:visible').focus();
},
link: function() {
$('#post-editor-quote-fields, #post-editor-code-fields, #post-editor-audio-fields, #post-editor-gallery-preview').hide();
$('#titlewrap, #post-editor-link-url').show();
$('#postimagediv-placeholder').replaceWith($('#postimagediv'));
},
image: function() {
$('#post-editor-link-url, #post-editor-quote-fields, #post-editor-code-fields, #post-editor-audio-fields, #post-editor-gallery-preview').hide();
$('#titlewrap').show();
$('#postimagediv').after('<div id="postimagediv-placeholder"></div>').insertAfter('#titlediv');
},
gallery: function() {
$('#post-editor-link-url, #post-editor-quote-fields, #post-editor-code-fields, #post-editor-audio-fields').hide();
$('#titlewrap, #post-editor-gallery-preview').show();
$('#postimagediv-placeholder').replaceWith($('#postimagediv'));
},
video: function() {
$('#post-editor-link-url, #post-editor-quote-fields, #post-editor-gallery-preview, #post-editor-audio-fields').hide();
$('#titlewrap, #post-editor-code-fields').show();
$('#postimagediv-placeholder').replaceWith($('#postimagediv'));
},
quote: function() {
$('#titlewrap, #post-editor-link-url, #post-editor-code-fields, #post-editor-audio-fields, #post-editor-gallery-preview').hide();
$('#post-editor-quote-fields').show().find(':input:first').focus();
$('#postimagediv-placeholder').replaceWith($('#postimagediv'));
},
audio: function() {
$('#post-editor-link-url, #post-editor-quote-fields, #post-editor-code-fields, #post-editor-gallery-preview').hide();
$('#titlewrap, #post-editor-audio-fields').show();
$('#postimagediv-placeholder').replaceWith($('#postimagediv'));
}
};
}(jQuery);
// move tabs in to place
$('#post-format-tabs').insertBefore($('form#post')).show();
$('#post-editor-link-url, #post-editor-code-fields, #post-editor-audio-fields').insertAfter($('#titlediv'));
$('#post-editor-gallery-preview').find('dt a').each(function() {
$(this).replaceWith($(this.childNodes)); // remove links
}).end().insertAfter($('#titlediv'));
$('#post-editor-quote-fields').insertAfter($('#titlediv'));
$(document).trigger('post-formats-init');
// tab switch
$('#post-format-tabs').find('a').live('click', function(e) {
CF.postFormats.switchTab(this);
e.stopPropagation();
e.preventDefault();
}).filter('.current').each(function() {
CF.postFormats.switchWPFormat($(this).attr('href'));
});
// WordPress 3.5 compatibility
// props: https://gist.github.com/4192094
var postId = $('#post_ID').val();
var gallery = wp.media.query({ uploadedTo: postId });
gallery.more();
gallery.on( 'add remove reset', function() {
var $preview = $('#post-editor-gallery-preview');
$preview.find('.post-editor-container').html('<p><img src="' + post_editor_format.wpspin_light + '" alt="' + post_editor_format.loading + '" /></p>');
$.post(
ajaxurl,
{
'action': 'post_editor_gallery_preview',
'id': $('#post_ID').val()
},
function(response) {
$preview.replaceWith(response.html);
$preview = $('#post-editor-gallery-preview');
$preview.find('dt a').each(function() {
$(this).replaceWith($(this.childNodes)); // remove links
}).end();
if ($('#post-format-tabs').find('a.current').attr('href').indexOf('#post-format-gallery') != -1) {
$preview.show();
}
},
'json'
);
}, gallery );
$('#post-editor-gallery-preview').find('.none a').live('click', function(e) {
$('#wp-content-media-buttons').find('.insert-media').mousedown().mouseup().click();
e.preventDefault();
});
});
<?php
function post_editor_admin_init() {
$post_formats = get_theme_support('post-formats');
if (!empty($post_formats[0]) && is_array($post_formats[0])) {
if (in_array('link', $post_formats[0])) {
add_action('save_post', 'post_editor_format_link_save_post');
}
if (in_array('status', $post_formats[0])) {
add_action('save_post', 'post_editor_format_status_save_post', 10, 2);
}
if (in_array('quote', $post_formats[0])) {
add_action('save_post', 'post_editor_format_quote_save_post', 10, 2);
}
if (in_array('video', $post_formats[0])) {
add_action('save_post', 'post_editor_format_video_save_post');
}
if (in_array('audio', $post_formats[0])) {
add_action('save_post', 'post_editor_format_audio_save_post');
}
}
}
add_action('admin_init', 'post_editor_admin_init');
function post_editor_add_meta_boxes($post_type) {
if (post_type_supports($post_type, 'post-formats') && current_theme_supports('post-formats')) {
wp_enqueue_script('post-formats', LITHO_JSINC .'post-formats.js', array('jquery'));
wp_enqueue_style('post-formats', LITHO_CSSINC . 'admin.css');
wp_localize_script(
'post-formats','post_editor_format',
array('loading' => __('Loading...', 'post-formats'),'wpspin_light' => LITHO_URL . ('/core/images/wpspin_light.gif')
)
);
add_action('edit_form_after_title', 'post_editor_post_admin_setup');
}
}
add_action('add_meta_boxes', 'post_editor_add_meta_boxes');
function post_editor_post_admin_setup() {
$post_formats = get_theme_support('post-formats');
if (!empty($post_formats[0]) && is_array($post_formats[0])) {
global $post;
$current_post_format = get_post_format($post->ID);
if (!empty($current_post_format) && !in_array($current_post_format, $post_formats[0])) {
array_push($post_formats[0], get_post_format_string($current_post_format));
}
array_unshift($post_formats[0], 'standard');
$post_formats = $post_formats[0];
include( 'formats/tabs.php' );
$format_views = array(
'link',
'video',
'gallery',
'audio',
);
foreach ($format_views as $format) {
if (in_array($format, $post_formats)) {
include('formats/format-'.$format.'.php');
}
}
}
}
function post_editor_format_link_save_post($post_id) {
if (!defined('XMLRPC_REQUEST') && isset($_POST['_format_link_url'])) {
update_post_meta($post_id, '_format_link_url', $_POST['_format_link_url']);
}
}
// action added in post_editor_admin_init()
function post_editor_format_auto_title_post($post_id, $post) {
// get out early if a title is already set
if (!empty($post->post_title)) {
return;
}
remove_action('save_post', 'post_editor_format_status_save_post', 10, 2);
remove_action('save_post', 'post_editor_format_quote_save_post', 10, 2);
$content = trim(strip_tags($post->post_content));
$title = substr($content, 0, 50);
if (strlen($content) > 50) {
$title .= '...';
}
$title = apply_filters('post_editor_format_auto_title', $title, $post);
wp_update_post(array(
'ID' => $post_id,
'post_title' => $title
));
add_action('save_post', 'post_editor_format_status_save_post', 10, 2);
add_action('save_post', 'post_editor_format_quote_save_post', 10, 2);
}
function post_editor_format_status_save_post($post_id, $post) {
if (has_post_format('status', $post)) {
post_editor_format_auto_title_post($post_id, $post);
}
}
// action added in post_editor_admin_init()
function post_editor_format_quote_save_post($post_id, $post) {
if (!defined('XMLRPC_REQUEST')) {
$keys = array(
'_format_quote_source_name',
'_format_quote_source_url',
);
foreach ($keys as $key) {
if (isset($_POST[$key])) {
update_post_meta($post_id, $key, $_POST[$key]);
}
}
}
if (has_post_format('quote', $post)) {
post_editor_format_auto_title_post($post_id, $post);
}
}
// action added in post_editor_admin_init()
function post_editor_format_video_save_post($post_id) {
if (!defined('XMLRPC_REQUEST') && isset($_POST['_format_code_inline'])) {
update_post_meta($post_id, '_format_code_inline', $_POST['_format_code_inline']);
}
if (!defined('XMLRPC_REQUEST') && isset($_POST['_format_gist_url'])) {
update_post_meta($post_id,'_format_gist_url', $_POST['_format_gist_url']);
}
}
// action added in post_editor_admin_init()
function post_editor_format_audio_save_post($post_id) {
if (!defined('XMLRPC_REQUEST') && isset($_POST['_format_audio_embed'])) {
update_post_meta($post_id, '_format_audio_embed', $_POST['_format_audio_embed']);
}
}
// action added in post_editor_admin_init()
function post_editor_gallery_preview() {
if (empty($_POST['id']) || !($post_id = intval($_POST['id']))) {
exit;
}
global $post;
$post->ID = $post_id;
ob_start();
include( 'formats/format-gallery.php' );
$html = ob_get_clean();
header('Content-type: text/javascript');
echo json_encode(compact('html'));
exit;
}
add_action('wp_ajax_post_editor_gallery_preview', 'post_editor_gallery_preview');
function post_editor_post_has_gallery($post_id = null) {
if (empty($post_id)) {
$post_id = get_the_ID();
}
$images = new WP_Query(array(
'post_parent' => $post_id,
'post_type' => 'attachment',
'post_status' => 'inherit',
'posts_per_page' => 1, // -1 to show all
'post_mime_type' => 'image%',
'orderby' => 'menu_order',
'order' => 'ASC'
));
return (bool) $images->post_count;
}
function post_editor_pre_ping_post_links($post_links, $pung, $post_id = null) {
// return if we don't get a post ID (pre WP 3.4)
if (empty($post_id)) {
return;
}
$url = get_post_meta($post_id, '_format_link_url', true);
if (!empty($url) && !in_array($url, $pung) && !in_array($url, $post_links)) {
$post_links[] = $url;
}
}
add_filter('pre_ping', 'post_editor_pre_ping_post_links', 10, 3);
// For integration with Social plugin (strips {title} from broadcast format on status posts)
function post_editor_social_broadcast_format($format, $post) {
if (get_post_format($post) == 'status') {
$format = trim(str_replace(array('{title}:','{title} -','{title}',),'',$format));
}
return $format;
}
add_filter('social_broadcast_format', 'post_editor_social_broadcast_format', 10, 2);
<div id="post-format-tabs" class="nav" style="display: none;">
<ul class="clearfix">
<?php
foreach ( $post_formats as $format ) {
$class = ( $format == $current_post_format || ( empty( $current_post_format ) && $format == 'standard' ) ?
'current' : '' );
if ( $format == 'standard' ) {
$format_string = __( 'Standard', 'post-format' );
$format_hash = 'post-format-0';
} else {
$format_string = get_post_format_string( $format );
$format_hash = 'post-format-' . $format;
}
if ( $format_string == 'Link' ) {
$format_string = 'External';
} elseif ( $format_string == 'Image' ) {
$format_string = 'Gallery';
} elseif ( $format_string == 'Video' ) {
$format_string = 'Code';
} elseif ( $format_string == 'Audio' ) {
$format_string = 'Horizontal';
} elseif ( $format_string == 'Chat' ) {
$format_string = 'Single';
}
echo '<li><a ' . ( ! empty( $class ) ? 'class="' . esc_attr( $class ) . '"' :
'' ) . ' href="#' . esc_attr( $format_hash ) . '">' . esc_html( $format_string ) . '</a></li>';
}
?>
</ul>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment