Joywork/sajt-iz-crm.php
2026-05-22 21:21:54 +03:00

1075 lines
54 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<?php
require_once($_SERVER['DOCUMENT_ROOT'] . "/config.php");
$get = clearInputData($_GET);
if ($_GET['ok_auth']) {
$user = new User;
$msg = $user->auth($get);
}
if ($get['msg'])
$msg = $get['msg'];
if ($_POST['ok_auth2']) {
$post = clearInputData($_POST);
$user = new User;
$msg2 = $user->check_sms($post);
}
if ($_POST['ok_auth3']) {
$post = clearInputData($_POST);
$user = new User;
$msg2 = $user->check_sms($post, 1);
}
if ($_POST['ok_user']) {
$post = clearInputData($_POST);
$user = new User;
$msg_user = $user->reg($post);
}
require_once($_SERVER['DOCUMENT_ROOT'] . "/promo/templates/new-header.php");
?>
<!-- ═══════ Schema.org JSON-LD (связь JoyWork ↔ Domio) ═══════ -->
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "SoftwareApplication",
"name": "Domio — конструктор сайтов для агентств недвижимости",
"operatingSystem": "Web",
"applicationCategory": "BusinessApplication",
"url": "https://www.mydomio.ru/?utm_source=joywork&utm_medium=cross-link&utm_campaign=joywork-domio-landing",
"description": "Готовый сайт-витрина для агентства недвижимости с интеграцией CRM JoyWork. Объекты, фильтры, карта, ипотечный калькулятор.",
"offers": {
"@type": "Offer",
"priceCurrency": "RUB",
"price": "0",
"description": "Бесплатный пробный период, затем по подписке"
},
"isRelatedTo": {
"@type": "SoftwareApplication",
"name": "JoyWork — CRM для агентств недвижимости",
"url": "https://joywork.ru"
}
}
</script>
<!-- ═══════ Schema.org JSON-LD (FAQ rich snippets) ═══════ -->
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "FAQPage",
"mainEntity": [
{
"@type": "Question",
"name": "Нужен ли разработчик чтобы запустить сайт?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Нет. Регистрация занимает 5 минут — получаете готовый сайт на поддомене (например, ваше-агентство.mydomio.ru). Дальше через визуальную админ-панель меняете логотип, цвета, контакты, добавляете объекты. Никакого программирования."
}
},
{
"@type": "Question",
"name": "Можно ли подключить свой домен?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Да. В настройках вводите свой домен (например, ваш-агентство.ru), добавляете CNAME-запись у регистратора, нажимаете «Проверить DNS» — SSL-сертификат выпускается автоматически."
}
},
{
"@type": "Question",
"name": "Что если у меня уже есть база объектов в CRM JoyWork?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Все объекты из JoyWork автоматически появятся на сайте — настраивать ничего не нужно, интеграция работает «из коробки». Обновили объект в CRM — обновился на сайте."
}
},
{
"@type": "Question",
"name": "Куда приходят заявки с сайта?",
"acceptedAnswer": {
"@type": "Answer",
"text": "В воронку CRM JoyWork с указанием источника (Карточка объекта, Главная и т.п.), а также в Telegram или MAX — если подключите уведомления."
}
},
{
"@type": "Question",
"name": "Сколько стоит для клиентов JoyWork?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Для действующих клиентов JoyWork действуют специальные тарифы со скидкой. Точную стоимость и условия уточняйте на странице тарифов на mydomio.ru или у менеджера JoyWork."
}
}
]
}
</script>
<!-- ═══════ СТИЛИ ═══════ -->
<style>
/* ═══════════════════════════════════════════════════════════════
СТИЛИ ВСТРОЕНЫ INLINE для портативности — страница не зависит
от внешних CSS-файлов. Все классы имеют префикс .dm- чтобы не
конфликтовать с существующими стилями JoyWork.
═══════════════════════════════════════════════════════════════ */
.dm-page {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
color: #1a1a1a;
line-height: 1.6;
background: #fff;
scroll-behavior: smooth; /* плавная прокрутка к якорям (видео/FAQ) */
}
.dm-page *, .dm-page *::before, .dm-page *::after { box-sizing: border-box; }
/* ── Брендинг JoyWork: Joy чёрным, Work зелёным ────────────── */
.dm-jw-w { color: #4CAF50; font-weight: inherit; }
.dm-container { max-width: 1180px; margin: 0 auto; padding: 0 24px; }
/* ── Hero ──────────────────────────────────────────────────── */
.dm-hero {
/* padding-top увеличен с 70 до 130px: шапка JoyWork position:fixed
высотой ~69px — нужен запас, чтобы контент hero не упирался в неё. */
padding: 130px 0 80px;
background: linear-gradient(180deg, #f0fdf4 0%, #fff 100%);
position: relative;
overflow: hidden;
}
.dm-hero::before {
content: '';
position: absolute;
top: -100px; right: -100px;
width: 400px; height: 400px;
background: rgba(76, 175, 80, 0.08);
border-radius: 50%;
filter: blur(80px);
}
.dm-hero-grid {
position: relative;
display: grid;
grid-template-columns: 1.05fr 0.95fr;
gap: 56px;
align-items: center;
}
.dm-hero-text { max-width: 560px; }
@media (max-width: 960px) {
.dm-hero-grid { grid-template-columns: 1fr; gap: 40px; text-align: center; }
.dm-hero-text { max-width: 100%; margin: 0 auto; }
.dm-hero-cta-row { justify-content: center; }
.dm-hero-meta { text-align: center; }
}
/* ── Hero визуал: каскад из 3 скриншотов ─────────────────────
При hover на блок все три мокапа «раздвигаются» — становятся
видны полностью. Эффект работает на десктопе, на тач-устройствах
через CSS :hover он не сработает, поэтому ниже мобильные стили
показывают скрины в более компактном виде без overlap. */
.dm-hero-visual {
position: relative;
height: 460px;
}
.dm-mockup {
position: absolute;
border-radius: 12px;
overflow: hidden;
box-shadow: 0 16px 44px rgba(15, 23, 42, 0.20),
0 4px 12px rgba(15, 23, 42, 0.06);
border: 1px solid rgba(15, 23, 42, 0.08);
background: #fff;
transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1),
box-shadow 0.3s ease;
}
.dm-mockup img { width: 100%; height: auto; display: block; }
/* Mockup 1: home-hero — сзади-слева, чуть наклонён против часовой */
.dm-mockup-1 {
top: 0; left: 0;
width: 72%;
transform: rotate(-3deg);
z-index: 1;
}
/* Mockup 2: catalog-grid — посередине, с browser bar */
.dm-mockup-2 {
top: 28%; left: 20%;
width: 72%;
transform: rotate(2deg);
z-index: 2;
}
/* Mockup 3: мобильный — спереди-справа, тёмная рамка как iPhone */
.dm-mockup-mobile {
position: absolute;
right: 0; bottom: 0;
width: 32%;
max-width: 150px;
border-radius: 18px;
overflow: hidden;
box-shadow: 0 16px 40px rgba(15, 23, 42, 0.30);
border: 3px solid #1a1a1a;
background: #1a1a1a;
z-index: 3;
transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.dm-mockup-mobile img { width: 100%; height: auto; display: block; }
/* HOVER: мокапы разъезжаются */
.dm-hero-visual:hover .dm-mockup-1 {
transform: rotate(-6deg) translate(-30px, -20px);
box-shadow: 0 24px 60px rgba(15, 23, 42, 0.26);
}
.dm-hero-visual:hover .dm-mockup-2 {
transform: rotate(0deg) translate(0, 30px);
box-shadow: 0 24px 60px rgba(15, 23, 42, 0.26);
}
.dm-hero-visual:hover .dm-mockup-mobile {
transform: translate(30px, 20px);
}
/* Browser bar — оставляем только на mockup 2 (catalog) */
.dm-mockup-bar {
display: flex; align-items: center; gap: 6px;
background: #f1f3f5;
padding: 8px 12px;
border-bottom: 1px solid #e5e7eb;
}
.dm-mockup-bar span {
width: 9px; height: 9px; border-radius: 50%; background: #d1d5db;
flex-shrink: 0;
}
.dm-mockup-bar span:nth-child(1) { background: #ef4444; }
.dm-mockup-bar span:nth-child(2) { background: #f59e0b; }
.dm-mockup-bar span:nth-child(3) { background: #10b981; }
.dm-mockup-bar .dm-mockup-url {
flex: 1;
margin-left: 10px;
font-size: 11px;
font-family: ui-monospace, SFMono-Regular, monospace;
color: #6b7280;
background: #fff;
padding: 3px 10px;
border-radius: 5px;
text-align: left;
border: 1px solid #e5e7eb;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/* Мобильная адаптация:
- На планшетах (≤960px) — каскад работает, но компактнее
- На телефонах (≤640px) — каскад из 3 не помещается, поэтому
прячем большой mockup-1 (hero сайта), и центрируем
mockup-2 (каталог) + iPhone-мокап рядом. Это уже знакомая
пользователю композиция с одной из предыдущих версий. */
@media (max-width: 960px) {
.dm-hero-visual { height: 360px; max-width: 520px; margin: 0 auto; }
}
/* На телефонах (≤640px) выкидываем position:absolute каскад —
переключаемся на простой flex-row, чтобы оба скриншота гарантированно
рендерились. Каскад с поворотом красив только когда есть место. */
@media (max-width: 640px) {
.dm-hero-visual {
height: auto;
display: flex;
align-items: flex-end;
justify-content: center;
gap: 12px;
padding: 8px 0;
}
.dm-mockup-1 { display: none; } /* hero сайта прячем */
.dm-mockup-2 {
position: static;
width: 70%;
max-width: 360px;
transform: none;
flex: 0 1 auto;
}
.dm-mockup-mobile {
position: static;
width: 26%;
max-width: 100px;
flex: 0 0 auto;
}
/* Hover-эффекты на тач-устройствах не нужны */
.dm-hero-visual:hover .dm-mockup-1,
.dm-hero-visual:hover .dm-mockup-2,
.dm-hero-visual:hover .dm-mockup-mobile {
transform: none;
}
}
.dm-hero-inner { position: relative; text-align: center; max-width: 800px; margin: 0 auto; }
.dm-badge {
display: inline-block;
padding: 6px 16px;
background: rgba(76, 175, 80, 0.1);
color: #2e7d32;
border-radius: 999px;
font-weight: 600;
font-size: 13px;
margin-bottom: 18px;
}
/* Красный модификатор для маркетинговых акцентов
(«Новое…», «Только для клиентов…») — привлекает внимание. */
.dm-badge--red {
background: rgba(239, 68, 68, 0.1);
color: #b91c1c;
}
.dm-hero h1 {
font-size: clamp(28px, 5vw, 48px);
font-weight: 800;
line-height: 1.15;
margin: 0 0 18px;
letter-spacing: -0.02em;
}
.dm-hero h1 .dm-accent { color: #4CAF50; }
.dm-hero-lead {
font-size: clamp(16px, 2vw, 19px);
color: #4b5563;
max-width: 640px;
margin: 0 auto 32px;
}
.dm-cta-row {
display: flex;
flex-wrap: wrap;
gap: 12px;
justify-content: center;
margin-bottom: 12px;
}
/* На hero — все три кнопки строго в один ряд (не переносятся).
На очень узких экранах (<480px) — колонка, иначе текст не влезает. */
.dm-hero-cta-row {
flex-wrap: nowrap;
justify-content: flex-start;
}
.dm-hero-cta-row .dm-btn {
padding: 12px 18px;
font-size: 14px;
white-space: nowrap;
}
@media (max-width: 960px) {
.dm-hero-cta-row { justify-content: center; }
}
@media (max-width: 480px) {
.dm-hero-cta-row { flex-wrap: wrap; }
}
.dm-btn {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 14px 28px;
border-radius: 10px;
font-weight: 600;
font-size: 15px;
text-decoration: none;
transition: transform 0.15s, box-shadow 0.15s;
}
.dm-btn-primary {
background: #4CAF50;
color: #fff;
box-shadow: 0 4px 14px rgba(76, 175, 80, 0.3);
}
.dm-btn-primary:hover { transform: translateY(-1px); box-shadow: 0 6px 20px rgba(76, 175, 80, 0.4); }
.dm-btn-secondary {
background: #fff;
color: #1a1a1a;
border: 1.5px solid #e5e7eb;
}
.dm-btn-secondary:hover { border-color: #4CAF50; color: #4CAF50; }
/* ── Section ──────────────────────────────────────────────── */
.dm-section { padding: 70px 0; }
.dm-section-head { text-align: center; max-width: 700px; margin: 0 auto 50px; }
.dm-section h2 {
font-size: clamp(24px, 3.5vw, 36px);
font-weight: 700;
margin: 0 0 14px;
line-height: 1.2;
letter-spacing: -0.02em;
}
.dm-section-lead { font-size: 17px; color: #4b5563; margin: 0; }
/* ── How it works ─────────────────────────────────────────── */
.dm-section--how { background: #f9fafb; }
.dm-steps {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
gap: 24px;
counter-reset: step-counter;
}
.dm-step {
background: #fff;
border: 1px solid #e5e7eb;
border-radius: 14px;
padding: 26px;
position: relative;
}
.dm-step::before {
counter-increment: step-counter;
content: counter(step-counter);
position: absolute;
top: -16px; left: 24px;
width: 32px; height: 32px;
background: #4CAF50;
color: #fff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-weight: 700;
font-size: 14px;
}
.dm-step h3 { margin: 8px 0 8px; font-size: 17px; font-weight: 700; }
.dm-step p { margin: 0; color: #6b7280; font-size: 14px; line-height: 1.55; }
/* ── Features grid ────────────────────────────────────────── */
.dm-features {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 20px;
}
.dm-feature {
background: #fff;
border: 1px solid #e5e7eb;
border-radius: 14px;
padding: 28px;
transition: border-color 0.2s, box-shadow 0.2s;
}
.dm-feature:hover { border-color: #4CAF50; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06); }
.dm-feature-icon {
width: 44px; height: 44px;
background: rgba(76, 175, 80, 0.1);
border-radius: 12px;
display: flex; align-items: center; justify-content: center;
margin-bottom: 16px;
font-size: 22px;
}
.dm-feature h3 { margin: 0 0 8px; font-size: 17px; font-weight: 700; }
.dm-feature p { margin: 0; color: #6b7280; font-size: 14px; line-height: 1.55; }
/* ── Discount banner для клиентов JoyWork ─────────────────── */
.dm-discount {
background: linear-gradient(135deg, #4CAF50 0%, #2e7d32 100%);
color: #fff;
border-radius: 18px;
padding: 40px;
display: grid;
grid-template-columns: 1fr auto;
align-items: center;
gap: 24px;
}
.dm-discount h2 { color: #fff; margin: 0 0 8px; }
.dm-discount p { margin: 0; opacity: 0.92; font-size: 16px; }
.dm-discount .dm-btn-primary { background: #fff; color: #2e7d32; }
.dm-discount .dm-btn-primary:hover { box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15); }
@media (max-width: 640px) {
.dm-discount { grid-template-columns: 1fr; text-align: center; padding: 28px 24px; }
}
/* ── Screenshots ──────────────────────────────────────────── */
.dm-screens {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 16px;
}
.dm-screen {
border-radius: 14px;
overflow: hidden;
border: 1px solid #e5e7eb;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04);
background: #f9fafb;
}
.dm-screen img { width: 100%; height: auto; display: block; }
.dm-screen-cap { padding: 12px 16px; font-size: 13px; color: #6b7280; }
/* ── Video ────────────────────────────────────────────────── */
.dm-video-wrap {
position: relative;
max-width: 900px;
margin: 0 auto;
border-radius: 18px;
overflow: hidden;
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
cursor: pointer;
}
.dm-video-wrap video { width: 100%; display: block; }
/* YouTube-style play button: красный круг + белый треугольник */
.dm-play-overlay {
position: absolute;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
background: rgba(0, 0, 0, 0.18);
transition: background 0.2s, opacity 0.3s;
pointer-events: none; /* клик идёт сразу на видео */
}
.dm-video-wrap:hover .dm-play-overlay { background: rgba(0, 0, 0, 0.28); }
.dm-play-btn {
width: 88px; height: 60px;
background: #ff0000;
border-radius: 18px;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 4px 24px rgba(0, 0, 0, 0.35);
transition: transform 0.2s, background 0.2s;
}
.dm-video-wrap:hover .dm-play-btn { background: #cc0000; transform: scale(1.06); }
.dm-play-btn::before {
content: '';
display: block;
width: 0; height: 0;
border-style: solid;
border-width: 14px 0 14px 22px;
border-color: transparent transparent transparent #fff;
margin-left: 4px; /* визуально центрируем треугольник */
}
/* После старта видео — overlay скрываем */
.dm-video-wrap.is-playing .dm-play-overlay {
opacity: 0;
pointer-events: none;
}
/* ── FAQ ──────────────────────────────────────────────────── */
.dm-faq { max-width: 800px; margin: 0 auto; }
.dm-faq-item {
border-bottom: 1px solid #e5e7eb;
padding: 18px 0;
}
.dm-faq-q {
/* НЕ flex: иначе каждый <span> внутри становится отдельным
flex-итемом и между Joy/Work появляется gap 16px.
Кнопку «+/−» позиционируем absolute справа. */
position: relative;
padding-right: 36px;
cursor: pointer;
font-weight: 600;
font-size: 16px;
margin: 0;
list-style: none;
}
.dm-faq-q::-webkit-details-marker { display: none; }
.dm-faq-q::after {
content: '+';
position: absolute;
right: 0; top: 50%;
transform: translateY(-50%);
font-size: 22px;
color: #4CAF50;
font-weight: 400;
transition: transform 0.2s;
}
details[open] .dm-faq-q::after { content: ''; }
.dm-faq-a {
padding-top: 12px;
color: #4b5563;
font-size: 15px;
line-height: 1.6;
}
/* ── Final CTA ────────────────────────────────────────────── */
.dm-cta-block {
background: #0f172a;
color: #fff;
border-radius: 18px;
padding: 48px 32px;
text-align: center;
}
.dm-cta-block h2 { color: #fff; margin: 0 0 12px; }
.dm-cta-block p { color: #cbd5e1; margin: 0 0 24px; font-size: 16px; max-width: 540px; margin-left: auto; margin-right: auto; }
@media (max-width: 640px) {
.dm-section { padding: 50px 0; }
.dm-hero { padding: 60px 0 40px; }
}
/* ── SEO-text внизу страницы ─────────────────────────────────
Информационный блок для поисковиков. Закрывает «CRM + сайт»
запросы (не «конструктор сайтов» — те запросы у лендинга Domio). */
.dm-seo {
background: #fafbfc;
padding: 60px 0 80px;
}
.dm-seo-inner { max-width: 820px; margin: 0 auto; }
.dm-seo h2 {
font-size: 22px;
font-weight: 700;
margin: 32px 0 12px;
color: #0f172a;
line-height: 1.3;
letter-spacing: -0.01em;
}
.dm-seo h2:first-of-type { margin-top: 0; }
.dm-seo p {
font-size: 15px;
line-height: 1.75;
color: #374151;
margin: 0 0 14px;
}
.dm-seo p:last-child { margin-bottom: 0; }
.dm-seo a {
color: #2e7d32;
text-decoration: none;
border-bottom: 1px dotted rgba(46, 125, 50, 0.5);
transition: border-color 0.2s, color 0.2s;
}
.dm-seo a:hover {
color: #1b5e20;
border-bottom-color: #1b5e20;
}
.dm-seo ul {
margin: 8px 0 14px;
padding-left: 22px;
color: #374151;
font-size: 15px;
line-height: 1.7;
}
.dm-seo ul li { margin-bottom: 6px; }
</style>
<!-- ═══════ КОНТЕНТ ═══════ -->
<div class="dm-page">
<!-- ═══════ HERO ═══════ -->
<section class="dm-hero">
<div class="dm-container">
<div class="dm-hero-grid">
<!-- Левая колонка: текст + 3 кнопки -->
<div class="dm-hero-text">
<span class="dm-badge dm-badge--red">🔥 <span style="color:#1a1a1a;">Новое в</span> <span style="color:#4CAF50;">Joy</span><span style="color:#1a1a1a;">Work</span> <span style="color:#1a1a1a;">· Конструктор сайтов</span> <span style="color:#1a1a1a;">Dom</span><span style="color:#4CAF50;">io</span></span>
<h1>Сайт для агентства недвижимости — в один клик из Joy<span class="dm-jw-w">Work</span></h1>
<p class="dm-hero-lead">
Запустите свой сайт-витрину за 5 минут — без разработчиков и дизайнеров.
Объекты из CRM Joy<span class="dm-jw-w">Work</span> автоматически окажутся на сайте, заявки с сайта —
в вашей воронке. Один аккаунт, одна оплата, одна поддержка.
</p>
<div class="dm-cta-row dm-hero-cta-row">
<a href="https://www.mydomio.ru/?utm_source=joywork&utm_medium=cross-link&utm_campaign=joywork-domio-landing"
class="dm-btn dm-btn-primary" target="_blank" rel="noopener">
Попробовать бесплатно →
</a>
<a href="https://flatshop.mydomio.ru/?utm_source=joywork&utm_medium=cross-link&utm_campaign=joywork-domio-landing"
class="dm-btn dm-btn-secondary" target="_blank" rel="noopener">
Пример сайта
</a>
<a href="#video" class="dm-btn dm-btn-secondary">
▶ Видеообзор
</a>
</div>
<p class="dm-hero-meta" style="margin: 18px 0 0; font-size: 13px; color: #6b7280;">
Бесплатный пробный период 7 дней · Без привязки карты · Специальные тарифы для клиентов Joy<span class="dm-jw-w">Work</span>
</p>
</div>
<!-- Правая колонка: каскад из 3 скриншотов
(наведи курсор — мокапы раздвинутся) -->
<div class="dm-hero-visual">
<!-- 1. Hero сайта — на заднем плане слева, чуть наклонён -->
<div class="dm-mockup dm-mockup-1">
<img src="https://www.mydomio.ru/screenshots/home-hero.jpg"
alt="Главная страница сайта агентства — Доверяйте недвижимость профессионалам"
loading="eager">
</div>
<!-- 2. Каталог с browser bar — поверх первого -->
<div class="dm-mockup dm-mockup-2">
<div class="dm-mockup-bar">
<span></span><span></span><span></span>
<span class="dm-mockup-url">flatshop.mydomio.ru/catalog</span>
</div>
<img src="https://www.mydomio.ru/screenshots/catalog-grid.jpg"
alt="Каталог объектов недвижимости с фильтрами"
loading="eager">
</div>
<!-- 3. Мобильная версия — спереди справа в iPhone-рамке -->
<div class="dm-mockup-mobile">
<img src="https://www.mydomio.ru/screenshots/mobile-home.jpg"
alt="Мобильная версия сайта Domio"
loading="lazy">
</div>
</div>
</div>
</div>
</section>
<!-- ═══════ HOW IT WORKS ═══════ -->
<section class="dm-section dm-section--how" id="how-it-works">
<div class="dm-container">
<div class="dm-section-head">
<span class="dm-badge">Связка Joy<span class="dm-jw-w">Work</span> ↔ Domio</span>
<h2>Один продукт — две функции</h2>
<p class="dm-section-lead">
Сайт и CRM работают как единое целое. Никаких ручных импортов и
синхронизаций — всё происходит автоматически в фоне.
</p>
</div>
<div class="dm-steps">
<div class="dm-step">
<h3>Объекты из CRM на сайте</h3>
<p>Карточки квартир, домов, ЖК и коммерции автоматически появляются
на сайте. Изменили объект в CRM — обновился на сайте.</p>
</div>
<div class="dm-step">
<h3>Заявки в воронке CRM</h3>
<p>Когда клиент оставляет заявку на сайте, она тут же попадает
в вашу воронку Joy<span class="dm-jw-w">Work</span> с указанием источника (объект, страница, форма).</p>
</div>
<div class="dm-step">
<h3>Уведомления в Telegram и MAX</h3>
<p>Помимо CRM, каждая новая заявка приходит вам в мессенджер
в течение 1-2 секунд. Не упустите ни одного клиента.</p>
</div>
<div class="dm-step">
<h3>Один аккаунт и поддержка</h3>
<p>Логин общий, биллинг общий, поддержка единая. Не нужно
лазить между сервисами и платить отдельно за каждый.</p>
</div>
</div>
</div>
</section>
<!-- ═══════ FEATURES ═══════ -->
<section class="dm-section">
<div class="dm-container">
<div class="dm-section-head">
<span class="dm-badge">Возможности</span>
<h2>Заточен под рынок недвижимости</h2>
<p class="dm-section-lead">
Не «универсальный конструктор», который пытается подойти всем.
Это специализированный инструмент именно для агентств недвижимости.
</p>
</div>
<div class="dm-features">
<div class="dm-feature">
<div class="dm-feature-icon">🏢</div>
<h3>Каталог объектов с фильтрами</h3>
<p>Поиск по цене, площади, этажу, метро, району. Карта с пинами
объектов. Категории: квартиры, дома, новостройки, коммерция, аренда.</p>
</div>
<div class="dm-feature">
<div class="dm-feature-icon">📥</div>
<h3>Импорт XML-фидов</h3>
<p>Подключите фиды Яндекс.Недвижимости и ДомКлик — объекты
автоматически появятся на сайте. Поддерживаются миграционные
и инкрементальные фиды.</p>
</div>
<div class="dm-feature">
<div class="dm-feature-icon">💰</div>
<h3>Ипотечный калькулятор</h3>
<p>Встроенный калькулятор с реальными ставками банков-партнёров.
Программы ипотеки (семейная, IT, льготная) подбираются под объект.</p>
</div>
<div class="dm-feature">
<div class="dm-feature-icon">🎨</div>
<h3>Готовые шаблоны</h3>
<p>Три дизайна на выбор: Classic, Estate, Premium. Меняете
логотип, цвет бренда, тексты — без программирования.</p>
</div>
<div class="dm-feature">
<div class="dm-feature-icon">🌐</div>
<h3>Свой домен и SSL</h3>
<p>Запускайтесь на бесплатном поддомене за 5 минут или
подключайте свой домен — SSL-сертификат выпускается автоматически.</p>
</div>
<div class="dm-feature">
<div class="dm-feature-icon">📱</div>
<h3>Адаптивен под все устройства</h3>
<p>Сайт идеально выглядит на телефоне, планшете и компьютере.
Скорость загрузки — менее 2 секунд по российским каналам.</p>
</div>
</div>
</div>
</section>
<!-- ═══════ DISCOUNT для клиентов JoyWork ═══════ -->
<section class="dm-section">
<div class="dm-container">
<div class="dm-discount">
<div>
<span style="background: #fee2e2; padding: 5px 14px; border-radius: 99px; font-size: 13px; font-weight: 600; display: inline-block; margin-bottom: 12px;">
🔥 <span style="color: #1a1a1a;">Только для клиентов</span> <span style="color: #4CAF50;">Joy</span><span style="color: #1a1a1a;">Work</span>
</span>
<h2>Специальные тарифы со скидкой</h2>
<p>Если у вас уже есть аккаунт в CRM Joy<span style="color: #b7f5be;">Work</span> — действуют сниженные цены
на конструктор сайтов Domio. Уточните детали у менеджера или на странице тарифов.</p>
</div>
<a href="https://www.mydomio.ru/?utm_source=joywork&utm_medium=cross-link&utm_campaign=joywork-discount#tariffs"
class="dm-btn dm-btn-primary" target="_blank" rel="noopener">
Смотреть тарифы →
</a>
</div>
</div>
</section>
<!-- ═══════ ВИДЕО ═══════ -->
<section class="dm-section" id="video" style="background: #fafbfc; scroll-margin-top: 20px;">
<div class="dm-container">
<div class="dm-section-head">
<span class="dm-badge">Видеообзор</span>
<h2>Посмотрите видео про конструктор сайтов для агентств недвижимости</h2>
<p class="dm-section-lead">
Краткий обзор основных возможностей — как добавить объект,
подключить фид, настроить дизайн и принять первую заявку.
</p>
</div>
<div class="dm-video-wrap" id="dm-video-wrap">
<video
id="dm-video"
controls
poster="https://www.mydomio.ru/video/review-poster.jpg"
preload="metadata">
<source src="https://www.mydomio.ru/video/review.mp4" type="video/mp4">
Ваш браузер не поддерживает видео.
<a href="https://www.mydomio.ru/video/review.mp4">Скачать видео</a>
</video>
<div class="dm-play-overlay" aria-hidden="true">
<div class="dm-play-btn" role="button" aria-label="Запустить видео"></div>
</div>
</div>
<script>
// Запуск видео по клику на красную play-кнопку (как у YouTube).
// После старта overlay скрывается, дальше — нативные controls.
(function () {
var wrap = document.getElementById('dm-video-wrap');
var video = document.getElementById('dm-video');
if (!wrap || !video) return;
wrap.addEventListener('click', function (e) {
// Если кликнули по самим controls — не вмешиваемся
if (e.target === video && video.played.length) return;
if (video.paused) {
video.play();
wrap.classList.add('is-playing');
}
});
// Если юзер поставил на паузу — overlay снова появляется
video.addEventListener('pause', function () {
if (video.played.length === 0 || video.currentTime === 0) {
wrap.classList.remove('is-playing');
}
});
video.addEventListener('play', function () {
wrap.classList.add('is-playing');
});
})();
</script>
</div>
</section>
<!-- ═══════ FAQ ═══════ -->
<section class="dm-section">
<div class="dm-container">
<div class="dm-section-head">
<span class="dm-badge">Частые вопросы</span>
<h2>Что спрашивают чаще всего</h2>
</div>
<div class="dm-faq">
<details class="dm-faq-item">
<summary class="dm-faq-q">Нужен ли разработчик чтобы запустить сайт?</summary>
<div class="dm-faq-a">
Нет. Регистрация занимает 5 минут — получаете готовый сайт на
поддомене (например, ваше-агентство.mydomio.ru). Дальше через
визуальную админ-панель меняете логотип, цвета, контакты,
добавляете объекты. Никакого программирования.
</div>
</details>
<details class="dm-faq-item">
<summary class="dm-faq-q">Можно ли подключить свой домен?</summary>
<div class="dm-faq-a">
Да. В настройках вводите свой домен (например, ваш-агентство.ru),
добавляете CNAME-запись у регистратора, нажимаете «Проверить DNS» —
SSL-сертификат выпускается автоматически. Поддомен и собственный
домен поддерживаются одновременно.
</div>
</details>
<details class="dm-faq-item">
<summary class="dm-faq-q">Что если у меня уже есть база объектов в CRM Joy<span class="dm-jw-w">Work</span>?</summary>
<div class="dm-faq-a">
Все объекты из Joy<span class="dm-jw-w">Work</span> автоматически появятся на сайте — настраивать
ничего не нужно, интеграция работает «из коробки». Обновили объект
в CRM — обновился на сайте. Удалили — пропал с сайта.
</div>
</details>
<details class="dm-faq-item">
<summary class="dm-faq-q">Куда приходят заявки с сайта?</summary>
<div class="dm-faq-a">
В воронку CRM Joy<span class="dm-jw-w">Work</span> с указанием источника (Карточка объекта,
Главная страница, форма обратной связи), а также в Telegram или
MAX — если подключите уведомления в настройках. Все каналы работают
параллельно: пропустите в одном — увидите в другом.
</div>
</details>
<details class="dm-faq-item">
<summary class="dm-faq-q">Сколько стоит для клиентов Joy<span class="dm-jw-w">Work</span>?</summary>
<div class="dm-faq-a">
Для действующих клиентов Joy<span class="dm-jw-w">Work</span> действуют специальные тарифы
со скидкой. Также есть бесплатный пробный период 7 дней без
привязки карты — успеваете оценить продукт. Точную стоимость
смотрите на <a href="https://www.mydomio.ru/?utm_source=joywork&utm_medium=cross-link#tariffs"
target="_blank" rel="noopener" style="color: #4CAF50;">странице тарифов</a>
или уточняйте у менеджера.
</div>
</details>
<details class="dm-faq-item">
<summary class="dm-faq-q">Можно ли получить копию для своего сервера?</summary>
<div class="dm-faq-a">
Да, есть тариф «Мой сервер» — единоразовая покупка коробочной
версии для установки на собственный VPS. Без ежемесячных платежей,
с полным комплектом исходного кода. Подходит крупным агентствам
и застройщикам, которым важен полный контроль над инфраструктурой.
</div>
</details>
</div>
</div>
</section>
<!-- ═══════ FINAL CTA ═══════ -->
<section class="dm-section">
<div class="dm-container">
<div class="dm-cta-block">
<h2>Готовы запустить сайт за 5 минут?</h2>
<p>
Бесплатный пробный период, специальные тарифы для клиентов Joy<span class="dm-jw-w">Work</span>,
поддержка на русском языке.
</p>
<a href="https://www.mydomio.ru/?utm_source=joywork&utm_medium=cross-link&utm_campaign=joywork-domio-landing"
class="dm-btn dm-btn-primary" target="_blank" rel="noopener">
Попробовать бесплатно на Domio →
</a>
</div>
</div>
</section>
<!-- ═══════ SEO-TEXT ═══════
Информационный блок для поисковиков. Закрывает запросы из CRM-ниши
(«crm с конструктором сайтов», «сайт для риелтора с crm», «как сделать
сайт в crm») — НЕ запросы Domio-лендинга («конструктор сайтов для
агентств»). Это защищает от каннибализации и помогает обоим сайтам
ранжироваться выше за счёт перелинковки.
страницы JoyWork (тарифы, кейсы, блог) — это передаст SEO-сок
между страницами вашего сайта. Места отмечены комментариями. -->
<section class="dm-seo">
<div class="dm-container">
<div class="dm-seo-inner">
<h2>Зачем агентству недвижимости свой сайт в дополнение к CRM</h2>
<p>
CRM-система закрывает <strong>внутренние процессы</strong> агентства недвижимости — задачи риелторов,
ведение сделок, расчёт комиссий, контроль показов. Но клиенты не приходят сами: чтобы их получать,
нужен внешний канал — собственный сайт-витрина. Сайт работает 24/7, индексируется поисковиками,
принимает заявки в нерабочее время и формирует доверие к агентству ещё до первого звонка.
</p>
<p>
Если сайта нет, риелтор вынужден размещать объекты только на сторонних площадках вроде ЦИАН и
Авито — то есть конкурировать с десятками тысяч других объявлений и платить за каждое размещение.
Свой сайт даёт <strong>прямой канал привлечения</strong>: клиент видит ваш бренд, ваши объекты,
ваши контакты, без чужой рекламы рядом.
</p>
<h2>Как связка CRM и сайта меняет работу агентства</h2>
<p>
Главная проблема большинства агентств — <strong>разорванность между сайтом и CRM</strong>.
Объект продали в CRM — а на сайте он всё ещё висит активным. Клиент позвонил, узнал что
«уже продано», ушёл. Заявка пришла с сайта — менеджер увидел её через 4 часа, клиент успел
написать другому агентству. Лиды теряются, репутация падает.
</p>
<p>
Когда CRM и сайт работают как единая платформа, картина меняется радикально:
</p>
<ul>
<li>Объекты из CRM появляются на сайте <strong>автоматически</strong> в реальном времени —
добавили в карточке сделки, через минуту видно публично</li>
<li>Заявка с сайта попадает в воронку CRM <strong>с указанием источника</strong> (главная,
карточка объекта, форма обратного звонка) — менеджер сразу видит контекст</li>
<li>Уведомления о новых заявках приходят в Telegram или MAX в течение секунд —
риелтор реагирует первым на рынке</li>
<li>Изменения статуса (продано, в резерве) автоматически отражаются на витрине —
не нужно вручную убирать карточки с сайта</li>
</ul>
<p>
Это и есть <strong>сквозная аналитика для агентства недвижимости</strong>: видно откуда пришёл
клиент, через какой объект, в каком статусе сделка сейчас. Никакого ручного импорта между
системами — всё происходит само.
</p>
<h2>Что обычно мешает агентству запустить свой сайт</h2>
<p>
По нашему опыту, агентства недвижимости откладывают запуск сайта по трём причинам:
<strong>дорого, долго, нет специалистов</strong>. Разработка с нуля у студии стоит от 200 000
до 600 000 ₽ и занимает 24 месяца. Шаблонный сайт на конструкторе вроде Tilda обходится
дешевле, но требует ручного добавления каждого объекта (а их у крупного агентства сотни),
не умеет работать с XML-фидами Яндекс.Недвижимости и ДомКлик, и не имеет встроенной
интеграции с CRM.
</p>
<p>
Универсальные конструкторы заточены «под всё подряд» — там нет специфики рынка недвижимости:
ни фильтров по этажу и площади, ни карты с пинами объектов, ни ипотечного калькулятора с
реальными ставками банков, ни отдельных разделов для новостроек и коммерческой недвижимости.
В итоге сайт выглядит как лендинг кофейни, а не как профессиональная витрина агентства.
</p>
<p>
Связка JoyWork и Domio закрывает все три проблемы: <strong>запуск за 5 минут</strong> без
разработчиков, <strong>оплата помесячная</strong> вместо разовых сотен тысяч, и
<strong>специализация под рынок недвижимости</strong> с первого дня — не «универсальный»
инструмент, а конкретный продукт для конкретной отрасли.
</p>
<h2>Возможности конструктора сайтов для клиентов <span class="dm-jw-w" style="color: inherit;">Joy</span><span style="color: #4CAF50;">Work</span></h2>
<p>
Конструктор Domio даёт агентству недвижимости полноценный сайт-витрину со всем,
что нужно для работы с клиентами:
</p>
<ul>
<li><strong>Каталог объектов</strong> с фильтрами по типу, цене, площади, этажу, метро, району</li>
<li><strong>Интерактивная карта</strong> с пинами объектов и кластеризацией</li>
<li><strong>Раздел новостроек</strong> с карточками жилых комплексов, очередями строительства,
статусами «строится / сдан»</li>
<li><strong>Ипотечный калькулятор</strong> с программами банков-партнёров, фильтрацией по
типу недвижимости (новостройка / вторичка / коммерция)</li>
<li><strong>Импорт XML-фидов</strong> Яндекс.Недвижимости, ДомКлик и других площадок</li>
<li><strong>Свой домен и SSL</strong> — запускайтесь на поддомене бесплатно или подключайте
собственный домен с автоматическим выпуском сертификата</li>
<li><strong>SEO-настройки из админки</strong> — мета-теги, sitemap.xml, robots.txt,
структурированная разметка</li>
<li><strong>Адаптивная вёрстка</strong> — сайт корректно отображается на телефонах,
планшетах и компьютерах</li>
</ul>
<p>
Для действующих клиентов CRM JoyWork действуют <strong>специальные тарифы</strong> на конструктор —
это дешевле, чем регистрироваться напрямую. Подробнее о всех возможностях,
демо-сайте и тарифах смотрите на странице
<a href="https://www.mydomio.ru/?utm_source=joywork&utm_medium=cross-link&utm_campaign=joywork-seo-text"
target="_blank" rel="noopener">конструктора сайтов Domio</a>
или попробуйте конструктор бесплатно в течение 7 дней.
</p>
</div>
</div>
</section>
</div>
<?php
require_once($_SERVER['DOCUMENT_ROOT'] . "/promo/templates/footer.php");
?>