How to make navigation with the go button on the VI?

Question

WordPress

Tell me how to make such a button with an input for entering the page number? It is necessary that when entering the page number, and then clicking on the button go ... redirect to the corresponding page of the page navigation of

the page such: domen.ru/page/2/ ,domen.ru/page/3/, domen.ru/page/4 /, etc.

Answer 1

Catch

<?php
/*
Plugin Name: My Custom Pagination
Description: Плагин кастомной пагинации.
Author: Александр Соболев
Author URI: https://александрсоболев.рф
*/


// Подключение CSS - если захотите поменять стиль кнопочки и инпута
function cp_css_includer() {
  wp_enqueue_style( 'cp_css_includer', plugin_dir_url( __FILE__ ). '/css/cp_style.css', false ); 
}
add_action( 'wp_head', 'cp_css_includer' );

// Подключение JS
function cp_js_includer(){
  wp_enqueue_script('jquery');
  wp_enqueue_script('cp_js_functions', plugin_dir_url( __FILE__ ). '/js/cp_functions.js');
  wp_localize_script( 'cp_js_functions', 'ajaxurl', admin_url( 'admin-ajax.php' ) );
}
add_action( 'wp_enqueue_scripts', 'cp_js_includer' );

// Создаем форму и шот-код
function cp_form(){
  return'<div class="cp"><form><input id="pc_input" type="text" placeholder="Куда пойдем ?"> <p id="pc_accept"></p></form></div>';
}
add_shortcode( 'cp_form', 'cp_form' );

?>

jQuery(document).ready(function() {
  jQuery("#pc_accept").on("click",function(){
    var _url_ =  jQuery('#pc_input').val();		
    var url = "http://domen.ru/page/"+ _url_; // <- Тут " поменять домен "
    window.location.href = url;
    
  });
});

.cp {background: #f0fff6;}
.cp input {
  width: 100%;
  height: 42px;
  padding-left: 10px;
  border: 2px solid #7BA7AB;
  border-radius: 2px;
  outline: none;
  background: #f0fff6;;
  color: black;
}
.cp p {
  position: absolute; 
  top: 0;
  right: 0px;
  width: 42px;
  height: 42px;
  border: none;
  background: #7BA7AB;
  border-radius: 0 5px 5px 0;
  cursor: pointer;
}
.cp p:before {
  padding-bottom: 4px;
  padding-left: 4px;
  content: "\f1b0";
  font-family: FontAwesome;
  font-size: 30px;
  color: white;
}

If you do it according to the instructions - everything will work) You can do the fitting "for yourself", I think.
Where necessary, execute the shortcode through or simply write [cp_form]

Answer 2

You can script in js. When clicked, read the value of the field and follow the link substituting the page

Answer 3

If we are talking directly about navigation, then you can use get_pagenum_link () and substitute the value of the field into it, again using JS.