Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
  • Sign Up

Всплывающее окно


Recommended Posts

Добрый день!
Как настроить всплывающее окно при заходе на сайт? Есть скрипты бесплатные, либо модуль ?
Либо как вариант, у меня есть уже настроенный виджет обратного звонка, настроить функцию, что бы он автоматически всплывал при заходе на сайт?!

 

12.png

Link to post
Share on other sites

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

Link to post
Share on other sites

В "Расширениях"  найдите  "HTML контент" ,  создайте новое расширение "виджет", (не забудьте его включить...) и впишите в него скрипт виджета обратного звонка, затем в макетах  вставьте это расширение в нужный макет  

Edited by novichok1955
Link to post
Share on other sites

Кстати, для этого рекомендую лучше использовать RedHelper  и RedConnect ...  менее навязчиво и вполне удобно!

Link to post
Share on other sites

13 часов назад, novichok1955 сказал:

В "Расширениях"  найдите  "HTML контент" ,  создайте новое расширение "виджет", (не забудьте его включить...) и впишите в него скрипт виджета обратного звонка, затем в макетах  вставьте это расширение в нужный макет  

мне нужно не перенести виджет, а что бы он автоматически при заходи на сайте включался сделать. Как модальное окно "popup" по моему называется

Link to post
Share on other sites

Я по скрипту сделал вот такое всплывающее окно: 555555.thumb.png.308c622e77325bfdd573c4eb6abf5e89.png

Можно как то настроить, что бы виджет за место этого окна вылазил?
Вот коды по которым настраивал: 
Это в футере прописал
<script type="text/javascript">
    var delay_popup = 3000;
    setTimeout("document.getElementById('bg_popup').style.display='block'", delay_popup);
</script>   
<div id="bg_popup">
  <div id="popup">
<h1>Пробное сообщение!</h1>
<p>Пробное сообщение пишем тут.</p>
<a class="close" href="#" title="Закрыть" onclick="document.getElementById('bg_popup').style.display='none'; return false;">X</a>
</div>
</div>

и css:

#bg_popup{
background-color: rgba(0, 0, 0, 0.8);
display: none;
position: fixed;
z-index: 99999;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
  
#popup {
background: #fff;
width: 520px;
margin: 25% auto;
padding: 5px 20px 13px 20px;
border: 2px solid #1BA600;
position: relative;
-webkit-box-shadow: 0px 0px 20px #000;
-moz-box-shadow: 0px 0px 20px #000;
box-shadow: 0px 0px 20px #000;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
}
  
.close{
display:block;
position:absolute;
top:-12px;
right:5px;
width:25px;
height:25px;
line-height:28px;
color:#fff;
background:#1BA600;
cursor:pointer;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
-ms-border-radius: 15px;
-o-border-radius: 15px;
border-radius: 15px;
-moz-box-shadow: 1px 1px 3px #000;
-webkit-box-shadow: 1px 1px 3px #000;
box-shadow: 1px 1px 3px #000;
}
.close:hover {
background-color:#f30;
}

 

Link to post
Share on other sites

Я согласен с мнением предыдущего поста о навязчивости  данного варианта всплывающего окна...

У меня ( сделано по описанному выше...) все выглядит вот так...  Есть и обратный звонок и чат! Только не навязчиво, а как ВЫБОР клиента, захочет - напишет или закажет обратный звонок.

FireShot Capture 001 - Фабрика- студия _Идея__ - https___www.donbassmebel.ru_index.php.png

Edited by novichok1955
Link to post
Share on other sites

  • 2 years later...

Привет всем!

Может кто подскажет, а как в примере выше сделать ссылку на такое pop-up окно, что бы при клике на ссылку вылезало такое окно.

P.S. Готовые Модули не предлагать

Link to post
Share on other sites

6 минут назад, Gamburg сказал:

P.S. Готовые Модули не предлагать

Ну можете в документации бутстрапа почитать как выводятся модальные окна https://getbootstrap.com/docs/4.0/components/modal/

Link to post
Share on other sites
6 minutes ago, iglin said:

Ну можете в документации бутстрапа почитать как выводятся модальные окна https://getbootstrap.com/docs/4.0/components/modal/

Благодарю, только теперь надо разобраться какая версия bootstapa стоит у меня

Link to post
Share on other sites

4 минуты назад, Gamburg сказал:

какая версия bootstapa стоит у меня

Стандартно в опенкарт 3 версия бутстрапа. Модете открыть файл бутстрап-мин.жс который подгружается при загрузке вашего сайта и там вверху обычно в коментах версия указана.

 

Link to post
Share on other sites

Opencart 3.0.2.0.

СSS - Bootstrap v3.1.0

JS - Bootstrap v3.3.5

Link to post
Share on other sites

  • 7 months later...
В 28.02.2018 в 12:01, VasiliyGrachev сказал:

Я по скрипту сделал вот такое всплывающее окно: 555555.thumb.png.308c622e77325bfdd573c4eb6abf5e89.png

Можно как то настроить, что бы виджет за место этого окна вылазил?
Вот коды по которым настраивал: 
Это в футере прописал
<script type="text/javascript">
    var delay_popup = 3000;
    setTimeout("document.getElementById('bg_popup').style.display='block'", delay_popup);
</script>   
<div id="bg_popup">
  <div id="popup">
<h1>Пробное сообщение!</h1>
<p>Пробное сообщение пишем тут.</p>
<a class="close" href="#" title="Закрыть" onclick="document.getElementById('bg_popup').style.display='none'; return false;">X</a>
</div>
</div>

и css:

#bg_popup{
background-color: rgba(0, 0, 0, 0.8);
display: none;
position: fixed;
z-index: 99999;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
  
#popup {
background: #fff;
width: 520px;
margin: 25% auto;
padding: 5px 20px 13px 20px;
border: 2px solid #1BA600;
position: relative;
-webkit-box-shadow: 0px 0px 20px #000;
-moz-box-shadow: 0px 0px 20px #000;
box-shadow: 0px 0px 20px #000;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
}
  
.close{
display:block;
position:absolute;
top:-12px;
right:5px;
width:25px;
height:25px;
line-height:28px;
color:#fff;
background:#1BA600;
cursor:pointer;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
-ms-border-radius: 15px;
-o-border-radius: 15px;
border-radius: 15px;
-moz-box-shadow: 1px 1px 3px #000;
-webkit-box-shadow: 1px 1px 3px #000;
box-shadow: 1px 1px 3px #000;
}
.close:hover {
background-color:#f30;
}

 

как сделать вызов этого окна

Link to post
Share on other sites

27 минут назад, csslamm сказал:

как сделать вызов этого окна

как вариант может использовать готовое решение которые выполняет эту задачу 

 

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...

Important Information

On our site, cookies are used and personal data is processed to improve the user interface. To find out what and what personal data we are processing, please go to the link. If you click "I agree," it means that you understand and accept all the conditions specified in this Privacy Notice.