Пишем статью. Функции и хаки Volume#2

Сегодня продолжу цикл статей посвященный функциям, хакам и фильтрам WordPress. В первой части я рассмотрел, что можно сотворить с изображениями блога, а во второй части Вы узнаете о том как:

  • заменить стандартный placeholder заголовка «Введите заголовок» на свой текст,
  • установить максимальную длину заголовка,
  • устанавить редактор по умолчанию,
  • расширить окно полноэкранного редактора,
  • изменить шрифт HTML редактора,
  • добавить кнопки в HTML редактор,
  • разрешить использование в редакторе дополнительных HTML тегов,
  • отключить автоматическое сохранение записи
  • вывести произвольное поле.

Со временем, я надеюсь, список расширится, поехали.

Функции, хаки, фильтры при написании записи в WordPress

Заменяем «Введите заголовок» на свой текст

Практически бесполезный хак, но как и все остальные, может пригодиться (кстати мне пригодился для создания базы данных курсантов МВД). Добавьте его в файл functions.php:

function htm_title_text_input( $title ){
     return $title = 'Введите название статьи';
}
add_filter( 'enter_title_here', 'htm_title_text_input' );

Устанавливаем максимальную длину заголовка

Возможно, никогда не будете использовать, но все может быть. Данная функция указывает, какое максимальное количество слов может содержать заголовок поста Вашей записи. Приведенный код нужно вставить в файл functions.php Вашей темы, в 4 строке Вы можете увидить число 10, именно это число указывает на максимальное число, с этим числом и манипулируйте.

function htm_maxword($title){
	global $post;
	$title = $post->post_title;
	if (str_word_count($title) >= 10 )
	wp_die( __('Ой: У Вашего заголовка сильно длинное название!') );
}
add_action('publish_post', 'htm_maxword');

Устанавливаем редактор по умолчанию

Для написания статьи, WordPress, да и другие CMS, предлагают два редактора (визуальный и HTML), это очень удобно. Но я предпочитаю HTML редактор, у каждого свои причуды. И мне, по сути визуальный редактор ни к чему, и не нравиться тот момент, что когда я проверил внешний вид записи в визуальном редакторе, нажал добавить новую запись и я снова в визуальном редакторе.

Так вот, чтобы при редактировании или написании нового поста, пост отображался в HTML редакторе нужно добавить такой код в functions.php:

add_filter( 'wp_default_editor', create_function('', 'return "html";') );

Если же хотите чтобы пост открывался визуальным редактором, то предыдущий код следует удалить (если Вы его вставили), а вместо него вставить такой:

add_filter( 'wp_default_editor', create_function('', 'return "tinymce";') );

Расширяем окно полноэкранного редактора

Одним словом полезная функция. Я, например, пишу статьи для блога за 23 дюймовым монитором и полноэкранный редактор шириной в 640 пикселей выглядит узким. Поэтому я использую хак который расширяет окошко редактора до 1300 пикселей, вот таким простым образом:

add_action( 'after_setup_theme', 'htm_theme_setup' );
function htm_theme_setup() {
	set_user_setting( 'dfw_width', 1300 );
}

Изменяем шрифт HTML редактора

Еще одна функция из раздела «лично для себя», и Вам тоже пригодится, просто вставляем код в functions.php:

function htm_change_editor_font(){
	echo "<style type='text/css'>
		#wp-content-editor-container textarea#content {
			font-family: Arial, Helvetica;
			font-size: 16px;
			color: #333333;
		}
	</style>";
}
add_action('admin_print_styles', 'htm_change_editor_font');

можете задать свой любимый шрифт и его размер.

Добавляем кнопки в HTML редактор

Я уже писал выше,что предпочитаю HTML редактор, поэтому я его расширяю, добавляя нужные мне кнопочки. Например кнопки «Демо» и «Исходники» (читайте мою статью как сделать демонстрацию урока в WordPress), ковычки и так далее.

Макс, в комментариях, предлагал использовать плагин, но есть более простое решение, добавьте этот код в файл functions.php:

add_action('admin_footer', 'htm_eg_quicktags');
function htm_eg_quicktags(){
	?>
	<script type="text/javascript">
		jQuery(document).ready(function(){
			if(typeof(QTags) !== 'undefined'){
				QTags.addButton( 'demo-block', 'demo', '<div class="demo-block"><a href="#" target="_blank">Demo</a><a href="#" target="_blank">Source</a>', '</div>' );
				QTags.addButton( 'left-arrow', '&laquo;', '&laquo;');
				QTags.addButton( 'right-arrow', '&raquo;', '&raquo;');
			}
		});
	</script>
	<?php 
}

и пользуйтесь новыми кнопочками в HTML редакторе.

Разрешаем использование в редакторе дополнительных HTML тегов

По умолчанию, редактор WordPress не позволяет HTML теги, которые не совместимы со стандартом XHTML 1.0, меня эта неприятность постигла в одном из новых проектов. Я для стандартных табов вместо ссылок с якорем, использовал список с атрибутом name и при переключении редакторов атрибут терялся, что очень раздражало. И как обычно решение есть) нужно добавить вот такой код в файл functions.php:

function htm_change_mce_options($initArray) {
	$ext = 'li[name|class|style],div[name|id],iframe[align|longdesc|name|width|height|frameborder |scrolling|marginheight|marginwidth|src]';
	if ( isset( $initArray['extended_valid_elements'] ) ) {
		$initArray['extended_valid_elements'] .= ',' . $ext;
	} else {
		$initArray['extended_valid_elements'] = $ext;
	}
	return $initArray;
}
add_filter('tiny_mce_before_init', 'htm_change_mce_options');

в параметре $ext через запятую нужно указать HTML теги, а в ковычках [], атрибуты, которые нужно поддерживать.

Отключaем автоматическое сохранение записи

Думаю, из названия понятно, что будет делать этот код:

function htm_disable_autosave(){
	wp_deregister_script('autosave');
}
add_action( 'wp_print_scripts', 'htm_disable_autosave' );

Его нужно поместить в файл functions.php

Выводим произвольное поле

Врядли кто-то не знает как пользоваться произвольными полями WordPress, да и не хак это, но так, себе на память. Сначала нужно на странице публикации записи ввести имя произвольного поля, его значение, и нажать кнопку добавить.

А, чтобы отобразить на сайте нужно поместить приведенный ниже код в файл single.php или в category.php (index.php — где Вы выводите анонсы записей):

<?php echo get_post_meta($pos->ID, 'имя_произвольного_поля', true); ?>

Заключение

Пока все, но хаков, фильтров и функций на эту тему еще полным полно и продолжение по-любому будет! Если что-то у Вас не получилось, задавайте вопросы в комментариях.

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

Комментарии
  1. Alex:

    Блог просто супер! Побольше бы только статей, Владимир! Спасибо.

  2. seos:

    всем привет
    может кто знает как сделать фильтр по цене для wp
    mix max по произвольному полю price?

  3. денис:

    добрый день.
    хорошая статья мне не много помогло но честно говоря я искал не много другое а именно:как или посоветуйте сделать,чтобы шрифт был автоматически большим в посте без хтмл редактора.
    напишите на емаил

  4. JAH:

    Arkona, пробуй такой код добавить в functions.php

    function htm_change_editor_style(){
    	echo "<style type='text/css'>
    		#post-body-content {
    			width: 620px !important;
    		}
    	</style>";
    }
    add_action('admin_print_styles', 'htm_change_editor_style');

    620px — можешь менять это значение на свое усмотрение. Удачи)

  5. Большое спасибо за совет по изменению ширины поля редактора в полноэкранном режиме. Сработало сразу отлично. В моем случае у меня требуют узкий столбец контента, всего 620px. А окно визуального редактора TinyMCE Advanced 820px. Потому картинки и текст при редактировании у меня расползаются совершенно не соответственно сайту. В полноэкранном режиме ширину поля редактирования я сделал по вашему совету как на сайте. А как бы ограничить эту ширину в окне визуального редактора, потому как работать только в полноэкранном режиме не всегда удобно. Я думаю, такая проблема не только у меня. Если это возможно, подскажите.