Приветственный экран / заглушка на сайт

Реализация привественного экрана, или заглушки на сайт на базе CMF MODX.

Сниппет welcome

Тут мы проверям — пользователь перешел к нам извне, или уже бал на сайте.

if(stripos($_SERVER['HTTP_REFERER'], MODX_HTTP_HOST) === false){
  return $modx->getChunk('welcome');
}

Чанк welcome

В общем-то может быть любой HTML.


<div class="welcome_wr">
  <div class="welcome_title">welcome title</div>
  <div class="welcome_subtitle">welcome subtitle</div>
  <div class="button_styled"><a href="javascript:void(0)" class="go_to_site">Войти на сайт</a></div>
</div>
<script>
  $(".go_to_site").click(function(){
    $(this).closest(".welcome_wr").remove();
  });
</script>

CSS

.welcome_wr{
  position: fixed;
  top:0;
  bottom:0;
  right: 0;
  left: 0;
  background-color: #fff;
  background-image: url('https://via.placeholder.com/150');
  background-position: 50% 0;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
	z-index: 999999;
	padding-top: 35vh;
	text-align: center;
	color: #fff;
}
.welcome_wr .welcome_title{
  font-size:80px;
}
.welcome_wr .welcome_subtitle{
  font-size:20px;
}
.welcome_wr ~ *{
  opacity: 0;
}

Комментарии (0)

  1. Напишите первый комментарий
*Комментарий будет опубликован после проверки модератором

[MODX] Генератор настроек MIGX

Документация на русском по MODX MIGX

[JS] Маска для ввода телефона +7(___)___-__-__

[MODX] Импорт и экспорт в MiniShop2. Реализация 1

jQuery.Maskedinput js - документация на русском с примерами

[MODX] Подсказки по работе и заготовки для MiniShop2

Как включить HTTPS (SSL) в MODX - Подробная инструкция

[MODx, miniShop2] Генерация YML для выгрузки в маркет

[MODX] Примеры работы с API

[OpenCart] Вывести на главную все категории с картинками

[MODX] Сайт на обслуживании (выключить сайт)

Расширение свойств товаров minishop2

[MODX, MIGX] Примеры использования

Пример перевода с помощью Yandex Translate API

Универсальная форма обратной связи — feedBackForm

[MODx, Gallery] Галерея. Вывести обложки альбомов и фотографии

[MODX, MiniShop2] Примеры выборки where, optionFilters, innerJoin

[Opencart] Вернуть английский язык, если вы его удалили

Отключить автозаполнение input

Настройка Webpack - несколько точек входа и разделение на чанки

[MODX] pThumb - ресайз изображений. Примеры использования.

[OpenCart] Вывести модуль напрямую через контроллер

[MODX, MIGX] Вывести getImageList только если он не пустой

[MODX, MIGX] Тип поля "Список ресурсов" (resourcelist) с ограничением по родителю (parents)

[MODX, Quip] Более рабочий вариант

Все записи

Наш сайт использует куки, нажмите «ОК» если вы не против
OK