/ Адаптивность / Выбор города пользователя

Выбор города пользователя

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

Автоматически определяем и сохраняем город в SESSION

Автоматически определяем город (в основу которого легло решение от Яндекс).

// Первичное определение города
function determinecurrentcity() { 
	var localcity = ymaps.geolocation.city;

	if(localcity == null){ 
		jQuery("#city-ajax").text('unknown');
	} else {
		jQuery("#city-ajax").text(localcity);

		$.ajax({ // Отправка данных в session
			url: "/wp-admin/admin-ajax.php",
			method: 'post',
			data: {
				action: 'ajax_city',
				city: localcity,
			}
		});

		setTimeout(function () { $(".city-descript-block").load("/wp-content/themes/magazin-3.0/city-description.php"); }, 800);
	}
};

Должен быть подключен скрипт:

http://api-maps.yandex.ru/2.0-stable/?load=package.standard&lang=ru-RU

Чтобы первоначальный скрипт заработал нужно его инициализировать (условие: сессия user_city не существует):

function sitecities_action_script() {
	if ( !isset( $_SESSION['user_city'] ) ) {
		print '<script type="text/javascript">window.onload = function () { determinecurrentcity(); }</script>';
	}
}
add_action('body-before', 'sitecities_action_script');

body-before — пользовательский хук перед /body

Функция в которую ajax передают город и она записывает его в сессию (user_city).

// Запись города в SESSION
function ajax_city_send(){
    $city = $_REQUEST['city'];
	$_SESSION['user_city'] = $city;
}

add_action('wp_ajax_nopriv_ajax_city', 'ajax_city_send' );
add_action('wp_ajax_ajax_city', 'ajax_city_send' );

Чтобы работало также нужно включить сессии

// Включение / отключение записи сессий
add_action('init', 'start_session', 1);
function start_session() {
	if( !session_id() ) {
		session_start();
	}
}

add_action('wp_logout', 'end_session');
add_action('wp_login', 'end_session');
add_action('end_session_action', 'end_session');

function end_session() { session_destroy(); }

Верстка блока с выводом города:

<div id="site-city">
	<a href="#" title="Выбрать свой регион">
	<i class="fas fa-map-marker-alt"></i>
	
	<?php if ( isset( $_SESSION['user_city'] ) ) {
		echo '<p id="city-ajax">'.$_SESSION['user_city'].'</p>';
	} else {
		echo '<p id="city-ajax">Выбрать город..</p>';
	} ?>
	
	
	</a>
</div>

Где-то ниже на сайте создаем div с классом city-descript-block. В нем будет выводится общий SEO-текст в котором будет меняться город.

Ручной выбор города

Чтобы пользователь мог сам выбрать город, делаем кнопку с городом (#city-ajax) триггером для всплывающего окна.

Содержимое окна с выбором города:

<?php $cities = array ( // список городов для выбора
'Астрахань', 'Белгород', 'Брянск', 'Владикавказ', 'Владимир', 'Воронеж', 'Волгоград', 'Волгодонск', 'Казань', 'Краснодар', 'Махачкала', 'Москва', 'Нальчик',
'Нижний Новгород', 'Новороссийск', 'Оренбург', 'Пенза', 'Пятигорск', 'Ростов-на-Дону', 'Сальск', 'Самара', 'Саратов', 'Санкт-Петербург', 'Смоленск', 'Сочи', 
'Ставрополь', 'Тамбов', 'Тверь', 'Тула', 'Уральск', 'Уфа', 'Чебоксары'
); ?>

<div id="cities-list">

<?php if ( isset( $_SESSION['user_city'] ) ) {
	
	foreach($cities as $city):
		echo '<div';
		if ($_SESSION['user_city'] == $city) { echo ' class="current-city"'; }
		echo '>'.$city.'</div>';
	endforeach;
	
} else {
	
	foreach($cities as $city):
		echo '<div>'.$city.'</div>';
	endforeach;

} ?>
	
</div>

Скрипт изменения города (из вариантов)

jQuery(document).ready(function() { 

	$("body").on("click", "#cities-list > *", function () {	
		
		$('#cities-list > *').removeClass('current-city');
		$(this).addClass('current-city');
		
		var citychoice = $(this).text();
		
		jQuery("#city-ajax").text(citychoice);
		
		$.ajax({
			url: "/wp-admin/admin-ajax.php",
			method: 'post',
			data: {
				action: 'ajax_city',
				city: citychoice,
			}
		});
		
		setTimeout(function () { $(".city-descript-block").load("/wp-content/themes/magazin-3.0/city-description.php"); }, 800);

		//скрипты скрытия окна
	});

});

SEO-описание в зависимости от города

Ранее блок .city-descript-block будет обновляться на лету (по какому принципу описано здесь). Для этого создаем файл city-description.php (путь в скриптах должен быть прописан к нему). Содержимое файла:

<?php require_once("../../../wp-load.php"); ?>	
	
<?php if ( isset( $_SESSION['user_city'] ) ) {
	$value = $_SESSION['user_city']; ?>
	<div class="city-descript">
	О, <?php echo $value; ?>! Много написано книг о <?php echo citys_cases($value, 4); ?>, гордимся <?php echo citys_cases($value, 3); ?>. 
	Мы осуществляем прямые поставки товара в <?php echo citys_cases($value, 2); ?> и развозим их по <?php echo citys_cases($value, 1); ?>. 
	Также мы доставляем грузы из <?php echo citys_cases($value, 0); ?>.
<?php } ?>

В этом блоке не будут передаваться переменные страницы, например мета поля и прочее. Нужно доработать этот момент, т.к. это существенно расширит функциональность.

Пока это не доработано приходится подменять только город (без обновления ajax всего блока). Пример (блок в шаблоне товара woocommerce, как одну из переменных используем фокусное ключевое слово YoastSEO):

<div class="city-descript-block">
<?php $yoast_wpseo_focuskw = get_post_meta($post->ID, '_yoast_wpseo_focuskw', true);
if ( isset( $_SESSION['user_city'] ) ) {
	$value = $_SESSION['user_city']; ?>
	<div class="city-descript">
Компания предлагает широкий ассортимент продукции: наименования. 
<?php echo $yoast_wpseo_focuskw; ?> в наличии на складе в Ростове-на-Дону. Товары, предлагаемые компанией Вы можете купить с доставкой в город <span class="local-city"><?php echo $value; ?></span>.
</div>
<?php } ?>
</div>

Склонение города в разных падежах

Функция склонения города по падежам. Возможно не самое изящное решение, но на данный момент лучшего не придумал.

// Склонения городов
function citys_cases($city, $case){

$local_city = array('Вашего города','Вашему городу','Ваш город','Вашим городом','Вашем городе');

if ( $city == 'Ростов-на-Дону' ) 	{ $local_city = array('Ростова-на-Дону','Ростову-на-Дону','Ростов-на-Дону','Ростовом-на-Дону','Ростове-на-Дону'); }
if ( $city == 'Москва' ) 			{ $local_city = array('Москвы','Москве','Москву','Москвой','Москве'); }
if ( $city == 'Санкт-Петербург' ) 	{ $local_city = array('Санкт-Петербурга','Санкт-Петербургу','Санкт-Петербург','Санкт-Петербургом','Санкт-Петербурге'); }
if ( $city == 'Пенза' ) 			{ $local_city = array('Пензы','Пензе','Пензу','Пензой','Пензе'); }
if ( $city == 'Нижний Новгород' ) 	{ $local_city = array('Нижнего Новгорода','Нижнему Новгороду','Нижний Новгород','Нижним Новгородом','Нижнем Новгороде'); }

return $local_city[$case];

}

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

  • Похожие записи
  • Комментарии
  • Вложения
Загрузка JavaScript динамически

Загрузка JavaScript динамически

Иногда требуется подгрузить скрипт на лету, в этом поможет технология Ajax. Обычный скрипт JavaScript динамически Создаем файл скрипта script-dinamic.js с содержимым // случайное число от 1 до 100 var rnd Читать далее »

Json Начало

Json Начало

JSON (JavaScript Object Notation) — это текстовый протокол обмена данными, чем-то похожий на более привычный XML, но данные записываются в нем более компактно. Изначально он был разработан для нужд JavaScript Читать далее »

Фильтр по меткам (изменение основного запроса)

Фильтр по меткам (изменение основного запроса)

Реализуем фильтрацию записей по меткам путем изменения основного запроса на лету (ajax). Находим все теги записей входящих в категорию Данный код можно вставить в боковую колонку в виде виджета. <?php Читать далее »

/ /

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

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

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