Lightbox Ρ‡Ρ‚ΠΎ это Ρ‚Π°ΠΊΠΎΠ΅: LightBox с Ρ‚ΠΎΡ‡ΠΊΠΈ зрСния UX/UI ΠΈ ΠΊΠ°ΠΊ ΠΎΠ½ мСняСт ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Ρ‹ / Π₯Π°Π±Ρ€

Π‘ΠΎΠ΄Π΅Ρ€ΠΆΠ°Π½ΠΈΠ΅

LightBox с Ρ‚ΠΎΡ‡ΠΊΠΈ зрСния UX/UI ΠΈ ΠΊΠ°ΠΊ ΠΎΠ½ мСняСт ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Ρ‹ / Π₯Π°Π±Ρ€

Π’ ЭкосистСмС Π Π‘Π₯Π‘ ΠΌΡ‹ создаСм ΠΈΠ½Π½ΠΎΠ²Π°Ρ†ΠΈΠΎΠ½Π½Ρ‹Π΅ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Ρ‹ для сСльского хозяйства.
Для ΠΈΡ… Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ ΠΌΡ‹ Ρ€Π΅ΡˆΠΈΠ»ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΏΠΎΠ΄Ρ…ΠΎΠ΄ ΠΌΠΈΡ€ΠΎΠ²Ρ‹Ρ… ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠΉ Π² области UX/UI.
Π§Ρ‚ΠΎΠ±Ρ‹ Π½Π΅ ΠΏΠΎΠ²Ρ‚ΠΎΡ€ΡΡ‚ΡŒ ошибки ΠΊΠΎΠ½ΠΊΡƒΡ€Π΅Π½Ρ‚ΠΎΠ² ΠΈ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΏΠΎΠ»Π½ΠΎΡ†Π΅Π½Π½ΡƒΡŽ экосистСму.
Основой всСх ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚ΠΎΠ² экосистСмы стал LightBox, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ являСтся сквозным Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΎΠ½Π°Π»ΡŒΠ½Ρ‹ΠΌ Π΄ΠΈΠ·Π°ΠΉΠ½-Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅ΠΌ. НапримСр, Π² ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Π΅ для Ρ„Π΅Ρ€ΠΌΠ΅Ρ€ΠΎΠ², ΠΌΡ‹ Ρ€Π΅ΡˆΠ°Π΅ΠΌ насущныС ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΡ‹ ΠΈ вопросы Ρ„Π΅Ρ€ΠΌΠ΅Ρ€Π° Π² ΠΎΠ΄Π½ΠΎΠΌ ΠΎΠΊΠ½Π΅ ΠΈ ΠΊΡ€ΠΎΠΌΠ΅ маркСтплСйса Ρ‚ΠΎΠ²Π°Ρ€ΠΎΠ² прСдоставляСм большоС число услуг
ΠΈ сСрвисов.
Π‘Π»ΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Π° Π·Π°ΠΊΠ»ΡŽΡ‡Π°Π΅Ρ‚ΡΡ Π² объСдинСнии Π² ΠΎΠ΄Π½ΠΎΠΌ ΠΏΠΎΡ€Ρ‚Π°Π»Π΅ Ρ€Π°Π·Π½Ρ‹Ρ… сцСнариСв ΠΈ Ρ€ΠΎΠ»Π΅ΠΉ.

Π§Ρ‚ΠΎ Ρ‚Π°ΠΊΠΎΠ΅ LightBox ΠΈ ΠΏΠΎΡ‡Π΅ΠΌΡƒ ΠΈΠΌΠ΅Π½Π½ΠΎ Β«LightBoxΒ», Π° Π½Π΅ Β«LightWindowΒ», Π² Ρ‡Π΅ΠΌ Π΅Π³ΠΎ ΠΎΡ‚Π»ΠΈΡ‡ΠΈΠ΅ ΠΎΡ‚ Pop-up, ΠΊΠ°ΠΊ ΠΎΠ½ способСн ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚. ВсС это я ΠΏΠΎΡΡ‚Π°Ρ€Π°ΡŽΡΡŒ Ρ€Π°ΡΡΠΊΠ°Π·Π°Ρ‚ΡŒ Π½ΠΈΠΆΠ΅.

1 β€” Π‘ Ρ‚ΠΎΡ‡ΠΊΠΈ зрСния Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ LightBox прСдставляСт собой Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ с ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ΠΌ.

2 β€” Pop-up ΠΈΠ»ΠΈ модальноС ΠΎΠΊΠ½ΠΎ, прСдставляСт собой Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ с ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΡŒΠ½Ρ‹ΠΌ Π½Π°Π±ΠΎΡ€ΠΎΠΌ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΎΠ½Π°Π»Π° Π½Π΅ ΠΈΠΌΠ΅ΡŽΡ‰Π΅Π³ΠΎ ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½ΠΎΠ³ΠΎ URL. Π•Π³ΠΎ основная Π·Π°Π΄Π°Ρ‡Π° ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»Ρ, ΡΠΏΡ€Π°ΡˆΠΈΠ²Π°Ρ‚ΡŒ ΠΈ ΡƒΡ‚ΠΎΡ‡Π½ΡΡ‚ΡŒ, ΠΏΡ€Π΅Π΄ΡƒΠΏΡ€Π΅ΠΆΠ΄Π°Ρ‚ΡŒ, ΠΎΡ‚ΠΊΡ€Ρ‹Π²Π°Ρ‚ΡŒ просмотр ΠΈ ΠΌΠ΅Π΄ΠΈΠ° ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π°.

3 β€” ΠœΠΎΠ΄Π°Π»ΡŒΠ½Ρ‹Π΅ ΠΎΠΊΠ½Π° Π·Π°Π½ΠΈΠΌΠ°ΡŽΡ‚, ΠΊΠ°ΠΊ ΠΏΡ€Π°Π²ΠΈΠ»ΠΎ, ΠΌΠ΅Π½Π΅Π΅ 30% экрана. LightBox β€” это ΡƒΠΆΠ΅ полноцСнная страница, с ΠΏΠΎΠ»Π½ΠΎΡ†Π΅Π½Π½Ρ‹ΠΌ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΎΠ½Π°Π»ΠΎΠΌ ΠΈ ΠΈΠΌΠ΅ΡŽΡ‰Π°Ρ ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½Ρ‹ΠΉ URL ΠΈ ΠΏΠ»ΠΎΡ‰Π°Π΄ΡŒΡŽ покрытия ΠΎΡ‚ 70% Π΄ΠΎ 90%.

4 β€” ΠŸΠΎΡ‡Π΅ΠΌΡƒ ΠΌΡ‹ считаСм Π΄Π°Π½Π½ΠΎΠ΅ Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅ ΠΊΠ»ΡŽΡ‡Π΅Π²Ρ‹ΠΌ ΠΈ Π²Π°ΠΆΠ½Ρ‹ΠΌ для UΠ₯ ΠΈ UI Π±ΠΎΠ»ΡŒΡˆΠΈΠ½ΡΡ‚Π²Π° ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚ΠΎΠ²?
ВсС просто. ВсС интСрфСйсы ΠΈ Π΄ΠΈΠ·Π°ΠΉΠ½ Ρ€Π΅ΡˆΠ΅Π½ΠΈΡ ΠΈΠΌΠ΅ΡŽΡ‚ нСсколько Ρ†Π΅Π»Π΅ΠΉ ΠΈ Π΅Π΄ΠΈΠ½Ρ‹ΠΉ ΠΏΡƒΡ‚ΡŒ развития. ВсС мСняСтся ΠΈ ΠΈΠΌΠ΅Π΅Ρ‚ Ρ†ΠΈΠΊΠ»ΠΈΡ‡Π½ΠΎΡΡ‚ΡŒ, Ρ‚Π°ΠΊ Π²ΠΎΡ‚ β€” Ссли ΡƒΠ³Π»ΡƒΠ±ΠΈΡ‚ΡŒΡΡ Π² ΠΈΡΡ‚ΠΎΡ€ΠΈΡŽ ΠΏΠ΅Ρ€Π²Ρ‹Ρ… интСрфСйсных Ρ€Π΅ΡˆΠ΅Π½ΠΈΠΉ, Ρ‚ΠΎ всС ΠΎΠ½ΠΈ Π±Ρ‹Π»ΠΈ основаны Π½Π° LightWindows, это Π±Ρ‹Π»ΠΈ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΎΠ½Π°Π»ΡŒΠ½Ρ‹Π΅ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰ΠΈΠ΅ ΠΎΠΊΠ½Π°. БСйчас ΠΆΠ΅ вСсь Π΄ΠΈΠ·Π°ΠΉΠ½ стрСмится ΠΊ ΠΌΠ°ΠΊΡΠΈΠΌΠ°Π»ΡŒΠ½ΠΎΠΌΡƒ удобству, ΠΎΠΏΡ‚ΠΈΠΌΠΈΠ·Π°Ρ†ΠΈΠΈ Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ ΠΈ ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΠΈΠ·ΠΌΡƒ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΎΠΊΠ½Π°.
Π˜Π΄Π΅Π°Π»ΡŒΠ½Ρ‹ΠΉ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚ΠΎΠ²Ρ‹ΠΉ интСрфСйс β€” это ΠΎΠ΄Π½ΠΎ ΠΎΠΊΠ½ΠΎ.


ΠŸΠΎΡ‡Π΅ΠΌΡƒ сСйчас всС большС ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚ΠΎΠ² ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ осознанно ΠΈΠ»ΠΈ Π½Π΅Ρ‚ LightBox, ΠΈ ΠΏΠΎΡ‡Π΅ΠΌΡƒ Ρ€Π°Π½ΡŒΡˆΠ΅ ΠΎΠ½ΠΈ этого Π½Π΅ Π΄Π΅Π»Π°Π»ΠΈ. ΠŸΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΠΈ Π½Π΅ Π±Ρ‹Π»ΠΈ Π³ΠΎΡ‚ΠΎΠ²Ρ‹ ΠΊ ΠΊΠ°Ρ€Π΄ΠΈΠ½Π°Π»ΡŒΠ½Ρ‹ΠΌ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅Π½Π°ΠΌ, Ρ‚Π΅Ρ…Π½ΠΎΠ»ΠΎΠ³ΠΈΠΈ Π½Π΅ достигли ΡΠΎΠΎΡ‚Π²Π΅Ρ‚ΡΡ‚Π²ΡƒΡŽΡ‰Π΅Π³ΠΎ уровня.

ΠŸΠΎΡ‡Π΅ΠΌΡƒ ΠΌΡ‹ стали ΠΏΡ€ΠΈΠΌΠ΅Π½ΡΡ‚ΡŒ LightBox, расскаТу Π½Π° ΠΎΠ΄Π½ΠΎΠΌ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π΅ Π½ΠΈΠΆΠ΅.
ΠŸΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒ находится Π½Π° ΠΏΠΎΡ€Ρ‚Π°Π»Π΅, ΠΈΡ‰Π΅Ρ‚ Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΡ‹ΠΉ Ρ‚ΠΎΠ²Π°Ρ€ ΠΈΠ»ΠΈ услугу, Ρ‡Π΅Ρ€Π΅Π· поиск, ΠΏΠΎΠ»ΡƒΡ‡Π°Π΅Ρ‚ страницу Π²Ρ‹Π΄Π°Ρ‡ΠΈ, добавляСт Ρ„ΠΈΠ»ΡŒΡ‚Ρ€Ρ‹ ΠΈ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ ΠΊΡ€ΠΈΡ‚Π΅Ρ€ΠΈΠΈ. Находит Π½ΡƒΠΆΠ½Ρ‹ΠΉ Ρ‚ΠΎΠ²Π°Ρ€, Π½Π°ΠΆΠΈΠΌΠ°Π΅Ρ‚ Π½Π° ΠΊΠ°Ρ€Ρ‚ΠΎΡ‡ΠΊΡƒ, ΡΠΎΠ²Π΅Ρ€ΡˆΠ°Π΅Ρ‚ ΠΏΠΎΠΊΡƒΠΏΠΊΡƒ, Π·Π°ΠΊΡ€Ρ‹Π²Π°Π΅Ρ‚ Ρ‡Π΅Ρ€Π΅Π· Π±Ρ€Π°ΡƒΠ·Π΅Ρ€ ΠΈΠ»ΠΈ Β«Ρ…Π»Π΅Π±Π½Ρ‹Π΅ ΠΊΡ€ΠΎΡˆΠΊΠΈΒ», ΠΏΠ΅Ρ€Π΅Ρ…ΠΎΠ΄ΠΈΡ‚ Π½Π° страницу списка, тСряя контСкст, Ρ„ΠΈΠ»ΡŒΡ‚Ρ€Ρ‹ ΠΈ поиск ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΎΠ½ Π΄Π΅Π»Π°Π» Ρ€Π°Π½Π΅Π΅.

Π­Ρ‚ΠΎ порядка 7-10ΠΌΠΈΠ½ΡƒΡ‚, Π° Π² слоТных ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Π°Ρ… ΠΈ Π±ΠΎΠ»Π΅Π΅ 25ΠΌΠΈΠ½ΡƒΡ‚.
Π§Π΅Π»ΠΎΠ²Π΅ΠΊ тСряСт врСмя, тСряСт контСкст ΠΈ Π½Π°Ρ‡ΠΈΠ½Π°Π΅Ρ‚ свой ΠΏΡƒΡ‚ΡŒ Π·Π°Π½ΠΎΠ²ΠΎ.

LightBox, ΠΏΠΎΠΌΠΎΠ³Π°Π΅Ρ‚ Ρ€Π΅ΡˆΠΈΡ‚ΡŒ ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΡƒ ΠΏΠΎΡ‚Π΅Ρ€ΠΈ контСкста, Ρ„ΠΈΠ»ΡŒΡ‚Ρ€ΠΎΠ², поиска ΠΈ Π²Ρ‹Π΄Π°Ρ‡ΠΈ. Π­Ρ‚ΠΎ страница с ΡƒΠ½ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹ΠΌ URL (всСгда ΠΌΠΎΠΆΠ½ΠΎ ΠΎΡ‚ΡΠ»Π΅Π΄ΠΈΡ‚ΡŒ ΠΏΠ΅Ρ€Π΅Ρ…ΠΎΠ΄ Π½Π° Π½Π΅Π΅ ΠΈ ΠΏΠΎΠ΄Π΅Π»ΠΈΡ‚ΡŒΡΡ ссылкой), открываСтся ΠΏΠΎΠ²Π΅Ρ€Ρ… страницы Π²Ρ‹Π΄Π°Ρ‡ΠΈ ΠΈ позволяСт Π²Π΅Ρ€Π½ΡƒΡ‚ΡŒΡΡ Π² Ρ‚ΠΎΡ‚ ΠΆΠ΅ экран ΠΎΡ‚ΠΊΡƒΠ΄Π° ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒ ΡƒΡˆΠ΅Π».

ΠŸΡ€ΠΈ тСстировании Π΄Π°Π½Π½ΠΎΠΉ Ρ‚Π΅Ρ…Π½ΠΎΠ»ΠΎΠ³ΠΈΠΈ Π½Π° ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡΡ… Π΅Ρ‰Π΅ Π½Π° стадии ΠΏΡ€ΠΎΡ‚ΠΎΡ‚ΠΈΠΏΠΎΠ² ΠΈ ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ² 100 ΠΈΠ· 100 ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»Π΅ΠΉ ΠΏΠΎΠ»ΠΎΠΆΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ ΠΎΡ†Π΅Π½ΠΈΠ»ΠΈ Ρ‚Π°ΠΊΠΎΠ΅ Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅.
Π’Π°ΠΊ ΠΆΠ΅ ΠΏΡ€ΠΈ большом количСствС схоТих ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚ΠΎΠ² ΠΈΠ»ΠΈ услуг, LightBox позволяСт ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŽ ΠΏΠ΅Ρ€Π΅Π»ΠΈΡΡ‚Ρ‹Π²Π°Ρ‚ΡŒ страницу Π½Π΅ закрывая Π΅Π΅.

ΠŸΡ€Π΅ΠΈΠΌΡƒΡ‰Π΅ΡΡ‚Π²Π° LightBox:
β€” Π£Π½ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹ΠΉ URL
β€” ΠŸΠΎΠ»Π½ΠΎΡ†Π΅Π½Π½Π°Ρ страница с сохранСниСм Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΎΠ½Π°Π»Π°
β€” Π‘ΠΎΡ…Ρ€Π°Π½Π΅Π½ΠΈΠ΅ контСкста
β€” Π˜Π½Ρ‚ΡƒΠΈΡ‚ΠΈΠ²Π½ΠΎΡΡ‚ΡŒ
β€” Π‘Π²ΠΎΠ±ΠΎΠ΄Π° Ρ€Π΅Π°Π»ΠΈΠ·Π°Ρ†ΠΈΠΈ ΠΈ Π΄ΠΈΠ·Π°ΠΉΠ½Π°
β€” 70%-90% Ρ€Π°Π±ΠΎΡ‡Π΅Π³ΠΎ пространства с Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡ‚ΡŒΡŽ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒ интСрфСйс Π² ΠΏΠΎΠ»Π½ΠΎΠΌ объСмС
β€” Π’ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ Π±Π»ΠΎΡ‡Π½ΠΎΠ³ΠΎ построСния ΠΈ ΠΈΠ½Ρ‚Π΅Π³Ρ€Π°Ρ†ΠΈΠΈ Π²Π½Π΅Π΄Ρ€Π΅Π½Π½ΠΎΠ³ΠΎ скролла.


ЭкосистСма для Ρ„Π΅Ρ€ΠΌΠ΅Ρ€ΠΎΠ² (Π‘Π²ΠΎΡ‘ | ЀСрмСрство)

Как Π² Ρ€Π΅Π°Π»ΡŒΠ½Ρ‹Ρ… ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Π°Ρ… Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ LightBox ΠΈ ΠΊΠ°ΠΊΠΎΠ²Ρ‹ Π΅Π³ΠΎ прСимущСства.
Π’ΠΎ ΠΏΠ΅Ρ€Π²Ρ‹Ρ…, врСмя Ρ€Π°Π±ΠΎΡ‚Ρ‹ ΠΈ ΠΏΠ΅Ρ€Π΅Ρ…ΠΎΠ΄ΠΎΠ² сокращаСтся Π² срСднСм с 10 ΠΌΠΈΠ½ΡƒΡ‚ Π΄ΠΎ 1 ΠΌΠΈΠ½ΡƒΡ‚Ρ‹.
Π’ΠΎ Π²Ρ‚ΠΎΡ€Ρ‹Ρ…, ΠΎΠ±Ρ‰Π΅Π΅ врСмя ΠΈ ΡΠΊΠΎΡ€ΠΎΡΡ‚ΡŒ взаимодСйствия Π΄ΠΎ ΠΊΠΎΠ½Π΅Ρ‡Π½ΠΎΠ³ΠΎ дСйствия, сокращаСтся Π²Π΄Π²ΠΎΠ΅.

Π€Π΅Ρ€ΠΌΠ΅Ρ€Ρ‹ ΠΈ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΠΈ ΠΏΠΎΠ»ΠΎΠΆΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ ΠΎΡ†Π΅Π½ΠΈΠ»ΠΈ это Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅ ΠΈ ΠΌΡ‹ стрСмимся ΠΊ Ρ€Π°Π±ΠΎΡ‚Π΅ Π² ΠΎΠ΄Π½ΠΎΠΌ ΠΎΠΊΠ½Π΅.

МСня Π·ΠΎΠ²ΡƒΡ‚ ΠšΠΈΡ€ΠΈΠ»Π» Π’Π°Π³ΠΈΠ½Ρ†Π΅Π², я возглавляю UI/UX экосистСмы Π Π‘Π₯Π‘, ΠΌΡ‹ Ρ€Π°Π·Ρ€Π°Π±Π°Ρ‚Ρ‹Π²Π°Π΅ΠΌ ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Ρ‹ ΠΈ примСняСм LightBox Π² своих ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Π°Ρ…. Π’ ΡΡ‚Π°Ρ‚ΡŒΠ΅ прСдставлСны лишь Ρ‡Π°ΡΡ‚ΡŒ ΠΈΠ· Π½ΠΈΡ….
Π’ ΠΎΠ΄Π½ΠΎΠΌ ΠΈΠ· послСдних ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚ΠΎΠ², для ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ³ΠΎ ΠΏΡ€ΠΈΠΌΠ΅Π½ΡΠ»ΠΎΡΡŒ Π΄Π°Π½Π½ΠΎΠ΅ Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅, ΠΏΠΎ Ρ€Π΅ΠΉΡ‚ΠΈΠ½Π³ markswebb, заняло 1-Π΅ мСсто, ΠΈ LightBox Π±Ρ‹Π» Ρ€Π΅ΡˆΠ°ΡŽΡ‰ΠΈΠΌ с Ρ‚ΠΎΡ‡ΠΊΠΈ зрСния удобства ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΎΠ³ΠΎ взаимодСйствия.


Новостной ΠΏΠΎΡ€Ρ‚Π°Π», с ΡΠΎΡ†ΠΈΠ°Π»ΡŒΠ½Ρ‹ΠΌΠΈ Π±Π»ΠΎΠ³Π°ΠΌΠΈ для Ρ„Π΅Ρ€ΠΌΠ΅Ρ€ΠΎΠ² (Новости ΠΈ Π‘Π»ΠΎΠ³ΠΈ)


ΠŸΠΎΡ€Ρ‚Π°Π» поиска сотрудников ΠΈ Ρ€Π°Π±ΠΎΡ‚Ρ‹ Π² Π°Π³Ρ€ΠΎ Π½Π°ΠΏΡ€Π°Π²Π»Π΅Π½ΠΈΠΈ (ΠŸΠΎΠ΄Π±ΠΎΡ€ пСрсонала)

КакиС ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ LightBox:
β€” ЯндСкс
β€” Facebook
β€” Mail.group
β€” dribbble.com
β€” Bechance.net
β€” Π‘Π±Π΅Ρ€Π±Π°Π½ΠΊ

jQuery Lightbox

ΠžΠΏΡƒΠ±Π»ΠΈΠΊΠΎΠ²Π°Π½ΠΎ: 1 января 1970 Π³.

  • Π³Ρ€Π°Ρ„ΠΈΠΊΠ°

  • jquery

  • Π‘ΠΊΠ°Ρ‡Π°Ρ‚ΡŒ

Lightbox — это JQuery-ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ для отобраТСния изобраТСния ΠΈΠ»ΠΈ любого Π΄Ρ€ΡƒΠ³ΠΎΠ³ΠΎ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π° Π² ΡΠΏΠ΅Ρ†ΠΈΠ°Π»ΡŒΠ½ΠΎ ΠΎΡ„ΠΎΡ€ΠΌΠ»Π΅Π½Π½ΠΎΠΌ ΠΎΠΊΠ½Π΅, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ показываСтся, ΠΊΠ°ΠΊ ΠΏΡ€Π°Π²ΠΈΠ»ΠΎ, Π½Π° ΠΏΠΎΠ»ΡƒΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΠΌ Π·Π°Ρ‚Π΅Π½Π΅Π½Π½ΠΎΠΌ Ρ„ΠΎΠ½Π΅ ΠΏΠΎΠ²Π΅Ρ€Ρ… основного ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π° страницы.

ΠŸΡ€Π΅ΠΆΠ΄Π΅ Ρ‡Π΅ΠΌ ΡƒΡΡ‚Π°Π½Π°Π²Π»ΠΈΠ²Π°Ρ‚ΡŒ ΠΏΠ»Π°Π³ΠΈΠ½ Π½Π° страницу ΠΈ Π·Π°Π½ΠΈΠΌΠ°Ρ‚ΡŒΡΡ Π΅Π³ΠΎ настройкой, Π΄Π°Π²Π°ΠΉΡ‚Π΅ взглянСм Π½Π° ΠΏΡ€ΠΈΠΌΠ΅Ρ€Ρ‹:

Начало Ρ€Π°Π±ΠΎΡ‚Ρ‹ с Lightbox

Π‘ΠΊΠ°Ρ‡Π°ΠΉΡ‚Π΅ послСднюю Π²Π΅Ρ€ΡΠΈΡŽ ΠΏΠ»Π°Π³ΠΈΠ½Π° (Ρ‚Π°ΠΊΠΆΠ΅ доступна Ρ‡Π΅Ρ€Π΅Π· Bower: bower install lightbox2 --save). ПослС этого Ρ€Π°Π·Π°Ρ€Ρ…ΠΈΠ²ΠΈΡ€ΡƒΠΉΡ‚Π΅ zip Ρ„Π°ΠΉΠ» ΠΈ заглянитС Π² ΡƒΡ€Π΅Π·Π°Π½Π½Ρ‹ΠΉ Ρ€Π°Π±ΠΎΡ‡ΠΈΠΉ ΠΏΡ€ΠΈΠΌΠ΅Ρ€, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ находится Π² ΠΏΠ°ΠΏΠΊΠ΅ examples.

Π“ΠΎΡ‚ΠΎΠ²Ρ‹Π΅ для установки Lightbox Π½Π° вашСй страницС? НачнитС с ΠΏΠΎΠ΄ΠΊΠ»ΡŽΡ‡Π΅Π½ΠΈΡ CSS ΠΈ Javascript. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π²Π·ΡΡ‚ΡŒ ΠΎΠ±Π° этих Ρ„Π°ΠΉΠ»Π° ΠΈΠ· ΠΏΠ°ΠΏΠΊΠΈ dist. Π’ΡΡ‚Π°Π²ΡŒΡ‚Π΅ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΉ ΠΊΠΎΠ΄ ΠΌΠ΅ΠΆΠ΄Ρƒ Ρ‚Π΅Π³Π°ΠΌΠΈ head Π² вашСй web-страницС

<link href="path/to/lightbox.css" rel="stylesheet">

Π‘Π»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΉ ΠΊΠΎΠ΄, ΠΏΠΎΠ΄ΠΊΠ»ΡŽΡ‡Π°ΡŽΡ‰ΠΈΠΉ ΠΏΠ»Π°Π³ΠΈΠ½, Π²ΡΡ‚Π°Π²ΡŒΡ‚Π΅ ΠΏΠ΅Ρ€Π΅Π΄ Π·Π°ΠΊΡ€Ρ‹Π²Π°ΡŽΡ‰ΠΈΠΌ Ρ‚Π΅Π³ΠΎΠΌ body:

<script src="path/to/lightbox.js"></script>

Π£Π±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ JQuery, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ трСбуСтся Lightbox, Ρ‚Π°ΠΊΠΆΠ΅ Π·Π°Π³Ρ€ΡƒΠΆΠ°ΡŽΡ‚ΡΡ. Если Π²Ρ‹ ΡƒΠΆΠ΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚Π΅ JQuery (трСбуСтся JQuery 1.

7 ΠΈΠ»ΠΈ Π²Ρ‹ΡˆΠ΅) Π½Π° страницС, ΡƒΠ±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ ΠΎΠ½ загруТаСтся Π΄ΠΎ lightbox.js. Если Ρƒ вас Π½Π΅ ΠΏΠΎΠ΄ΠΊΠ»ΡŽΡ‡Π΅Π½Π° jQuery, Π²ΠΎΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅Π»ΡŒ dist/js/lightbox-plus-jquery.js, Π² ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΌ ΡƒΠΆΠ΅ Π΅ΡΡ‚ΡŒ эта Π±ΠΈΠ±Π»ΠΈΠΎΡ‚Π΅ΠΊΠ°, Π»ΠΈΠ±ΠΎ скачайтС послСднюю Π²Π΅Ρ€ΡΠΈΡŽ с ΠΎΡ„. сайта. Π£Π±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ Ρ‡Π΅Ρ‚Ρ‹Ρ€Π΅ изобраТСния, прописанныС Π² lightbox.css располоТСни Π² ΡƒΠΊΠ°Π·Π°Π½Π½ΠΎΠΌ мСстС. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π²Π·ΡΡ‚ΡŒ изобраТСния ΠΈΠ· ΠΏΠ°ΠΏΠΊΠΈ /dist/images.

Π’Π΅ΠΏΠ΅Ρ€ΡŒ займСмся HTML-ΠΊΠΎΠ΄ΠΎΠΌ. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚ data-lightbox ΠΊ ссылкС, содСрТащСй изобраТСния ΠΈ ΠΊ ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΌ ΠΌΡ‹ Ρ…ΠΎΡ‚ΠΈΠΌ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚ΡŒ наш ΠΏΠ»Π°Π³ΠΈΠ½. Π’ качСствСн значСния Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚Π° ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΡƒΠ½ΠΈΠΊΠ°Π»ΡŒΠ½ΠΎΠ΅ для ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ изобраТСния имя. НапримСр:

<a href="images/image-1.jpg" 
   data-lightbox="image-1" 
   data-title="Мой заголовок">Image #1</a>

Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚ data-title, Ссли Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ. Если Ρƒ вас Π΅ΡΡ‚ΡŒ Π³Ρ€ΡƒΠΏΠΏΠ° связанных ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Ρ‹ Ρ…ΠΎΡ‚Π΅Π»ΠΈ Π±Ρ‹ ΠΎΠ±ΡŠΠ΅Π΄ΠΈΠ½ΠΈΡ‚ΡŒ Π² Π½Π°Π±ΠΎΡ€, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎΠ΅ Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ Π² Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚Π΅

data-lightbox для Ρ‚Ρ€Π΅Π±ΡƒΠ΅ΠΌΡ‹Ρ… ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ. НапримСр:

<a href="img2.jpg" data-lightbox="roadtr">Img 2</a>

<a href="img3.jpg" data-lightbox="roadtr">Img 3</a>

<a href="img4.jpg" data-lightbox="roadtr">Img 4</a>

Настройки Lightbox

Если Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΠΊΠ°ΠΊΠΈΠ΅-Π»ΠΈΠ±ΠΎ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ, Π²Ρ‹Π·ΠΎΠ²ΠΈΡ‚Π΅ ΠΌΠ΅Ρ‚ΠΎΠ΄ option:.

<script>
    lightbox.option({
      'resizeDuration': 200,
      'wrapAround': true
    })
</script>
  • alwaysShowNavOnTouchDevices
    По ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ:
    false

    Если true, Ρ‚ΠΎ лСвая ΠΈ правая стрСлки Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΏΠΎΡΠ²Π»ΡΡŽΡ‚ΡΡ ΠΏΡ€ΠΈ Π½Π°Π²Π΅Π΄Π΅Π½ΠΈΠΈ ΠΌΡ‹ΡˆΠΈ ΠΏΡ€ΠΈ просмотрС Π½Π°Π±ΠΎΡ€Π° ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ, Π±ΡƒΠ΄ΡƒΡ‚ всСгода Π²ΠΈΠ΄ΠΈΠΌΡ‹ Π½Π° устройствах с ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΊΠΎΠΉ сСнсорного Π²Π²ΠΎΠ΄Π°

  • fadeDuration
    По ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ:
    500

    ВрСмя, Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎΠ΅ для исчСзновСния ΠΊΠΎΠ½Ρ‚Π΅ΠΉΠ½Π΅Ρ€Π°, Π² миллисСкундах.

  • fitImagesInViewport
    По ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ:
    true

    Если true, Ρ‚ΠΎ ΠΏΡ€ΠΎΠΏΠΎΡ€Ρ†ΠΈΠΎΠ½Π°Π»ΡŒΠ½ΠΎ ΡƒΠΌΠ΅Π½ΡŒΡˆΠ°Π΅ΠΌ Ρ€Π°Π·ΠΌΠ΅Ρ€ изобраТСния Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠ° ΠΏΠΎΠΌΠ΅ΡΡ‚ΠΈΠ»ΠΎΡΡŒ Π² области просмотра. Π­Ρ‚ΠΎ избавляСт ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»Ρ ΠΎΡ‚ нСобходимости ΡΠΊΡ€ΠΎΠ»Π»ΠΈΡ‚ΡŒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ всС ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅.

  • maxWidth

    Если Π·Π°Π΄Π°Π½ΠΎ, высота изобраТСния Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΠ³Ρ€Π°Π½ΠΈΡ‡Π΅Π½Π° этим Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ΠΌ (Π² пиксСлях). Π‘ΠΎΠΎΡ‚Π½ΠΎΡˆΠ΅Π½ΠΈΠ΅ сторон Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ ΡΠΎΠ±Π»ΡŽΠ΄Π°Ρ‚ΡŒΡΡ.

  • maxHeight

    Если Π·Π°Π΄Π°Π½ΠΎ, ΡˆΠΈΡ€ΠΈΠ½Π° изобраТСния Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΠ³Ρ€Π°Π½ΠΈΡ‡Π΅Π½Π° этим Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ΠΌ (Π² пиксСлях). Π‘ΠΎΠΎΡ‚Π½ΠΎΡˆΠ΅Π½ΠΈΠ΅ сторон Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ ΡΠΎΠ±Π»ΡŽΠ΄Π°Ρ‚ΡŒΡΡ.

  • positionFromTop
    По ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ:
    50

    РасстояниС ΠΎΡ‚ Π²Π΅Ρ€Ρ…Π½Π΅ΠΉ части ΠΎΠΊΠ½Π° просмотра Π΄ΠΎ Lightbox-ΠΊΠΎΠ½Ρ‚Π΅ΠΉΠ½Π΅Ρ€Π° (Π² пиксСлях).

  • resizeDuration
    По ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ:
    700

    ВрСмя, Π² Ρ‚Π΅Ρ‡Π΅Π½ΠΈΠ΅ ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ³ΠΎ Lightbox-ΠΊΠΎΠ½Ρ‚Π΅ΠΉΠ½Π΅Ρ€ Π±ΡƒΠ΄Π΅Ρ‚ ΠΈΠ·ΠΌΠ΅Π½ΡΡ‚ΡŒ свою ΡˆΠΈΡ€ΠΈΠ½Ρƒ ΠΈ высоту ΠΏΡ€ΠΈ смСнС ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ Ρ€Π°Π·Π½ΠΎΠ³ΠΎ Ρ€Π°Π·ΠΌΠ΅Ρ€Π° (Π² миллисСкундах).

  • showImageNumberLabel
    По ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ:
    true

    Если false, Π² тСкст Π±ΡƒΠ΄Π΅Ρ‚ ΡƒΠΊΠ°Π·Ρ‹Π²Π°Ρ‚ΡŒΡΡ Ρ‚Π΅ΠΊΡƒΡ‰ΠΈΠΉ Π½ΠΎΠΌΠ΅Ρ€ изобраТСния ΠΈ ΠΎΠ±Ρ‰Π΅Π΅ количСство ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ Π² Π½Π°Π±ΠΎΡ€Π΅, Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€: «Π˜Π·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ 2 ΠΈΠ· 4».

  • wrapAround
    По ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ:
    false

    Если true, Ρ‚ΠΎ ΠΏΡ€ΠΈ ΠΏΠΎΠΊΠ°Π·Π΅ послСднСго изобраТСния ΠΊΠ½ΠΎΠΏΠΊΠ° для ΠΏΠΎΠΊΠ°Π·Π° ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅Π³ΠΎ изобраТСния Π½Π΅ исчСзаСт. НаТатиС Π½Π° Π½Π΅Π΅ ΠΏΡ€ΠΈΠ²Π΅Π΄Π΅Ρ‚ ΠΊ ΠΏΠΎΠΊΠ°Π·Ρƒ ΠΏΠ΅Ρ€Π²ΠΎΠ³ΠΎ изобраТСния.

6 ΠΏΡ€ΠΈΠΌΠ΅Ρ€ΠΎΠ² Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰ΠΈΡ… ΠΎΠΊΠΎΠ½ с лайтбоксом (ΠΈ ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ свой собствСнный)

Π§Π΅ΠΌΡƒ Π±Ρ€Π΅Π½Π΄Ρ‹ элСктронной ΠΊΠΎΠΌΠΌΠ΅Ρ€Ρ†ΠΈΠΈ ΠΌΠΎΠ³ΡƒΡ‚ Π½Π°ΡƒΡ‡ΠΈΡ‚ΡŒΡΡ благодаря Ρ†Π΅Π»Π΅Π½Π°ΠΏΡ€Π°Π²Π»Π΅Π½Π½ΠΎΠΌΡƒ Π²Ρ‹Π±ΠΎΡ€Ρƒ Π΄ΠΈΠ·Π°ΠΉΠ½Π° ΠΊΠ°Π·ΠΈΠ½ΠΎ Лас-ВСгаса? ΠŸΠΎΠ»ΡƒΡ‡Π°Π΅Ρ‚ΡΡ ΠΌΠ½ΠΎΠ³ΠΎ.

Если Π²Ρ‹ ΠΊΠΎΠ³Π΄Π°-Π»ΠΈΠ±ΠΎ Π±Ρ‹Π»ΠΈ Π² ΠΊΠ°Π·ΠΈΠ½ΠΎ ВСгаса, Ρ‚ΠΎ Π·Π½Π°Π΅Ρ‚Π΅, Ρ‡Ρ‚ΠΎ ΠΎΠ½ΠΈ состоят ΠΈΠ· гигантского Π»Π°Π±ΠΈΡ€ΠΈΠ½Ρ‚Π° с ΠΌΠΈΠ½ΠΈΠΌΡƒΠΌΠΎΠΌ вывСсок, нСсколькими ΠΎΠΊΠ½Π°ΠΌΠΈ ΠΈΠ»ΠΈ Π±Π΅Π· Π½ΠΈΡ… ΠΈ Π±Π΅Π· часов Π² ΠΏΠΎΠ»Π΅ зрСния. Π­Ρ‚ΠΎΡ‚ Π²Ρ‹Π±ΠΎΡ€ Π΄ΠΈΠ·Π°ΠΉΠ½Π° являСтся ΠΏΡ€Π΅Π΄Π½Π°ΠΌΠ΅Ρ€Π΅Π½Π½Ρ‹ΠΌ, ΠΏΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ ΠΎΠ½ сосрСдоточСн Π½Π° устранСнии Π»ΡŽΠ±Ρ‹Ρ… ΠΎΡ‚Π²Π»Π΅ΠΊΠ°ΡŽΡ‰ΠΈΡ… Ρ„Π°ΠΊΡ‚ΠΎΡ€ΠΎΠ² ΠΈ Π½Π° Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΈΠ³Ρ€ΠΎΠΊΠΈ Π² ΠΊΠ°Π·ΠΈΠ½ΠΎ Ρ‚Ρ€Π°Ρ‚ΠΈΠ»ΠΈ большС Π΄Π΅Π½Π΅Π³.

ИспользованиС Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π³ΠΎ ΠΎΠΊΠ½Π° лайтбокса Π½Π° вашСм Π²Π΅Π±-сайтС элСктронной ΠΊΠΎΠΌΠΌΠ΅Ρ€Ρ†ΠΈΠΈ Π΄Π΅Π»Π°Π΅Ρ‚ Ρ‚ΠΎ ΠΆΠ΅ самоС, Π½ΠΎ Π² мСньшСм ΠΌΠ°ΡΡˆΡ‚Π°Π±Π΅. Они:

  1. ΠœΠΈΠ½ΠΈΠΌΠΈΠ·ΠΈΡ€ΡƒΠΉΡ‚Π΅ ΠΈ Π·Π°Ρ‚Π΅Π½ΠΈΡ‚Π΅ всС ΠΎΡ‚Π²Π»Π΅ΠΊΠ°ΡŽΡ‰ΠΈΠ΅ Ρ„Π°ΠΊΡ‚ΠΎΡ€Ρ‹
  2. ΠŸΡ€ΠΈΠ²Π»Π΅ΠΊΠΈΡ‚Π΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ Π²Π°ΡˆΠΈΡ… ΠΏΠΎΠΊΡƒΠΏΠ°Ρ‚Π΅Π»Π΅ΠΉ ΠΊ Ρ‚ΠΎΠΌΡƒ, Ρ‡Ρ‚ΠΎ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ½ΠΈ сдСлали

ΠΏΡ€Π°ΠΊΡ‚ΠΈΠΊΠΈ, Π° Ρ‚Π°ΠΊΠΆΠ΅ ΡˆΠ΅ΡΡ‚ΡŒ качСствСнных ΠΏΡ€ΠΈΠΌΠ΅Ρ€ΠΎΠ² Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰ΠΈΡ… ΠΎΠΊΠΎΠ½ с лайтбоксами, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ для вдохновСния. Π—Π°Ρ‚Π΅ΠΌ ΠΌΡ‹ Π΄ΠΎΠ±Π°Π²ΠΈΠΌ нСсколько настраиваСмых шаблонов, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ быстро ΠΏΡ€ΠΈΡΡ‚ΡƒΠΏΠΈΡ‚ΡŒ ΠΊ Ρ€Π°Π±ΠΎΡ‚Π΅.

Π§Ρ‚ΠΎ Ρ‚Π°ΠΊΠΎΠ΅ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ лайтбокса?

Π’ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ лайтбокса β€” это Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ ΠΈΠ»ΠΈ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΏΠ΅Ρ€Π΅ΠΊΡ€Ρ‹Π²Π°Π΅Ρ‚ Ρ‡Π°ΡΡ‚ΡŒ экрана (ΠΎΠ±Ρ‹Ρ‡Π½ΠΎ сСрСдину), оставляя всС ΠΎΡΡ‚Π°Π»ΡŒΠ½ΠΎΠ΅ Π½Π΅ Π² фокусС ΠΈ/ΠΈΠ»ΠΈ Π½Π΅Π°ΠΊΡ‚ΠΈΠ²Π½Ρ‹ΠΌ. Π­Ρ‚ΠΎ способ ΠΏΠ΅Ρ€Π΅Π½Π°ΠΏΡ€Π°Π²ΠΈΡ‚ΡŒ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ людСй Π½Π° ΠΊΠΎΠ½ΠΊΡ€Π΅Ρ‚Π½Ρ‹ΠΉ ΠΏΡ€ΠΈΠ·Ρ‹Π² ΠΊ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡŽ, Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€ Π½Π° скидку, Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Π΅/пСрСкрСстныС ΠΏΡ€ΠΎΠ΄Π°ΠΆΠΈ, запуск ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Π°, Π²Π΅Π±ΠΈΠ½Π°Ρ€ ΠΈ Ρ‚.Β Π΄. ΠΊΠ°ΠΊ гангстСры, ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒΡΡ, Ρ‡Ρ‚ΠΎ Π²Ρ‹ сорвали Π΄ΠΆΠ΅ΠΊ-ΠΏΠΎΡ‚.

ΠœΠΎΠΆΠ΅Ρ‚ Π²ΠΎΠ·Π½ΠΈΠΊΠ½ΡƒΡ‚ΡŒ соблазн постоянно ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΈΡ… Π²Π΅Π·Π΄Π΅ ΠΈ всСгда. Но, ΠΊΠ°ΠΊ ΠΏΡ€Π°Π²ΠΈΠ»ΠΎ, это плохая идСя, ΠΏΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ ΠΏΠ»ΠΎΡ…ΠΎ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½Π½ΠΎΠ΅ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ являСтся ΠΎΠ΄Π½ΠΈΠΌ ΠΈΠ· самых Π±ΠΎΠ»ΡŒΡˆΠΈΡ… ΠΎΠ±ΠΎΡ€ΠΎΡ‚ΠΎΠ² UX сайта для посСтитСлСй.

Π’ΠΎΡ‚ нСсколько ΠΏΠ΅Ρ€Π΅Π΄ΠΎΠ²Ρ‹Ρ… ΠΌΠ΅Ρ‚ΠΎΠ΄ΠΎΠ², ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΌ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠ»Π΅Π΄ΠΎΠ²Π°Ρ‚ΡŒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ±Π΅Π΄ΠΈΡ‚ΡŒΡΡ, Ρ‡Ρ‚ΠΎ ваши Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰ΠΈΠ΅ ΠΎΠΊΠ½Π° ΠΊΠΎΠ½Π²Π΅Ρ€Ρ‚ΠΈΡ€ΡƒΡŽΡ‚ΡΡ, Π½Π΅ отталкивая всСх Π²Π°ΡˆΠΈΡ… ΠΏΠΎΡ‚Π΅Π½Ρ†ΠΈΠ°Π»ΡŒΠ½Ρ‹Ρ… ΠΊΠ»ΠΈΠ΅Π½Ρ‚ΠΎΠ²:

  • Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ ΠΏΡ€ΠΈΠ²Π»Π΅ΠΊΠ°Ρ‚Π΅Π»ΡŒΠ½ΠΎΠ΅ ΠΏΡ€Π΅Π΄Π»ΠΎΠΆΠ΅Π½ΠΈΠ΅ . Π’Π°ΡˆΠ΅ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ с лайтбоксом ΠΎΠ±Ρ€Π΅Ρ‡Π΅Π½ΠΎ с самого Π½Π°Ρ‡Π°Π»Π°, Ссли вашС ΠΏΡ€Π΅Π΄Π»ΠΎΠΆΠ΅Π½ΠΈΠ΅ Π½Π΅ Π°ΠΊΡ‚ΡƒΠ°Π»ΡŒΠ½ΠΎ ΠΈ Π½Π΅ соотвСтствуСт вашСй Ρ†Π΅Π»Π΅Π²ΠΎΠΉ Π°ΡƒΠ΄ΠΈΡ‚ΠΎΡ€ΠΈΠΈ.
  • Π‘Π΄Π΅Π»Π°ΠΉΡ‚Π΅ свой ΠΏΡ€ΠΈΠ·Ρ‹Π² ΠΊ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡŽ дСйствСнным ΠΈ ΠΊΠΎΠ½ΠΊΡ€Π΅Ρ‚Π½Ρ‹ΠΌ . Π­Ρ‚ΠΎ относится ΠΊΠΎ всСму Π² ΠΌΠ°Ρ€ΠΊΠ΅Ρ‚ΠΈΠ½Π³Π΅, Π° Π½Π΅ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΊ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰ΠΈΠΌ ΠΎΠΊΠ½Π°ΠΌ. Π§Π΅ΠΌ ΠΏΡ€ΠΎΡ‰Π΅ Π²Ρ‹ сдСлаСтС для ΠΊΠΎΠ³ΠΎ-Ρ‚ΠΎ ΠΆΠ΅Π»Π°Π΅ΠΌΠΎΠ΅ дСйствиС, Ρ‚Π΅ΠΌ большС Π²Π΅Ρ€ΠΎΡΡ‚Π½ΠΎΡΡ‚ΡŒ, Ρ‡Ρ‚ΠΎ ΠΎΠ½ это сдСлаСт.
  • ΠΠ°ΡΡ‚Ρ€ΠΎΠΈΡ‚ΡŒ ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½Ρ‹Π΅ Ρ‚Ρ€ΠΈΠ³Π³Π΅Ρ€Ρ‹ . Π”Π΅Π»ΠΎ Π½Π΅ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π² ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎΠΌ ΠΏΡ€Π΅Π΄Π»ΠΎΠΆΠ΅Π½ΠΈΠΈ. Π­Ρ‚ΠΎ Ρ‚Π°ΠΊΠΆΠ΅ ΠΎ ΠΏΠΎΠΊΠ°Π·Π΅ Π΅Π³ΠΎ Π² Π½ΡƒΠΆΠ½ΠΎΠ΅ врСмя. Π’Π°ΠΊΠΈΠΌ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ, Π²Ρ‹ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Π΄ΡƒΠΌΠ°Ρ‚ΡŒ ΠΎ Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒ Π΅Π³ΠΎ Π½Π΅ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π½Π° Π½ΡƒΠΆΠ½Ρ‹Ρ… страницах, Π½ΠΎ ΠΈ ΡƒΡ‡ΠΈΡ‚Ρ‹Π²Π°Ρ‚ΡŒ ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎΠ΅ врСмя ΠΈ Π³Π»ΡƒΠ±ΠΈΠ½Ρƒ ΠΏΡ€ΠΎΠΊΡ€ΡƒΡ‚ΠΊΠΈ.
  • Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π΄ΠΈΠ·Π°ΠΉΠ½ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π³ΠΎ ΠΎΠΊΠ½Π° Π»ΡƒΡ‡ΡˆΠΈΠ΅ ΠΏΡ€Π°ΠΊΡ‚ΠΈΠΊΠΈ . Π’ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ с лайтбоксом Π΄ΠΎΠ»ΠΆΠ½ΠΎ Π²Ρ‹Π΄Π΅Π»ΡΡ‚ΡŒΡΡ ΠΈ ΠΏΡ€ΠΈΠ²Π»Π΅ΠΊΠ°Ρ‚ΡŒ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ посСтитСлСй.
  • Π£Π±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ вашС Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ Ρ…ΠΎΡ€ΠΎΡˆΠΎ Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ Π½Π° смартфонах . На Π΄Π²ΠΎΡ€Π΅ 2022 Π³ΠΎΠ΄, ΠΈ Π±ΠΎΠ»ΡŒΡˆΠΈΠ½ΡΡ‚Π²ΠΎ людСй Π½Π°Ρ‡ΠΈΠ½Π°ΡŽΡ‚ поиск со смартфона. Π’ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, Π²Ρ‹ Π·Π°Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π»ΠΈΠ±ΠΎ ΠΎΡ‚ΠΊΠ»ΡŽΡ‡ΠΈΡ‚ΡŒ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ лайтбокса Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡŒΠ½Ρ‹Ρ… устройствах, Π»ΠΈΠ±ΠΎ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Ρ‚Π°ΠΊ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΅Π³ΠΎ Π±Ρ‹Π»ΠΎ Π»Π΅Π³ΠΊΠΎ Ρ‰Π΅Π»ΠΊΠ½ΡƒΡ‚ΡŒ ΠΈΠ»ΠΈ ΡƒΠ΄Π°Π»ΠΈΡ‚ΡŒ.
  • ВстрСчайтС своих посСтитСлСй Ρ‚Π°ΠΌ, Π³Π΄Π΅ ΠΎΠ½ΠΈ Π΅ΡΡ‚ΡŒ . ΠŸΠΎΠ΄ΡƒΠΌΠ°ΠΉΡ‚Π΅ ΠΎ контСкстС прСдлоТСния. НапримСр, Ссли ΠΊΡ‚ΠΎ-Ρ‚ΠΎ Ρ‡ΠΈΡ‚Π°Π΅Ρ‚ пост Π² Π±Π»ΠΎΠ³Π΅, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ находится Π½Π° Π²Π΅Ρ€ΡˆΠΈΠ½Π΅ Π²ΠΎΡ€ΠΎΠ½ΠΊΠΈ, ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ Π±ΠΎΠ»Π΅Π΅ эффСктивным ΠΎΡ‚ΠΎΠ±Ρ€Π°Π·ΠΈΡ‚ΡŒ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ лайтбокса Π² ΠΊΠΎΠ½Ρ†Π΅ ΡΡ‚Π°Ρ‚ΡŒΠΈ с ΠΏΡ€ΠΈΠ·Ρ‹Π²ΠΎΠΌ ΠΊ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡŽ для Π·Π°Π³Ρ€ΡƒΠ·ΠΊΠΈ элСктронной ΠΊΠ½ΠΈΠ³ΠΈ ΠΏΠΎ этой Ρ‚Π΅ΠΌΠ΅, Π° Π½Π΅ ΠΏΡ‹Ρ‚Π°Ρ‚ΡŒΡΡ ΠΏΡ€ΠΎΠ΄Π°Ρ‚ΡŒ Π΅Π΅ Π½Π° ваш ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚ ΠΈΠ»ΠΈ услугу прямо сСйчас. ‍
  • НС пСрСусСрдствуйтС . ΠŸΠΎΠΏΠ°ΠΏΡ‹ Ρ€Π°Π±ΠΎΡ‚Π°ΡŽΡ‚, Π½ΠΎ Π½Π΅ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ Π·Π° счСт UX сайта, особСнно Π½Π° смартфонах. Π­Ρ‚ΠΎ ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΠΎΠ²Ρ€Π΅Π΄ΠΈΡ‚ΡŒ Ρ€Π΅ΠΏΡƒΡ‚Π°Ρ†ΠΈΠΈ вашСго Π±Ρ€Π΅Π½Π΄Π° ΠΈ Π·Π°ΡΡ‚Π°Π²ΠΈΡ‚ΡŒ вас Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ отчаянно.

Часто ΠΏΡ€ΠΎΡ‰Π΅ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ собствСнныС Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰ΠΈΠ΅ ΠΎΠΊΠ½Π° с лайтбоксами, Ссли Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π²ΠΈΠ΄Π΅Ρ‚ΡŒ ΠΈ Π²Π΄ΠΎΡ…Π½ΠΎΠ²Π»ΡΡ‚ΡŒΡΡ Π΄Ρ€ΡƒΠ³ΠΈΠΌΠΈ.

Π’ΠΎΡ‚ ΡˆΠ΅ΡΡ‚ΡŒ ΠΎΡ‚Π»ΠΈΡ‡Π½Ρ‹Ρ… ΠΏΡ€ΠΈΠΌΠ΅Ρ€ΠΎΠ², Π½Π° ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΡƒΡ‡ΠΈΡ‚ΡŒΡΡ. Π§ΠΈΡ‚Π°ΠΉΡ‚Π΅ дальшС для Ρ€Π°Π·Π±ΠΈΠ²ΠΊΠΈ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ.

1. Π’ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ лайтбокса Tipsy Elves

Tipsy Elves β€” компания ΠΏΠΎ производству ΠΎΠ΄Π΅ΠΆΠ΄Ρ‹, ориСнтированная Π² ΠΏΠ΅Ρ€Π²ΡƒΡŽ ΠΎΡ‡Π΅Ρ€Π΅Π΄ΡŒ Π½Π° ΠΏΠΎΠΊΡƒΠΏΠ°Ρ‚Π΅Π»Π΅ΠΉ поколСния Z ΠΈ ΠΌΠΈΠ»Π»Π΅Π½ΠΈΠ°Π»ΠΎΠ². Π’ своих кампаниях Google Ad ΠΎΠ½ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ ΠΈΠ³Ρ€ΠΎΠ²ΠΎΠ΅ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ со скидкой Π½Π° своСй Ρ†Π΅Π»Π΅Π²ΠΎΠΉ страницС для привлСчСния Π½ΠΎΠ²Ρ‹Ρ… ΠΊΠ»ΠΈΠ΅Π½Ρ‚ΠΎΠ²:

Π‘ΠΌ. ΠΏΠΎΠ»Π½Ρ‹ΠΉ ΠΏΡ€ΠΈΠΌΠ΅Ρ€

ВсС Π² этой ΠΊΠΎΠ½Ρ†Π΅ΠΏΡ†ΠΈΠΈ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π³ΠΎ ΠΎΠΊΠ½Π° Ρ€Π΅Π°Π»ΠΈΠ·ΠΎΠ²Π°Π½ΠΎ Ρ…ΠΎΡ€ΠΎΡˆΠΎ. Π’ΠΎ-ΠΏΠ΅Ρ€Π²Ρ‹Ρ…, ΠΎΠ½ Π²Π΄ΠΎΡ…Π½ΠΎΠ²Π»Π΅Π½ ΠΈΠ³Ρ€ΠΎΠ²Ρ‹ΠΌΠΈ ΡˆΠΎΡƒ, Ρ‚Π°ΠΊΠΈΠΌΠΈ ΠΊΠ°ΠΊ «КолСсо Ρ„ΠΎΡ€Ρ‚ΡƒΠ½Ρ‹Β» ΠΈ Β«Π¦Π΅Π½Π° ΠΏΡ€Π°Π²Π°Β», ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΏΠΎΡ‡Ρ‚ΠΈ ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ амСриканский ΠΌΠΈΠ»Π»Π΅Π½ΠΈΠ°Π» ΠΈ Π΄Π΅Ρ‚ΠΈ ΡΡ‚Π°Ρ€ΡˆΠ΅Π³ΠΎ поколСния Z смотрСли, ΠΊΠΎΠ³Π΄Π° Π±ΠΎΠ»Π΅Π»ΠΈ послС ΡˆΠΊΠΎΠ»Ρ‹.

НС говоря ΡƒΠΆΠ΅ ΠΎ Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎ конкрСтная сумма скидки, ΠΊΠΎΡ‚ΠΎΡ€ΡƒΡŽ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π²Ρ‹ΠΈΠ³Ρ€Π°Ρ‚ΡŒ, Ρ‚Π°ΠΊΠΆΠ΅ Π·Π½Π°Ρ‡ΠΈΡ‚Π΅Π»ΡŒΠ½Π°.

МногиС ΠΈΠ½Ρ‚Π΅Ρ€Π½Π΅Ρ‚-ΠΌΠ°Π³Π°Π·ΠΈΠ½Ρ‹ Π΄Π΅Π»Π°ΡŽΡ‚ скидки слишком Π½ΠΈΠ·ΠΊΠΈΠΌΠΈ. ВсС Π±ΡƒΠ΄ΡƒΡ‚ Π½Π°ΠΆΠΈΠΌΠ°Ρ‚ΡŒ Β«XΒ», Ссли Π²Ρ‹ ΠΏΡ€Π΅Π΄Π»Π°Π³Π°Π΅Ρ‚Π΅ скидку 5%, ΠΊΠΎΠ³Π΄Π° срСдняя ΡΡ‚ΠΎΠΈΠΌΠΎΡΡ‚ΡŒ Π·Π°ΠΊΠ°Π·Π° составляСт 50 Π΄ΠΎΠ»Π»Π°Ρ€ΠΎΠ² ΠΈΠ»ΠΈ мСньшС. Π­Ρ‚ΠΎ скидка 2,50 Π΄ΠΎΠ»Π»Π°Ρ€Π°.

Однако, Ссли Π²Ρ‹ ΠΏΡ€Π΅Π΄Π»Π°Π³Π°Π΅Ρ‚Π΅ скидку Π΄ΠΎ 20%, ΠΊΠ°ΠΊ Ρ‚ΠΎ, Ρ‡Ρ‚ΠΎ Π΄Π΅Π»Π°ΡŽΡ‚ Tipsy Elves, скидка 20% Π½Π° ΠΏΡ€Π΅Π΄ΠΌΠ΅Ρ‚ ΡΡ‚ΠΎΠΈΠΌΠΎΡΡ‚ΡŒΡŽ 50 Π΄ΠΎΠ»Π»Π°Ρ€ΠΎΠ² ΠΎΠ·Π½Π°Ρ‡Π°Π΅Ρ‚ скидку 10 Π΄ΠΎΠ»Π»Π°Ρ€ΠΎΠ² β€” Π³ΠΎΡ€Π°Π·Π΄ΠΎ Π±ΠΎΠ»Π΅Π΅ Π·Π°ΠΌΠ°Π½Ρ‡ΠΈΠ²ΠΎ!

2. Π’ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ с ΠΏΡ€Π΅Π΄Π»ΠΎΠΆΠ΅Π½ΠΈΠ΅ΠΌ скидки AutoAnything

НС всСм компаниям Π½ΡƒΠΆΠ½ΠΎ Π³Π΅ΠΉΠΌΠΈΡ„ΠΈΡ†ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ свои скидки. AutoAnything β€” Ρ…ΠΎΡ€ΠΎΡˆΠΈΠΉ Ρ‚ΠΎΠΌΡƒ ΠΏΡ€ΠΈΠΌΠ΅Ρ€. Они ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ с лайтбоксом, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€ΠΈΠ²Π»Π΅Ρ‡ΡŒ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ ΠΊ своим «самым горячим прСдлоТСниям».

Π‘ΠΌ. ΠΏΠΎΠ»Π½Ρ‹ΠΉ ΠΏΡ€ΠΈΠΌΠ΅Ρ€

Компания Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ стимулируСт людСй ΠΏΠΎΠ΄ΠΏΠΈΡΠ°Ρ‚ΡŒΡΡ Π½Π° рассылку, прСдлагая 15% скидку Π½Π° ΠΏΠ΅Ρ€Π²Ρ‹ΠΉ Π·Π°ΠΊΠ°Π·. (ΠžΠΏΡΡ‚ΡŒ ΠΆΠ΅, это значимая сумма скидки!)

Π’Π°ΠΊΠΆΠ΅ Π΅ΡΡ‚ΡŒ большая синяя ΠΊΠ½ΠΎΠΏΠΊΠ° ΠΏΡ€ΠΈΠ·Ρ‹Π²Π° ΠΊ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡŽ с тСкстом Β«ΠŸΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ ΠΌΠΎΠΈ сбСрСТСния», которая выдСляСтся ΠΈ ΠΎΡ€ΠΈΠ΅Π½Ρ‚ΠΈΡ€ΠΎΠ²Π°Π½Π° Π½Π° Π²Ρ‹Π³ΠΎΠ΄Ρƒ β€” Π³ΠΎΡ€Π°Π·Π΄ΠΎ Π±ΠΎΠ»Π΅Π΅ Π·Π°ΠΌΠ°Π½Ρ‡ΠΈΠ²ΠΎ, Ρ‡Π΅ΠΌ простая ΠΊΠ½ΠΎΠΏΠΊΠ° Β«ΠŸΠΎΠ΄ΠΏΠΈΡΠ°Ρ‚ΡŒΡΡΒ».

Они Π΄Π΅Π»Π°ΡŽΡ‚ это ΠΏΡ€Π΅Π΄Π»ΠΎΠΆΠ΅Π½ΠΈΠ΅ Π΅Ρ‰Π΅ Π±ΠΎΠ»Π΅Π΅ ΠΏΡ€ΠΈΠ²Π»Π΅ΠΊΠ°Ρ‚Π΅Π»ΡŒΠ½Ρ‹ΠΌ, прСдлагая Π³Π°Ρ€Π°Π½Ρ‚ΠΈΡŽ Π² Ρ„ΠΎΡ€ΠΌΠ΅: «ΠŸΠΎΡΠ»Π΅ ΠΏΠΎΠΊΡƒΠΏΠΊΠΈ Π²Ρ‹ Π½Π°ΠΉΠ΄Π΅Ρ‚Π΅ Ρ‚ΠΎΠ²Π°Ρ€ ΠΏΠΎ Π±ΠΎΠ»Π΅Π΅ Π½ΠΈΠ·ΠΊΠΎΠΉ Ρ†Π΅Π½Π΅. ΠœΡ‹ Π²Π΅Ρ€Π½Π΅ΠΌ Ρ€Π°Π·Π½ΠΈΡ†Ρƒ».

Π’Ρ‹ Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠΊΠ°Π·Π°Ρ‚ΡŒ, Ρ‡Ρ‚ΠΎ эта компания Π·Π½Π°Π΅Ρ‚ свои Ρ†ΠΈΡ„Ρ€Ρ‹, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ ΠΎΠ½ΠΈ Π²ΠΊΠ»ΡŽΡ‡Π°ΡŽΡ‚ Π² сСбя ΠΌΠΈΠ½ΠΈΠΌΡƒΠΌ Π·Π°ΠΊΠ°Π·Π°. Π’ΠΊΠ»ΡŽΡ‡Π°Ρ скидку 15% для Π·Π°ΠΊΠ°Π·ΠΎΠ² Π½Π° сумму Π±ΠΎΠ»Π΅Π΅ 99 Π΄ΠΎΠ»Π»Π°Ρ€ΠΎΠ², это Π³Π°Ρ€Π°Π½Ρ‚ΠΈΡ€ΡƒΠ΅Ρ‚, Ρ‡Ρ‚ΠΎ ΠΌΠ°Ρ‚Π΅ΠΌΠ°Ρ‚ΠΈΠΊΠ° подтвСрдится.

ΠŸΠžΠ‘ΠœΠžΠ’Π Π•Π’Π¬ Π‘ΠžΠ›Π¬Π¨Π•: Как ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ ΠΏΡ€ΠΈΠ²Π»Π΅ΠΊΠ°Ρ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ (ΠΈ Π²Ρ‹Π³ΠΎΠ΄Π½Ρ‹Π΅) прСдлоТСния, ΠΏΠ΅Ρ€Π΅Π΄ ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΌΠΈ Π½Π΅ смогут ΡƒΡΡ‚ΠΎΡΡ‚ΡŒ посСтитСли вашСго Π²Π΅Π±-сайта просто Π΅Ρ‰Π΅ ΠΎΠ΄Π½ΠΎ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ со скидкой 15%.

Однако ΠΌΡ‹ просматривали этот сайт Π·Π° нСдСлю Π΄ΠΎ Дня ΠΌΠ°Ρ‚Π΅Ρ€ΠΈ Π² БША. И это ΠΊΠΎΠ½ΠΊΡ€Π΅Ρ‚Π½ΠΎΠ΅ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ отобраТаСтся Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π½Π° Ρ†Π΅Π»Π΅Π²Ρ‹Ρ… страницах ΠΊΠ°ΠΌΠΏΠ°Π½ΠΈΠΈ, посвящСнной Π”Π½ΡŽ ΠΌΠ°Ρ‚Π΅Ρ€ΠΈ:

Π‘ΠΌ. ΠΏΠΎΠ»Π½Ρ‹ΠΉ ΠΏΡ€ΠΈΠΌΠ΅Ρ€

Копия ΠΈ Π΄ΠΈΠ·Π°ΠΉΠ½ Π½Π΅ относятся ΠΊ Π”Π½ΡŽ ΠΌΠ°Ρ‚Π΅Ρ€ΠΈ. На самом Π΄Π΅Π»Π΅, я ΠΏΠΎΠ΄ΠΎΠ·Ρ€Π΅Π²Π°ΡŽ, Ρ‡Ρ‚ΠΎ ΠΎΠ½ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ это Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ для Π΄Ρ€ΡƒΠ³ΠΈΡ… Π²Π°ΠΆΠ½Ρ‹Ρ… Π΄Π°Ρ‚, событий ΠΈ ΠΏΡ€Π°Π·Π΄Π½ΠΈΠΊΠΎΠ².

Но ΠΎΠ½ ΠΏΠΎ-ΠΏΡ€Π΅ΠΆΠ½Π΅ΠΌΡƒ Ρ…ΠΎΡ€ΠΎΡˆΠΎ Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚, учитывая контСкст, Π³Π΄Π΅ ΠΈ ΠΊΠΎΠ³Π΄Π° ΠΎΠ½ отобраТаСтся Π½Π° Π²Π΅Π±-сайтС.

4. ΠŸΡ€ΠΈΠΌΠ΅Ρ€ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π³ΠΎ ΠΎΠΊΠ½Π° бСсплатной доставки Yeti

Π‘ΠΊΠΈΠ΄ΠΊΠΈ β€” самыС популярныС Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰ΠΈΠ΅ ΠΎΠΊΠ½Π°. Однако, Ссли ΠΈΠΌΠΈ Π·Π»ΠΎΡƒΠΏΠΎΡ‚Ρ€Π΅Π±Π»ΡΡ‚ΡŒ (ΠΈΠ»ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π½Π΅ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎ), ΠΎΠ½ΠΈ Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠ³ΡƒΡ‚ ΡƒΠ΄Π΅ΡˆΠ΅Π²ΠΈΡ‚ΡŒ ваш Π±Ρ€Π΅Π½Π΄ ΠΈ ΠΏΠΎΠ΄ΡΠΎΠ·Π½Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎ ΠΏΡ€ΠΈΡƒΡ‡ΠΈΡ‚ΡŒ Π²Π°ΡˆΠΈΡ… ΠΊΠ»ΠΈΠ΅Π½Ρ‚ΠΎΠ² ΠΏΠΎΠΊΡƒΠΏΠ°Ρ‚ΡŒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Ρ‚ΠΎΠ³Π΄Π°, ΠΊΠΎΠ³Π΄Π° ΠΎΠ½ΠΈ увидят скидку.

Π’ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ с бСсплатной доставкой, ΠΏΠΎΡ…ΠΎΠΆΠ΅Π΅ Π½Π° Ρ‚ΠΎ, Ρ‡Ρ‚ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ Yeti, ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ эффСктивной Π°Π»ΡŒΡ‚Π΅Ρ€Π½Π°Ρ‚ΠΈΠ²ΠΎΠΉ:

Π‘ΠΌ. ΠΏΠΎΠ»Π½Ρ‹ΠΉ ΠΏΡ€ΠΈΠΌΠ΅Ρ€

Π’ΠΎ-ΠΏΠ΅Ρ€Π²Ρ‹Ρ…, Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ с бСсплатной доставкой Yeti соотвСтствуСт Π±Ρ€Π΅Π½Π΄Ρƒ ΠΈ Ρ…ΠΎΡ€ΠΎΡˆΠΎ спроСктировано. Π­Ρ‚ΠΎ Π±Ρ€Π΅Π½Π΄ для Π°ΠΊΡ‚ΠΈΠ²Π½ΠΎΠ³ΠΎ ΠΎΡ‚Π΄Ρ‹Ρ…Π°, ΠΈ ΠΎΠ½ отраТаСтся Π²ΠΎ всСм, ΠΎΡ‚ Ρ„ΠΎΠ½Π° Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π³ΠΎ ΠΎΠΊΠ½Π° Π΄ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅ΠΌΠΎΠΉ ΠΊΠΎΠΏΠΈΠΈ.

CTA Ρ‚Π°ΠΊΠΆΠ΅ прост. Они Π½Π΅ ΠΏΡ‹Ρ‚Π°ΡŽΡ‚ΡΡ ΠΎΠ±ΠΌΠ°Π½ΡƒΡ‚ΡŒ вас ΠΈΠ»ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ пассивно-агрСссивный тСкст, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π·Π°ΡΡ‚Π°Π²ΠΈΡ‚ΡŒ вас Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ.

ВмСсто этого ΠΎΠ½ΠΈ просто ΡΠΏΡ€Π°ΡˆΠΈΠ²Π°ΡŽΡ‚, Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π»ΠΈ Π²Ρ‹ Π±Π΅ΡΠΏΠ»Π°Ρ‚Π½ΡƒΡŽ доставку, Π° Π·Π°Ρ‚Π΅ΠΌ Π²Π°ΠΌ просто Π½ΡƒΠΆΠ½ΠΎ Π½Π°ΠΆΠ°Ρ‚ΡŒ Β«Π΄Π°Β» ΠΈΠ»ΠΈ Β«Π½Π΅Ρ‚Β».

Π‘Π»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΉ шаг собираСт ΠΏΠΎΡ‡Ρ‚ΠΎΠ²Ρ‹ΠΉ индСкс, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ±Π΅Π΄ΠΈΡ‚ΡŒΡΡ, Ρ‡Ρ‚ΠΎ бСсплатная доставка доступна, Π° Ρ‚Π°ΠΊΠΆΠ΅ адрСс элСктронной ΠΏΠΎΡ‡Ρ‚Ρ‹ для привлСчСния ΠΏΠΎΡ‚Π΅Π½Ρ†ΠΈΠ°Π»ΡŒΠ½Ρ‹Ρ… ΠΊΠ»ΠΈΠ΅Π½Ρ‚ΠΎΠ²:

5.

Π’ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ с лайтбоксом для запуска ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Π° Tradlands

Tradlands, Π±ΡƒΡ‚ΠΈΠΊ ТСнской ΠΌΠΎΠ΄Ρ‹, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ это Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ с лайтбоксом ΠΏΡ€ΠΈΠ²Π»Π΅Ρ‡ΡŒ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ ΠΊ своСй Π½ΠΎΠ²ΠΎΠΉ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚ΠΎΠ²ΠΎΠΉ Π»ΠΈΠ½Π΅ΠΉΠΊΠ΅:

Π‘ΠΌ. ΠΏΠΎΠ»Π½Ρ‹ΠΉ ΠΏΡ€ΠΈΠΌΠ΅Ρ€

Π­Ρ‚ΠΎ простоС, Π½ΠΎ эффСктивноС Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ для запуска ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Π°. Никаких скидок, бСсплатной доставки ΠΈΠ»ΠΈ Π΄Ρ€ΡƒΠ³ΠΈΡ… Π΄Π΅Π½Π΅ΠΆΠ½Ρ‹Ρ… ΠΏΠΎΠΎΡ‰Ρ€Π΅Π½ΠΈΠΉ Π½Π΅ трСбуСтся.

ВСкст ΠΈ Π΄ΠΈΠ·Π°ΠΉΠ½ минималистичны, Π½ΠΎ эффСктивны. Π—Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ гласит: «Запуск ΠΌΠΈΠ½ΠΈ-капсулы».

Они Ρ‚Π°ΠΊΠΆΠ΅ Π²ΠΊΠ»ΡŽΡ‡Π°ΡŽΡ‚ Ρ„ΠΎΡ‚ΠΎΠ³Ρ€Π°Ρ„ΠΈΡŽ ΠΌΠΎΠ΄Π΅Π»ΠΈ Π² ΠΎΠ΄Π½ΠΎΠΌ ΠΈΠ· Π½ΠΎΠ²Ρ‹Ρ… ΠΎΠ±Ρ€Π°Π·ΠΎΠ² Π±Ρ€Π΅Π½Π΄Π°.

Π—Π°Ρ‚Π΅ΠΌ ΠΊΠ½ΠΎΠΏΠΊΠ° ΠΏΡ€ΠΈΠ·Ρ‹Π²Π° ΠΊ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡŽ β€” Β«Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π² капсулу», Ρ‡Ρ‚ΠΎ ΡƒΠΊΠ°Π·Ρ‹Π²Π°Π΅Ρ‚ Π½Π° запуск ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Π°.

Π‘ΠžΠ’Π•Π’ ΠŸΠ ΠžΠ€Π•Π‘Π‘Π˜ΠžΠΠΠ›Π:

Π‘ ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ ConvertFlow Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π½Π°Ρ†Π΅Π»ΠΈΠ²Π°Ρ‚ΡŒ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰ΠΈΠ΅ ΠΎΠΊΠ½Π° запуска ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Π° Π½Π° людСй, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π»ΠΈΠ±ΠΎ ΡƒΠΆΠ΅ ΠΊΡƒΠΏΠΈΠ»ΠΈ Ρƒ вас, Π»ΠΈΠ±ΠΎ ΡƒΠΆΠ΅ находятся Π² вашСм спискС. Π­Ρ‚ΠΎ позволяСт Π²Π°ΠΌ ΠΏΡ€ΠΎΠ΄Π²ΠΈΠ³Π°Ρ‚ΡŒ Π½ΠΎΠ²Ρ‹Π΅ Π»ΠΈΠ½Π΅ΠΉΠΊΠΈ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚ΠΎΠ² Ρ‚ΠΎΠ»ΡŒΠΊΠΎ для постоянных ΠΊΠΎΠ½Ρ‚Π°ΠΊΡ‚ΠΎΠ², ΠΏΡ€ΠΈ этом захватывая Π½ΠΎΠ²Ρ‹Ρ… посСтитСлСй Π² качСствС Π»ΠΈΠ΄ΠΎΠ² ΠΈ подписчиков:

Π£Π·Π½Π°ΠΉΡ‚Π΅ большС ΠΎ Ρ‚Π°Ρ€Π³Π΅Ρ‚ΠΈΠ½Π³Π΅ Π² ConvertFlow

6.

ΠŸΡ€ΠΈΠΌΠ΅Ρ€ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π³ΠΎ ΠΎΠΊΠ½Π° лайтбокса бСсплатной ΠΏΡ€ΠΎΠ±Π½ΠΎΠΉ вСрсии Sprout Social

Π­Ρ‚ΠΎΡ‚ ΠΏΡ€ΠΈΠΌΠ΅Ρ€ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π³ΠΎ ΠΎΠΊΠ½Π° лайтбокса ΠΎΡ‚ SproutSocial интСрСсСн ΠΏΠΎ Ρ†Π΅Π»ΠΎΠΌΡƒ ряду ΠΏΡ€ΠΈΡ‡ΠΈΠ½. Π’ΠΎ-ΠΏΠ΅Ρ€Π²Ρ‹Ρ…, это ΠΎΡ‚ ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠΈ SaaS, Π° Π½Π΅ ΠΎΡ‚ элСктронной ΠΊΠΎΠΌΠΌΠ΅Ρ€Ρ†ΠΈΠΈ.

Π­Ρ‚ΠΎ Ρ‚Π°ΠΊΠΆΠ΅ ΠΏΡ€ΠΎΡ‚ΠΈΠ²ΠΎΡ€Π΅Ρ‡ΠΈΡ‚ Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΌ ΠΏΡ€ΠΈΠ½Ρ†ΠΈΠΏΠ°ΠΌ Π΄ΠΈΠ·Π°ΠΉΠ½Π°, ΠΊΠΎΠ³Π΄Π° Π²Ρ‹ Π΄ΡƒΠΌΠ°Π΅Ρ‚Π΅ ΠΎ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰ΠΈΡ… ΠΎΠΊΠ½Π°Ρ… с лайтбоксами. Π‘ΠΎΠ»ΡŒΡˆΠΈΠ½ΡΡ‚Π²ΠΎ этих Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰ΠΈΡ… ΠΎΠΊΠΎΠ½ располоТСны спСрСди ΠΈ ΠΏΠΎ Ρ†Π΅Π½Ρ‚Ρ€Ρƒ, Ρ‚ΠΎΠ³Π΄Π° ΠΊΠ°ΠΊ этот ΠΏΡ€ΠΈΠΌΠ΅Ρ€ находится слСва:

Π‘ΠΌ. ΠΏΠΎΠ»Π½Ρ‹ΠΉ ΠΏΡ€ΠΈΠΌΠ΅Ρ€

Он Ρ‚Π°ΠΊΠΆΠ΅ Π·Π°Π½ΠΈΠΌΠ°Π΅Ρ‚ большС мСста Π½Π° экранС ΠΈ содСрТит большС тСкста, Ρ‡Π΅ΠΌ ΠΌΠ½ΠΎΠ³ΠΈΠ΅ Π΄Ρ€ΡƒΠ³ΠΈΠ΅ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Ρ‹, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΌΠΈ ΠΌΡ‹ подСлились.

Они ΠΏΡ€Π΅Π΄Π»Π°Π³Π°ΡŽΡ‚ Π½Π°Ρ‡Π°Ρ‚ΡŒ Π±Π΅ΡΠΏΠ»Π°Ρ‚Π½ΡƒΡŽ ΠΏΡ€ΠΎΠ±Π½ΡƒΡŽ Π²Π΅Ρ€ΡΠΈΡŽ. Они ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ Π±ΠΎΠ»Π΅Π΅ Π΄Π»ΠΈΠ½Π½Ρ‹ΠΉ ΠΏΠΎΠ΄Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ/описаниС, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠ΅Ρ€Π΅Π΄Π°Ρ‚ΡŒ прСимущСства опробования ΠΈΡ… ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠ½ΠΎΠ³ΠΎ обСспСчСния. Π—Π°Ρ‚Π΅ΠΌ Ρƒ Π½ΠΈΡ… Π΅ΡΡ‚ΡŒ большая зСлСная ΠΊΠ½ΠΎΠΏΠΊΠ° ΠΏΡ€ΠΈΠ·Ρ‹Π²Π° ΠΊ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡŽ с тСкстом Β«ΠΠ°Ρ‡Π°Ρ‚ΡŒ Π±Π΅ΡΠΏΠ»Π°Ρ‚Π½ΡƒΡŽ ΠΏΡ€ΠΎΠ±Π½ΡƒΡŽ Π²Π΅Ρ€ΡΠΈΡŽΒ», Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΅Ρ‰Π΅ большС ΠΏΠΎΠ±ΡƒΠ΄ΠΈΡ‚ΡŒ людСй ΠΊ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡŽ.

Π­Ρ‚ΠΎ ΠΎΡ‚Π»ΠΈΡ‡Π½Ρ‹ΠΉ ΠΏΡ€ΠΈΠΌΠ΅Ρ€ Ρ‚ΠΎΠ³ΠΎ, ΠΏΠΎΡ‡Π΅ΠΌΡƒ Π²Ρ‹ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΏΡ€ΠΈΠ½Ρ†ΠΈΠΏΡ‹ ΠΏΠ΅Ρ€Π΅Π΄ΠΎΠ²ΠΎΠ³ΠΎ ΠΎΠΏΡ‹Ρ‚Π° Π² качСствС ΠΎΡ€ΠΈΠ΅Π½Ρ‚ΠΈΡ€Π°, Π° Ρ‚Π°ΠΊΠΆΠ΅ ΠΏΡ€ΠΎΠ²Π΅Ρ€ΡΡ‚ΡŒ свои собствСнныС ΠΈΠ΄Π΅ΠΈ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ, Ρ‡Ρ‚ΠΎ Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ Π½Π° вашСм сайтС ΠΈ с вашСй Π°ΡƒΠ΄ΠΈΡ‚ΠΎΡ€ΠΈΠ΅ΠΉ πŸ’ͺ

Π“ΠΎΡ‚ΠΎΠ²Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ своС собствСнноС Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ ΠΎΠΊΠ½ΠΎ с лайтбоксом? ConvertFlow ΡƒΠΏΡ€ΠΎΡ‰Π°Π΅Ρ‚ этот процСсс.

На самом Π΄Π΅Π»Π΅, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ ΠΎΠ΄ΠΈΠ½ ΠΈΠ· сотСн Π³ΠΎΡ‚ΠΎΠ²Ρ‹Ρ… шаблонов Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰ΠΈΡ… ΠΎΠΊΠΎΠ½ ΠΈΠ»ΠΈ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ свой собствСнный Π΄ΠΈΠ·Π°ΠΉΠ½ с нуля. Π’Ρ‹ Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ ΠΎΠ΄ΠΈΠ½ ΠΈΠ· Π½Π΅ΡΠΊΠΎΠ»ΡŒΠΊΠΈΡ… Π²Π°Ρ€ΠΈΠ°Π½Ρ‚ΠΎΠ² Ρ‚Ρ€ΠΈΠ³Π³Π΅Ρ€Π° (Π½Π°ΠΌΠ΅Ρ€Π΅Π½ΠΈΠ΅ Π²Ρ‹Ρ…ΠΎΠ΄Π°, Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠ° ΠΏΠΎ Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ, Ρ‚ΠΎΡ‡ΠΊΠ° ΠΏΡ€ΠΎΠΊΡ€ΡƒΡ‚ΠΊΠΈ ΠΈ Ρ‚.Β Π΄.) ΠΈ Π½Π°ΡΡ‚Ρ€ΠΎΠΈΡ‚ΡŒ условия Ρ‚Π°Ρ€Π³Π΅Ρ‚ΠΈΠ½Π³Π°, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΊΠΎΠ½Ρ‚Ρ€ΠΎΠ»ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ, ΠΊΠΎΠ³Π΄Π° ΠΈ Π³Π΄Π΅ ΠΎΠ½ Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒΡΡ.

Π’ΠΎΡ‚ нСсколько шаблонов, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π½Π°Ρ‡Π°Ρ‚ΡŒ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ прямо сСйчас:

Об Π°Π²Ρ‚ΠΎΡ€Π΅

ДТСссика Малник

Автор, ConvertFlow

ДТСссика β€” ΠΊΠΎΠΏΠΈΡ€Π°ΠΉΡ‚Π΅Ρ€ ΠΈ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚-стратСг с Π±ΠΎΠ»Π΅Π΅ Ρ‡Π΅ΠΌ 10-Π»Π΅Ρ‚Π½ΠΈΠΌ ΠΎΠΏΡ‹Ρ‚ΠΎΠΌ Ρ€Π°Π±ΠΎΡ‚Ρ‹ Π² области SaaS-ΠΌΠ°Ρ€ΠΊΠ΅Ρ‚ΠΈΠ½Π³Π°. Π•Π΅ Ρ€Π°Π±ΠΎΡ‚Ρ‹ появлялись Π½Π° Π²Π΅Π΄ΡƒΡ‰ΠΈΡ… отраслСвых Π²Π΅Π±-сайтах, Ρ‚Π°ΠΊΠΈΡ… ΠΊΠ°ΠΊ Social Media Examiner, SEMRush, CMX, The Next Web, Databox, Help Scout, Convince &Β Convert ΠΈ Π΄Ρ€ΡƒΠ³ΠΈΡ…. Когда ΠΎΠ½Π° Π½Π΅ ΠΏΠΈΡˆΠ΅Ρ‚ Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ эпичСскоС, Π²Ρ‹ ΠΎΠ±Ρ‹Ρ‡Π½ΠΎ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ, ΠΊΠ°ΠΊ ΠΎΠ½Π° смотрит Β«ΠœΠ°ΡΡ‚Π΅Ρ€ Π¨Π΅Ρ„Β» ΠΈΠ»ΠΈ ΠΎΠ±ΡƒΡ‡Π°Π΅Ρ‚ людСй Π½Π° 9-ΠΌ ΠΊΠ°Π½Π°Π»Π΅.0s ΠΏΠΎΠΏ-ΠΊΡƒΠ»ΡŒΡ‚ΡƒΡ€Π° ΠΌΠ΅Π»ΠΎΡ‡ΠΈ.

Лайтбокс | Webflow University

Π”ΠΎΠΌΠ°ΡˆΠ½ΠΈΠΉ ΡƒΡ€ΠΎΠΊ

Лайтбокс

Π”ΠΎΠΌΠ°ΡˆΠ½ΠΈΠΉ ΡƒΡ€ΠΎΠΊ

ВсС ΡƒΡ€ΠΎΠΊΠΈ

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ элСмСнт лайтбокса для отобраТСния ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ ΠΈΠ»ΠΈ Π²ΠΈΠ΄Π΅ΠΎ Π² полноэкранном модальном ΠΎΠΊΠ½Π΅.

элСмСнта

Β 

Π£ этого Π²ΠΈΠ΄Π΅ΠΎ старый ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΈΠΉ интСрфСйс. Π‘ΠΊΠΎΡ€ΠΎ Π±ΡƒΠ΄Π΅Ρ‚ обновлСнная вСрсия!

Π­Π»Π΅ΠΌΠ΅Π½Ρ‚ лайтбокс ΠΏΠΎΠΊΠ°Π·Ρ‹Π²Π°Π΅Ρ‚ изобраТСния (с надписями ΠΈΠ»ΠΈ Π±Π΅Π·) ΠΈΠ»ΠΈ Π²ΠΈΠ΄Π΅ΠΎ Π² полноэкранном модальном ΠΎΠΊΠ½Π΅ слайд-ΡˆΠΎΡƒ. Лайтбоксы Ρ‚Π°ΠΊΠΆΠ΅ Ρ€Π΅Π°Π³ΠΈΡ€ΡƒΡŽΡ‚ Π½Π° Ρ‚ΠΎΡ‡ΠΊΠΈ останова, Ρ‡Ρ‚ΠΎ Π΄Π΅Π»Π°Π΅Ρ‚ ΠΈΡ… ΠΏΠΎΠ»Π΅Π·Π½Ρ‹ΠΌΠΈ для отобраТСния ΠΌΡƒΠ»ΡŒΡ‚ΠΈΠΌΠ΅Π΄ΠΈΠ° Π½Π° экранах Π½Π°ΡΡ‚ΠΎΠ»ΡŒΠ½Ρ‹Ρ… ΠΊΠΎΠΌΠΏΡŒΡŽΡ‚Π΅Ρ€ΠΎΠ², ΠΏΠ»Π°Π½ΡˆΠ΅Ρ‚ΠΎΠ² ΠΈ ΠΌΠΎΠ±ΠΈΠ»ΡŒΠ½Ρ‹Ρ… устройств.

Π’ этом ΡƒΡ€ΠΎΠΊΠ΅ Π²Ρ‹ ΡƒΠ·Π½Π°Π΅Ρ‚Π΅:

  1. Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ лайтбокс
  2. Как Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΌΠ΅Π΄ΠΈΠ° лайтбокс
  3. Как ΡΠ²ΡΠ·Π°Ρ‚ΡŒ лайтбоксы с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Π³Ρ€ΡƒΠΏΠΏ

Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ лайтбокс

На лайтбокс ΠΌΠΎΠΆΠ½ΠΎ Π½Π°ΠΆΠ°Ρ‚ΡŒ эскиз, Π²Π»ΠΎΠΆΠ΅Π½Π½Ρ‹ΠΉ Π² Π±Π»ΠΎΠΊ ссылок. Когда посСтитСли сайта Ρ‰Π΅Π»ΠΊΠ°ΡŽΡ‚ Π²Π½ΡƒΡ‚Ρ€ΠΈ Π³Ρ€Π°Π½ΠΈΡ† ссылки Π½Π° Π°ΠΊΡ‚ΠΈΠ²Π½ΠΎΠΌ сайтС, открываСтся лайтбокс для отобраТСния ΠΏΠΎΠ΄ΠΊΠ»ΡŽΡ‡Π΅Π½Π½Ρ‹Ρ… ΠΊ Π½Π΅ΠΌΡƒ ΠΌΠ΅Π΄ΠΈΠ°Ρ„Π°ΠΉΠ»ΠΎΠ².

Π§Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ лайтбокс:

  1. ΠŸΠ΅Ρ€Π΅ΠΉΡ‚ΠΈ ΠΊ Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ панСль > Π”ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ
  2. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ элСмСнт лайтбокса ΠΈΠ»ΠΈ ΠΏΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ Π΅Π³ΠΎ Π½Π° холст Webflow

Как Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ эскиз заполнитСля лайтбокса

Лайтбокс содСрТит элСмСнт изобраТСния, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π²Π΅Π΄Π΅Ρ‚ сСбя ΠΊΠ°ΠΊ любой Π΄Ρ€ΡƒΠ³ΠΎΠΉ элСмСнт изобраТСния. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ Π΅Π³ΠΎ Ρ€Π°Π·ΠΌΠ΅Ρ€, Π΄Π²Π°ΠΆΠ΄Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΡƒΡ‚ΡŒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π·Π°ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΠΌΠΈΠ½ΠΈΠ°Ρ‚ΡŽΡ€Ρƒ заполнитСля, ΠΈ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π·Π°ΠΌΠ΅Ρ‰Π°ΡŽΡ‰ΠΈΠΉ тСкст. Π£Π·Π½Π°ΠΉΡ‚Π΅ большС ΠΎΠ± элСмСнтах изобраТСния.

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΎΠ΄Π½ΠΎ ΠΈ Ρ‚ΠΎ ΠΆΠ΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ для ΠΌΠΈΠ½ΠΈΠ°Ρ‚ΡŽΡ€Ρ‹ лайтбокса ΠΈ большого модального ΠΎΠΊΠ½Π° лайтбокса. Webflow автоматичСски создаСт Π°Π΄Π°ΠΏΡ‚ΠΈΠ²Π½Ρ‹Π΅ Π²Π°Ρ€ΠΈΠ°Π½Ρ‚Ρ‹ для всСх встроСнных ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ. Π£Π·Π½Π°ΠΉΡ‚Π΅ большС ΠΎΠ± Π°Π΄Π°ΠΏΡ‚ΠΈΠ²Π½Ρ‹Ρ… изобраТСниях.

Как Π·Π°ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΠΌΠΈΠ½ΠΈΠ°Ρ‚ΡŽΡ€Ρƒ лайтбокса Π΄Ρ€ΡƒΠ³ΠΈΠΌ содСрТимым

Π’Ρ‹ замСняСтС элСмСнт изобраТСния-Π·Π°ΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒ ΠΈ пСрСтаскиваСтС Π΄Ρ€ΡƒΠ³ΠΎΠ΅ содСрТимоС (Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ ΠΈΠ»ΠΈ Π»ΡŽΠ±Ρ‹Π΅ Π΄Ρ€ΡƒΠ³ΠΈΠ΅ элСмСнты, Π½Π΅ ΡΠ²Π»ΡΡŽΡ‰ΠΈΠ΅ΡΡ ссылками) Π²Π½ΡƒΡ‚Ρ€ΠΈ ссылки лайтбокса .

Π’Ρ‹ Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π±Π»ΠΎΠΊ div ΠΈ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚ΡŒ Ρ„ΠΎΠ½ΠΎΠ²ΠΎΠ΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ для создания ΠΌΠΈΠ½ΠΈΠ°Ρ‚ΡŽΡ€ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎΠ³ΠΎ Ρ€Π°Π·ΠΌΠ΅Ρ€Π°.

Как ΠΎΡ„ΠΎΡ€ΠΌΠΈΡ‚ΡŒ лайтбокс

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΡ‚ΠΈΠ»ΠΈΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΊΠ°ΠΊ ссылку лайтбокса, Ρ‚Π°ΠΊ ΠΈ Π΅Π³ΠΎ содСрТимоС. НапримСр, Ссли Π²Ρ‹ Π²ΠΊΠ»Π°Π΄Ρ‹Π²Π°Π΅Ρ‚Π΅ тСкстовыС элСмСнты Π² ссылку лайтбокса, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΡ‚ΠΈΠ»ΠΈΠ·ΠΎΠ²Π°Ρ‚ΡŒ Ρ‚ΠΈΠΏΠΎΠ³Ρ€Π°Ρ„ΠΈΠΊΡƒ элСмСнта ссылки лайтбокса.

Π’Ρ‹ Π½Π΅ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π½Π°ΡΡ‚Ρ€ΠΎΠΈΡ‚ΡŒ Π½Π°Π»ΠΎΠΆΠ΅Π½ΠΈΠ΅ Ρ„ΠΎΠ½Π° Π² модальном ΠΎΠΊΠ½Π΅, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ открываСтся ΠΏΡ€ΠΈ Π½Π°ΠΆΠ°Ρ‚ΠΈΠΈ Π½Π° ссылку лайтбокса. Однако Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ ΠΈΠ»ΠΈ Π²ΠΈΠ΄Π΅ΠΎ ΠΈ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ подпись ΠΊ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΡŽ, Ссли Ρ…ΠΎΡ‚ΠΈΡ‚Π΅.

Как Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΌΠ΅Π΄ΠΈΠ°Ρ„Π°ΠΉΠ» лайтбокса

Π§Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ ΠΈ подпись ΠΊ ΠΌΠΎΠ΄Π°Π»ΡŒΠ½ΠΎΠΌΡƒ ΠΎΠΊΠ½Ρƒ лайтбокса:

  1. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ссылку лайтбокса Π½Π° холстС
  2. ΠŸΠ΅Ρ€Π΅ΠΉΡ‚ΠΈ ΠΊ ПанСль настроСк элСмСнта > Настройки лайтбокса
  3. НаТмитС Β« Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Β» Π·Π½Π°Ρ‡ΠΎΠΊ
  4. НаТмитС Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅
  5. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ ΠΈΠ· ΠΏΠ°Π½Π΅Π»ΠΈ Π°ΠΊΡ‚ΠΈΠ²ΠΎΠ²
  6. Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ подпись Π² Ρ€Π°Π·Π΄Π΅Π»Π΅ . Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π² лайтбокс ΡΡ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ, сколько Π·Π°Ρ…ΠΎΡ‚ΠΈΡ‚Π΅. Π­Ρ‚ΠΈ изобраТСния Π±ΡƒΠ΄ΡƒΡ‚ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒΡΡ Π² Π²ΠΈΠ΄Π΅ слайд-ΡˆΠΎΡƒ Π²Π½ΡƒΡ‚Ρ€ΠΈ модального ΠΎΠΊΠ½Π° лайтбокса.

    ΠŸΡ€ΠΈΠΌΠ΅Ρ‡Π°Π½ΠΈΠ΅: Π’ настоящСС врСмя элСмСнты лайтбокса Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°ΡŽΡ‚ Π·Π°ΠΌΠ΅Ρ‰Π°ΡŽΡ‰ΠΈΠΉ тСкст для ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ Π²Π½ΡƒΡ‚Ρ€ΠΈ лайтбокса.

    Π§Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π²ΠΈΠ΄Π΅ΠΎ Π² модальноС ΠΎΠΊΠ½ΠΎ лайтбокса:

    1. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ссылку Π½Π° лайтбокс Π½Π° холстС
    2. ΠŸΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π½Π° ПанСль настроСк элСмСнта Π—Π½Π°Ρ‡ΠΎΠΊ ”
    3. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ URL-адрСс Π²ΠΈΠ΄Π΅ΠΎ Π² ΠΏΠΎΠ»Π΅ URL
    4. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π‘ΠΎΡ…Ρ€Π°Π½ΠΈΡ‚ΡŒ

    Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ динамичСскиС лайтбоксы ΠΈΠ· ΠΌΡƒΠ»ΡŒΡ‚ΠΈΠΌΠ΅Π΄ΠΈΠΉΠ½ΠΎΠ³ΠΎ поля ΠΊΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΠΈ

    ΠΈΠ· ΠΏΠΎΠ»Π΅ΠΉ ΠΌΠ΅Π΄ΠΈΠ°ΠΊΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΠΈ (Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, поля изобраТСния, поля с нСсколькими изобраТСниями ΠΈΠ»ΠΈ поля Π²ΠΈΠ΄Π΅ΠΎ) Π² вашСй CMS ΠΈΠ»ΠΈ коллСкциях элСктронной Ρ‚ΠΎΡ€Π³ΠΎΠ²Π»ΠΈ.

    Π§Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠ΄ΠΊΠ»ΡŽΡ‡ΠΈΡ‚ΡŒ ΠΏΠΎΠ»Π΅ динамичСской ΠΊΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΠΈ ΠΊ ΠΌΠΈΠ½ΠΈΠ°Ρ‚ΡŽΡ€Π΅ лайтбокса:

    1. Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ лайтбокс ΠΊ динамичСски ΠΏΠΎΠ΄ΠΊΠ»ΡŽΡ‡Π°Π΅ΠΌΠΎΠΌΡƒ списку ΠΊΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΠΉ ΠΈΠ»ΠΈ страницС ΠΊΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΠΉ CMS
    2. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΌΠΈΠ½ΠΈΠ°Ρ‚ΡŽΡ€Ρƒ изобраТСния-заполнитСля Настройки изобраТСния
    3. УстановитС Ρ„Π»Π°ΠΆΠΎΠΊ Β«ΠŸΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ ΠΈΠ· сообщСний Π±Π»ΠΎΠ³Π° Β» (Π½Π°Π·Π²Π°Π½ΠΈΠ΅ ΠΊΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΠΈ ΠΌΠΎΠΆΠ΅Ρ‚ ΠΎΡ‚Π»ΠΈΡ‡Π°Ρ‚ΡŒΡΡ Π² зависимости ΠΎΡ‚ Π²Ρ‹Π±Ρ€Π°Π½Π½ΠΎΠΉ Π²Π°ΠΌΠΈ ΠΊΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΠΈ)
    4. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΏΠΎΠ»Π΅ Β«ΠšΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΡ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉΒ» ΠΈΠ· Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΏΠΎΠ»Π΅ Ρ€Π°ΡΠΊΡ€Ρ‹Π²Π°ΡŽΡ‰ΠΈΠΉΡΡ список

    Π—Π°Ρ‚Π΅ΠΌ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΏΠΎΠ΄ΠΊΠ»ΡŽΡ‡ΠΈΡ‚ΡŒ лайтбокс ΠΊ полю ΠšΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΡ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π² лайтбоксС Π±Ρ‹Π»ΠΈ доступны изобраТСния вашСй динамичСской ΠΊΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΠΈ. Π§Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠ΄ΠΊΠ»ΡŽΡ‡ΠΈΡ‚ΡŒ динамичСскоС ΠΏΠΎΠ»Π΅ Β«ΠšΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΡΒ» ΠΊ ΠΌΠ΅Π΄ΠΈΠ°Ρ„Π°ΠΉΠ»Ρƒ лайтбокса:

    1. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ссылку лайтбокса
    2. ΠŸΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ ΠΊ Настройки элСмСнта > Настройки лайтбокса > МСдиа
    3. УстановитС Ρ„Π»Π°ΠΆΠΎΠΊ Β«00 ΠŸΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ ΠΌΠ΅Π΄ΠΈΠ° ΠΈΠ· сообщСний» ” (Π½Π°Π·Π²Π°Π½ΠΈΠ΅ ΠΊΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΠΈ ΠΌΠΎΠΆΠ΅Ρ‚ ΠΎΡ‚Π»ΠΈΡ‡Π°Ρ‚ΡŒΡΡ Π² зависимости ΠΎΡ‚ Π²Ρ‹Π±Ρ€Π°Π½Π½ΠΎΠΉ Π²Π°ΠΌΠΈ ΠΊΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΠΈ)
    4. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΏΠΎΠ»Π΅ ΠšΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΠΈ ΠΌΡƒΠ»ΡŒΡ‚ΠΈΠΌΠ΅Π΄ΠΈΠ° ΠΈΠ· Ρ€Π°ΡΠΊΡ€Ρ‹Π²Π°ΡŽΡ‰Π΅Π³ΠΎΡΡ списка Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΏΠΎΠ»Π΅

    Π§Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠ΄ΠΊΠ»ΡŽΡ‡ΠΈΡ‚ΡŒ лайтбокс ΠΊ полю с нСсколькими изобраТСниями: -image, Ρ‰Π΅Π»ΠΊΠ½ΡƒΠ² Ρ€Π°ΡΠΊΡ€Ρ‹Π²Π°ΡŽΡ‰ΠΈΠΉΡΡ список Source ΠΈ Π²Ρ‹Π±Ρ€Π°Π² ΠΏΠΎΠ»Π΅ с нСсколькими изобраТСниями

  7. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ лайтбокс Π² список ΠΊΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΠΈ
  8. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ элСмСнт image Π² лайтбоксС
  9. ΠŸΠ΅Ρ€Π΅ΠΉΡ‚ΠΈ ΠΊ Настройки элСмСнта > Настройки изобраТСния
  10. УстановитС Ρ„Π»Π°ΠΆΠΎΠΊ Β«ΠŸΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ ΠΈΠ· сообщСний Π±Π»ΠΎΠ³Π° Β» (Π½Π°Π·Π²Π°Π½ΠΈΠ΅ ΠΊΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΠΈ ΠΌΠΎΠΆΠ΅Ρ‚ ΠΎΡ‚Π»ΠΈΡ‡Π°Ρ‚ΡŒΡΡ Π² зависимости ΠΎΡ‚ Π²Ρ‹Π±Ρ€Π°Π½Π½ΠΎΠΉ Π²Π°ΠΌΠΈ ΠΊΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΠΈ)
  11. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΌΡƒΠ»ΡŒΡ‚ΠΈ- ΠΏΠΎΠ»Π΅ изобраТСния ΠΈΠ· Ρ€Π°ΡΠΊΡ€Ρ‹Π²Π°ΡŽΡ‰Π΅Π³ΠΎΡΡ списка Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΏΠΎΠ»Π΅
  12. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ лайтбокс ссылку Π½Π° холстС
  13. ΠŸΠ΅Ρ€Π΅ΠΉΡ‚ΠΈ ΠΊ Настройки элСмСнта > Настройки лайтбокса
  14. УстановитС Ρ„Π»Π°ΠΆΠΎΠΊ Β«ΠŸΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ ΠΌΠ΅Π΄ΠΈΠ°Ρ„Π°ΠΉΠ»Ρ‹ ΠΈΠ· сообщСний Π±Π»ΠΎΠ³Π° Β» (Π½Π°Π·Π²Π°Π½ΠΈΠ΅ ΠΊΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΠΈ ΠΌΠΎΠΆΠ΅Ρ‚ ΠΎΡ‚Π»ΠΈΡ‡Π°Ρ‚ΡŒΡΡ Π² зависимости ΠΎΡ‚ Π²Ρ‹Π±Ρ€Π°Π½Π½ΠΎΠΉ Π²Π°ΠΌΠΈ ΠΊΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΠΈ)
  15. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΏΠΎΠ»Π΅ с нСсколькими изобраТСниями ΠΈΠ· Ρ€Π°ΡΠΊΡ€Ρ‹Π²Π°ΡŽΡ‰Π΅Π³ΠΎΡΡ списка

Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΏΠΎΠ»Π΅ с нСсколькими изобраТСниями

ΠŸΠΎΠ΄Ρ€ΠΎΠ±Π½Π΅Π΅ ΠΎ ΠΏΠΎΠ»Π΅ с нСсколькими изобраТСниями.

Как ΡΠ²ΡΠ·Π°Ρ‚ΡŒ лайтбоксы с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Π³Ρ€ΡƒΠΏΠΏ лайтбоксов

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠ²ΡΠ·Π°Ρ‚ΡŒ нСсколько лайтбоксов вмСстС, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π³Π°Π»Π΅Ρ€Π΅ΡŽ слайд-ΡˆΠΎΡƒ. Когда ΠΏΠΎΡΠ΅Ρ‚ΠΈΡ‚Π΅Π»ΡŒ сайта Ρ‰Π΅Π»ΠΊΠ°Π΅Ρ‚ связанный лайтбокс, лайтбокс ΠΎΡ‚ΠΊΡ€Ρ‹Π²Π°Π΅Ρ‚ всС ΠΌΠ΅Π΄ΠΈΠ°Ρ„Π°ΠΉΠ»Ρ‹, связанныС со связанной Π³Ρ€ΡƒΠΏΠΏΠΎΠΉ.

Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π³Ρ€ΡƒΠΏΠΏΡƒ Lightbox

  1. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ любой элСмСнт Π² Lightbox
  2. ΠŸΠ΅Ρ€Π΅ΠΉΡ‚ΠΈ ΠΊ настройкам элСмСнтов > Настройки Lightbox
  3. ΠŸΡ€ΠΎΠ²Π΅Ρ€ΠΊΠ° «Бсылка с Π΄Ρ€ΡƒΠ³ΠΈΠΌΠΈ Π»Π°ΠΌΠΏΠ°ΠΌΠΈΒ»
  4. Π’Π²Π΅Π΄ΠΈΡ‚Π΅ Group Name

  5. 1221212

Как ΡΠ²ΡΠ·Π°Ρ‚ΡŒ Π΄Ρ€ΡƒΠ³ΠΈΠ΅ лайтбоксы с Ρ‚ΠΎΠΉ ΠΆΠ΅ Π³Ρ€ΡƒΠΏΠΏΠΎΠΉ

Π§Ρ‚ΠΎΠ±Ρ‹ ΡΠ²ΡΠ·Π°Ρ‚ΡŒ Π΄Ρ€ΡƒΠ³ΠΈΠ΅ лайтбоксы с Π³Ρ€ΡƒΠΏΠΏΠΎΠΉ, Π²Ρ‹ΠΏΠΎΠ»Π½ΠΈΡ‚Π΅ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ шаги для ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ лайтбокса:

  1. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ любой элСмСнт Π² лайтбоксС
  2. ΠŸΠ΅Ρ€Π΅ΠΉΡ‚ΠΈ ΠΊ Настройки элСмСнта > Настройки лайтбокса
  3. УстановитС Ρ„Π»Π°ΠΆΠΎΠΊ Β«Π‘Π²ΡΠ·Π°Ρ‚ΡŒ с Π΄Ρ€ΡƒΠ³ΠΈΠΌΠΈ лайтбоксами»
  4. Π’Π²Π΅Π΄ΠΈΡ‚Π΅ Ρ‚ΠΎ ΠΆΠ΅ самоС Имя Π³Ρ€ΡƒΠΏΠΏΡ‹

автоматичСски связываСт всС лайтбоксы Π² спискС ΠΊΠΎΠ»Π»Π΅ΠΊΡ†ΠΈΠΈ.

alexxlab

Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΉ

Π’Π°Ρˆ адрСс email Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΠΏΡƒΠ±Π»ΠΈΠΊΠΎΠ²Π°Π½. ΠžΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ поля ΠΏΠΎΠΌΠ΅Ρ‡Π΅Π½Ρ‹ *