/ Wordpress / Поле загрузчик файла word

Поле загрузчик файла word

08.09.2021

321

Описываем создание поля для загрузки файлов word.

// Загрузка файла

function true_include_myuploadscript() {
	if ( ! did_action( 'wp_enqueue_media' ) ) {
		wp_enqueue_media();
	}
	// меняем admin.js на название созданного скрипта
	wp_enqueue_script( 'myuploadscript', get_stylesheet_directory_uri() . '/js/upload-media-custom.js', array('jquery'), null, false );
}

add_action( 'admin_enqueue_scripts', 'true_include_myuploadscript' );

/* PHP-функция добавления полей в форму */
function true_word_uploader_field( $name, $value = '', $w = 100, $h = 99) {
	
	global $post;
	$uploader_word = get_post_meta($post->ID, 'uploader_word', true);
	if ($uploader_word) { $title = get_the_title($uploader_word); }
	
	$default = get_stylesheet_directory_uri() . '/images/word-icon-empty.png';
	if( $value ) {
		$image_attributes = wp_get_attachment_image_src( $value, array($w, $h) );
		//$src = $image_attributes[0];
		$src = get_stylesheet_directory_uri() . '/images/word-icon.png';
	} else {
		$src = $default;
	}
	echo '
	<div>
	<img data-src="' . $default . '" src="' . $src . '" width="' . $w . 'px" height="' . $h . 'px" title="'. $title .'" />
	<div>
	<input type="hidden" name="extra[uploader_word]" id="' . $name . '" value="' . $value . '" />
	<button type="submit" class="upload_word_button button">Загрузить</button>
	<button type="submit" class="remove_word_button button">×</button>
	</div>
	</div>
	';
}

// Использование в метабоксах
function true_meta_boxes_u() {
	add_meta_box('truediv', 'Настройки', 'true_print_box_u', 'post', 'side', 'high');
}
add_action( 'admin_menu', 'true_meta_boxes_u' );

function true_print_box_u($post) {
	if( function_exists( 'true_word_uploader_field' ) ) {
		true_word_uploader_field( 'uploader_word', get_post_meta($post->ID, 'uploader_word',true) );
	}
}

Скрипт по обновлению иконки (upload-media-custom.js)

jQuery(function($){
	//действие при нажатии на кнопку загрузки изображения
	//вы также можете привязать это действие к клику по самому изображению
	$('.upload_word_button').click(function(){
		var send_attachment_bkp = wp.media.editor.send.attachment;
		var button = $(this);
		wp.media.editor.send.attachment = function(props, attachment) {
			//$(button).parent().prev().attr('src', attachment.url);
			$(button).parent().prev().attr('src', '/wp-content/themes/meisterwerk-2/images/word-icon.png');
			$(button).parent().prev().attr('title', attachment.title);
			$(button).prev().val(attachment.id);
			wp.media.editor.send.attachment = send_attachment_bkp;
		}
		wp.media.editor.open(button);
		return false;    
	});
	
	// удаляем значение произвольного поля
	// если быть точным, то мы просто удаляем value у input type="hidden"
	$('.remove_word_button').click(function(){
		var r = confirm("Уверены?");
		if (r == true) {
			var src = $(this).parent().prev().attr('data-src');
			$(this).parent().prev().attr('src', src);
			$(this).parent().prev().removeAttr('title');
			$(this).prev().prev().val('');
		}
		return false;
	});
});

Иконки с двумя состояниями загруженности файлов

При загруженном файле иконка word будет меняться. Файлы иконок должны быть загружены в папку темы images. Нужно в скрипте поменять актуальный путь к иконке.

Поделиться в соц. сетях:

  • Комментарии
  • Вложения

Добавить комментарий

Пока нет комментариев. Будь первым!

Поле загрузчик файла word Поле загрузчик файла word Поле загрузчик файла word
Версия сайта для печати
Рекомендации для васВерсия сайта для печатиOpttour.ru
Спасибо! Наш менеджер свяжется с Вами в течении 5 минут.