Intereting Posts
Недостаточно прав для сохранения параметров Путаница в отношении того, как URL-адрес анализируется Оптимизировать вставку и удаление почты для массовых операций? URL-адреса изображений не перенаправляются должным образом Запрос на сообщения из любого типа сообщений, но только добавьте продукты instock Создание окна поиска слайдов в wordpress Список сообщений по категории для нулевой, не-NULL пользовательских значений поля? API настроек в Multisite – Отсутствует сообщение об обновлении Почему я не могу использовать переменную вне моей функции? Лучший фильтр для изменения пользовательских полей в сообщении? the_title () и the_permalink () не будут работать с вызовами AJAX Добавить% taxonomy% в пользовательской структуре постоянной ссылки Как я могу улучшить подход к таксономии? Как установить правило ширины и высоты для показанного изображения Как сделать / искать / без параметров не возвращать 404?

Изменить тему на основе размера окна

Я хочу отправить информацию обозревателя (ширину окна) на сервер через AJAX. Сервер не должен отвечать никакими данными, однако, только изменение темы основано на этой ширине окна.

Это моя попытка:

Javascript

var $ = jQuery; $(document).ready(function() { var windowWidth = $(window).width(); var windowHeight = $(window).height(); $.ajax( { type: "POST", url: ".../wp-admin/admin-ajax.php", data: { action: 'ajax_action', windowWidth: windowWidth, }, success: function(data, textStatus, XMLHttpRequest) { alert('success ' + data); // might not be useful. }, error: function(XMLHttpRequest, textStatus, errorThrown) { alert(errorThrown); } }); }); 

functions.php

 function mmf_enqueue_scripts() { if( !is_admin() ): wp_enqueue_script('winsize-detect'); endif; } add_action( 'wp_print_scripts', 'mmf_enqueue_scripts' ); function ajax_action() { if( isset( $_POST['windowWidth'] ) ) { return $_POST['windowWidth']; } return 0; } function mmf_change_theme($theme) { // to make AJAX run only before this function add_action('wp_ajax_ajax_action', 'ajax_action'); add_action('wp_ajax_nopriv_ajax_action', 'ajax_action'); $width = ajax_action(); if( $width == 320 ) { $theme = 'twentytwelve'; // if I echo the width here I get: 3203203203200 (if width=320) } else { $theme = 'twentythirteen'; // if I echo the width here I get: 7707707707700 (if width=770) } return $theme; } add_filter('template', 'mmf_change_theme'); add_filter('option_template', 'mmf_change_theme'); add_filter('option_stylesheet', 'mmf_change_theme'); 

Мне трудно справляться с тем, что функция mmf_change_theme подключена, поэтому она называется 3 раза. Или я неправильно анализирую.

Как бы вы это сделали? Или как исправить мой код. Также приветствуется обратная связь с таким методом для обслуживания различных тем, основанных на размере браузера окна.

Я предпочитаю не использовать плагин, который я знаю.

Благодарю.

Solutions Collecting From Web of "Изменить тему на основе размера окна"

Ваш код действительно работает для меня, и он меняет тему в соответствии с текущей шириной.

Но я думаю, вам нужно немного подстроить что-то вроде ниже:

Для вашего javascript:

 var $ = jQuery; $(document).ready(function() { var windowWidth = $(window).width(); var windowHeight = $(window).height(); $.ajax( { type: "POST", url: "http://example.com/wp-admin/admin-ajax.php", // Must use absolute url data: { action: 'ajax_action', windowWidth: windowWidth, }, success: function(data, textStatus, XMLHttpRequest) { alert('success ' + data); // might not be useful. }, error: function(XMLHttpRequest, textStatus, errorThrown) { alert(errorThrown); } }); }); 

Используйте абсолютный URL-адрес, иногда он не найдет файл admin-ajax.php из-за неправильного относительного URL admin-ajax.php .

Для functions.php

 function mmf_enqueue_scripts() { if( !is_admin() ): wp_enqueue_script('winsize-detect'); endif; } add_action( 'wp_enqueue_scripts', 'mmf_enqueue_scripts' ); // Use `wp_enqueue_scripts` instead of `wp_print_scripts` function ajax_action() { if( isset( $_POST['windowWidth'] ) ) { return $_POST['windowWidth']; } return 0; } function mmf_change_theme($theme) { // to make AJAX run only before this function add_action('wp_ajax_ajax_action', 'ajax_action'); add_action('wp_ajax_nopriv_ajax_action', 'ajax_action'); $width = ajax_action(); //use '<=' // This might be your mistake, it worked for me. if( $width <= 320 ) { $theme = 'twentytwelve'; // if I echo the width here I get: 3203203203200 (if width=320) } else { $theme = 'twentyteleven'; // if I echo the width here I get: 7707707707700 (if width=770) } return $theme; } add_filter('template', 'mmf_change_theme'); add_filter('option_template', 'mmf_change_theme'); add_filter('option_stylesheet', 'mmf_change_theme'); 

Не используйте wp_print_scripts потому что это не рекомендуется. wp_enqueue_scripts этого используйте wp_enqueue_scripts .

Убедитесь, что вы не равны ему для определенной ширины, попробуйте меньше или равно <= .

После изменения == this на <= this. Работал со мной.