Как предотвратить скроллинг к началу поста после его сохранения

Как предотвратить скроллинг к началу поста после его сохранения | n-wp.ru

В WordPress имеется отличный встроенный редактор – один из самых лучших, которые есть в подобных системах. Однако, не смотря на всю его мощь, в нем есть несколько вещей, которые меня нервируют. Одной из таких вещей является скроллинг к началу поста после его сохранения.

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

Как предотвратить скроллинг к началу поста после его сохранения

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

if ( ! class_exists( 'WP' ) ) {
	die();
}

final class Preserve_Editor_Scroll_Position {

	public static function init() {
		add_filter( 'redirect_post_location', array( __CLASS__, 'add_query_arg' ) );
		add_action( 'edit_form_advanced', array( __CLASS__, 'add_input_field' ) );
		add_action( 'edit_page_form', array( __CLASS__, 'add_input_field' ) );
		add_filter( 'tiny_mce_before_init', array( __CLASS__, 'extend_tiny_mce' ) );
		add_action( 'after_wp_tiny_mce', array( __CLASS__, 'print_js' ) );
	}

	public static function add_input_field() {
		$position = ! empty( $_GET['scrollto'] ) ? $_GET['scrollto'] : 0;

		printf( '', esc_attr( $position ) );
	}


	public static function extend_tiny_mce( $init ) {
		if ( wp_default_editor() == 'tinymce' )
			$init['setup'] = 'rich_scroll';

		return $init;
	}


	public static function add_query_arg( $location ) {
		if( ! empty( $_POST['scrollto'] ) )
			$location = add_query_arg( 'scrollto', (int) $_POST['scrollto'], $location );

		return $location;
	}

	public static function print_js( $mce_settings ) {
		?>

( function( $ ) {
	$( '#post' ).submit( function() {
		scrollto =
			$('#content' ).is(':hidden') ?
			$('#content_ifr').contents().find( 'body' ).scrollTop() :
			$('#content' ).scrollTop();

		// Save scrollto value
		$( '#scrollto' ).val( scrollto );
	} );

	$( '#content' ).scrollTop( $( '#scrollto' ).val() );
} )( jQuery );


function rich_scroll( ed ) {
	ed.onInit.add( function() {
		jQuery( '#content_ifr' ).contents().find( 'body' ).scrollTop( jQuery( '#scrollto' ).val() );
	} );
};


		<?php
	}
}

add_action( 'admin_init', array( 'Preserve_Editor_Scroll_Position', 'init' ) );

После сохранения поста вы снова вернетесь на ту строчку, на которой остановились. Такой вот простой трюк здорово экономит время и нервы, делая работу с WordPress более комфортной.

Автор tiaurus 2182 Articles
Являюсь создателем n-wp.ru — блога о WordPress для новичков. Мне интересно многое, поэтому еще я сделал 123-box.ru — блог о программах для Windows, и tiaurus.info — блог о красоте.

2 Комментарии

  1. Спасибо!
    Такие мелочи очень облегчают работу.
    А если добавить еще эту строку

    $('#content' ).css('height','700px');

    Получим более удобный размер редактора.

    ( function( $ ) {
    	$('#content' ).css('height','700px');
    
        $( '#post' ).submit( function() {
            scrollto =
                $('#content' ).is(':hidden') ?
                $('#content_ifr').contents().find( 'body' ).scrollTop() :
                $('#content' ).scrollTop();
               
            // Save scrollto value
            $( '#scrollto' ).val( scrollto );
        } );
    
        $( '#content' ).scrollTop( $( '#scrollto' ).val() );
    }
  2. Спасибо автору за полезный совет!

    У меня возникла проблема с автоматическим скроллом к началу поста при использовании вкладок (табов). Вот, пример
    Как сделать чтобы страница оставалась стабильной при разворачивании содержимого вкладки?

    Заранее благодарю за ответ!

Оставить комментарий

Ваш электронный адрес не будет опубликован.


*