Модуль виджета whatsapp для Opencart
Версия: Ocstore2.3
Тип модуля:для мобильных устройств

В течение минуты «загорается» и напоминает, чтобы пользователь может написать в Whatsapp. Напоминание закрывается по нажатию на кретстик

По нажатию на иконку происходит перенаправление на вотсаповскую форму

Телефон отправки сообщения и текст задаются настройками модуля в админке

Файлы модуля
Контроллер в админке
<?php
class ControllerExtensionModuleMobutpanel extends Controller {
private $error = array();
public function index() {
$this->load->language('extension/module/mobutpanel');
$this->load->model('extension/module');
if (($this->request->server['REQUEST_METHOD'] == 'POST') && $this->validate()) {
if (!isset($this->request->get['module_id'])) {
$this->model_extension_module->addModule('mobutpanel', $this->request->post);
} else {
$this->model_extension_module->editModule($this->request->get['module_id'], $this->request->post);
}
// $this->session->data['success'] = $this->language->get('text_success');
$this->response->redirect($this->url->link('extension/extension', 'token=' . $this->session->data['token'] . '&type=module', true));
}
$data['entry_phone'] = $this->language->get('entry_phone');
$data['entry_message'] = $this->language->get('entry_message');
$data['entry_status'] = $this->language->get('entry_status');
$data['entry_name'] = $this->language->get('entry_name');
$data['text_edit'] = $this->language->get('text_edit');
$data['heading_title'] = $this->language->get('heading_title');
$data['text_enabled'] = $this->language->get('text_enabled');
$data['text_disabled'] = $this->language->get('text_disabled');
$data['button_save'] = $this->language->get('button_save');
$data['button_cancel'] = $this->language->get('button_cancel');
if (isset($this->error['warning'])) {
$data['error_warning'] = $this->error['warning'];
} else {
$data['error_warning'] = '';
}
if (isset($this->error['name'])) {
$data['error_name'] = $this->error['name'];
} else {
$data['error_name'] = '';
}
if (isset($this->error['phone'])) {
$data['error_phone'] = $this->error['phone'];
} else {
$data['error_phone'] = '';
}
if (isset($this->error['message'])) {
$data['error_message'] = $this->error['message'];
} else {
$data['error_message'] = '';
}
$data['breadcrumbs'] = array();
$data['breadcrumbs'][] = array(
'text' => $this->language->get('text_home'),
'href' => $this->url->link('common/dashboard', 'token=' . $this->session->data['token'], true)
);
$data['breadcrumbs'][] = array(
'text' => $this->language->get('text_extension'),
'href' => $this->url->link('extension/extension', 'token=' . $this->session->data['token'] . '&type=module', true)
);
if (!isset($this->request->get['module_id'])) {
$data['breadcrumbs'][] = array(
'text' => $this->language->get('heading_title'),
'href' => $this->url->link('extension/module/mobutpanel', 'token=' . $this->session->data['token'], true)
);
} else {
$data['breadcrumbs'][] = array(
'text' => $this->language->get('heading_title'),
'href' => $this->url->link('extension/module/mobutpanel', 'token=' . $this->session->data['token'] . '&module_id=' . $this->request->get['module_id'], true)
);
}
if (!isset($this->request->get['module_id'])) {
$data['action'] = $this->url->link('extension/module/mobutpanel', 'token=' . $this->session->data['token'], true);
} else {
$data['action'] = $this->url->link('extension/module/mobutpanel', 'token=' . $this->session->data['token'] . '&module_id=' . $this->request->get['module_id'], true);
}
$data['cancel'] = $this->url->link('extension/extension', 'token=' . $this->session->data['token'] . '&type=module', true);
if (isset($this->request->get['module_id']) && ($this->request->server['REQUEST_METHOD'] != 'POST')) {
$module_info = $this->model_extension_module->getModule($this->request->get['module_id']);
}
if (isset($this->request->post['name'])) {
$data['name'] = $this->request->post['name'];
} elseif (!empty($module_info)) {
$data['name'] = $module_info['name'];
} else {
$data['name'] = '';
}
if (isset($this->request->post['phone'])) {
$data['phone'] = $this->request->post['phone'];
} elseif (!empty($module_info)) {
$data['phone'] = $module_info['phone'];
} else {
$data['phone'] = '7';
}
if (isset($this->request->post['message'])) {
$data['message'] = $this->request->post['message'];
} elseif (!empty($module_info)) {
$data['message'] = $module_info['message'];
} else {
$data['message'] = 'Здравствуйте! Хочу получить консультацию.';
}
if (isset($this->request->post['status'])) {
$data['status'] = $this->request->post['status'];
} elseif (!empty($module_info)) {
$data['status'] = $module_info['status'];
} else {
$data['status'] = '';
}
$data['header'] = $this->load->controller('common/header');
$data['column_left'] = $this->load->controller('common/column_left');
$data['footer'] = $this->load->controller('common/footer');
$this->response->setOutput($this->load->view('extension/module/mobutpanel', $data));
}
protected function validate() {
if (!$this->user->hasPermission('modify', 'extension/module/mobutpanel')) {
$this->error['warning'] = $this->language->get('error_permission');
}
if ((utf8_strlen($this->request->post['name']) < 3) || (utf8_strlen($this->request->post['name']) > 64)) {
$this->error['name'] = $this->language->get('error_name');
}
if (!$this->request->post['phone']) {
$this->error['phone'] = $this->language->get('error_phone');
}
if (!$this->request->post['message']) {
$this->error['message'] = $this->language->get('error_message');
}
return !$this->error;
}
}
Вьюшка в админке
<?php echo $header; ?><?php echo $column_left; ?>
<div id="content">
<div class="page-header">
<div class="container-fluid">
<div class="pull-right">
<button type="submit" form="form-special" data-toggle="tooltip" title="<?php echo $button_save; ?>" class="btn btn-primary"><i class="fa fa-save"></i></button>
<a href="<?php echo $cancel; ?>" data-toggle="tooltip" title="<?php echo $button_cancel; ?>" class="btn btn-default"><i class="fa fa-reply"></i></a></div>
<ul class="breadcrumb">
<?php foreach ($breadcrumbs as $breadcrumb) { ?>
<li><a href="<?php echo $breadcrumb['href']; ?>"><?php echo $breadcrumb['text']; ?></a></li>
<?php } ?>
</ul>
</div>
</div>
<div class="container-fluid">
<?php if ($error_warning) { ?>
<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> <?php echo $error_warning; ?>
<button type="button" class="close" data-dismiss="alert">×</button>
</div>
<?php } ?>
<div class="panel panel-default">
<div class="panel-body">
<form action="<?php echo $action; ?>" method="post" enctype="multipart/form-data" id="form-special" class="form-horizontal">
<div class="form-group">
<label class="col-sm-2 control-label" for="input-name"><?php echo $entry_name; ?></label>
<div class="col-sm-10">
<input type="text" name="name" value="<?php echo $name; ?>" placeholder="<?php echo $entry_name; ?>" id="input-name" class="form-control" />
<?php if ($error_name) { ?>
<div class="text-danger"><?php echo $error_name; ?></div>
<?php } ?>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="input-phone"><?php echo $entry_phone; ?></label>
<div class="col-sm-10">
<input type="text" name="phone" value="<?php echo $phone; ?>" placeholder="<?php echo $entry_phone; ?>" id="input-phone" class="form-control" />
<?php if ($error_phone) { ?>
<div class="text-danger"><?php echo $error_phone; ?></div>
<?php } ?>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="input-phone"><?php echo $entry_message; ?></label>
<div class="col-sm-10">
<input type="text" name="message" value="<?php echo $message; ?>" placeholder="<?php echo $entry_message; ?>" id="input-phone" class="form-control" />
<?php if ($error_message) { ?>
<div class="text-danger"><?php echo $error_message; ?></div>
<?php } ?>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="input-status"><?php echo $entry_status; ?></label>
<div class="col-sm-10">
<select name="status" id="input-status" class="form-control">
<?php if ($status) { ?>
<option value="1" selected="selected"><?php echo $text_enabled; ?></option>
<option value="0"><?php echo $text_disabled; ?></option>
<?php } else { ?>
<option value="1"><?php echo $text_enabled; ?></option>
<option value="0" selected="selected"><?php echo $text_disabled; ?></option>
<?php } ?>
</select>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<?php echo $footer; ?>
Контроллер на фронтенде
<?php
class ControllerExtensionModuleMobutpanel extends Controller {
public function index($setting) {
$data['phone'] = $setting['phone'];
$data['message'] = $setting['message'];
if($this->isMobile()){
return $this->load->view('extension/module/mobutpanel', $data);
}
}
public function isMobile() {
return preg_match("/(android|avantgo|blackberry|bolt|boost|cricket|docomo|fone|hiptop|mini|mobi|palm|phone|pie|tablet|up\.browser|up\.link|webos|wos)/i", /*$_SERVER["HTTP_USER_AGENT"]*/$this->request->server['HTTP_USER_AGENT']);
}
}
Вьюшка на фронтенде
<style>
.callbackkiller {
box-sizing: content-box !important;
font-size: 13px !important;
font-weight: 300 !important;
transform-origin: 50% 50% 0px;
-webkit-box-shadow: 0 3px 12px rgba(0,0,0,.15);
-moz-box-shadow: 0 3px 12px rgba(0,0,0,.15);
box-shadow: 0px 3px 12px rgba(0,0,0,0.15);
white-space: normal;
}
.close {
text-shadow: none;
}
.callbackkiller, .callbackkiller * {
color: #333 !important;
font-family: CBKOpenSans,CBKRobotoLight,sans-serif !important;
font-style: normal !important;
text-transform: none !important;
}
.cbk-phone, .cbk-phone:hover {
background-color: transparent !important;
bottom: 5%;
border-radius: 60px !important;
-webkit-border-radius: 60px !important;
color: #fff;
display: block;
font-size: 22px !important;
height: 120px !important;
left: auto;
outline: none !important;
overflow: hidden;
padding: 0 !important;
position: absolute;
right: 20%;
text-decoration: none;
top: auto;
width: 120px !important;
z-index: 9999 !important;
transition: none;
-webkit-transition: none;
}
.cbk-phone-pulse, .cbk-phone-waves, .cbk-phone-wild, .multi-button-waves {
overflow: visible !important;
}
.callbackkiller.whatsapp {
display: none !important;
}
/* @media all and (max-width:767px) */
.callbackkiller.whatsapp {
display: block !important;
}
.cbk-phone.cbk-phone-xs, .cbk-phone.cbk-phone-xs:hover {
height: 60px !important;
width: 60px !important;
position: absolute;
}
/* @media all and (max-width:767px) */
.callbackkiller.cbk-phone.cbk-phone-pulse {
--box-shadow-color: 0 9px 16px rgba(19,156,20,.6);
}
.callbackkiller.cbk-phone.cbk-phone-pulse {
--box-shadow-color: 0 9px 16px rgba(255,34,65,.6);
-webkit-animation: envybox-phone-pulse 12s infinite ease-in;
-moz-animation: envybox-phone-pulse 12s infinite ease-in;
-ms-animation: envybox-phone-pulse 12s infinite ease-in;
-o-animation: envybox-phone-pulse 12s infinite ease-in;
animation: envybox-phone-pulse 12s infinite ease-in;
-webkit-backface-visibility: visible !important;
}
.callbackkiller.cbk-phone.cbk-phone-pulse {
--box-shadow-color: 0 9px 16px rgba(19,156,20,1) !important;
}
/* @media all and (max-width:767px) */
.callbackkiller.whatsapp.cbk-phone.cbk-phone-xs {
height: 57px !important;
width: 57px !important;
display: block;
position: fixed;
bottom: 10%;
right: 4%;
transform: scale(1);
z-index: 5;
}
ul.tabs li span, .front_slider_wrapp .extended_pagination span, a, a span {
-webkit-transition: color ease-out 0.07s;
-moz-transition: color ease-out 0.07s;
-o-transition: color ease-out 0.07s;
transition: color ease-out 0.07s;
}
/* @media all and (max-width:767px) */
.callbackkiller .whatsapp-notifier {
display: block;
width: 227px;
position: relative;
top: 30px;
left: -188px;
overflow: hidden;
}
/* @media all and (max-width:767px) */
.callbackkiller .whatsapp-notifier__inner-wrapp {
position: relative;
background: #139c14;
padding: 5px 5px 5px 15px;
border-radius: 13px;
right: -250px;
}
.alert .alert-link, .close {
font-weight: 700;
}
.close, .list-group-item > .badge {
float: right;
}
.close {
font-size: 21px;
line-height: 1;
color: #000;
text-shadow: 0px 1px 0px #fff;
opacity: 0.2;
filter: alpha(opacity=20);
}
.callbackkiller span {
-webkit-transform: none !important;
transform: none !important;
}
/* @media all and (max-width:767px) */
.callbackkiller .whatsapp-notifier__close {
z-index: 999;
opacity: 1;
font-size: 18px;
color: #aeaeae !important;
width: 25px;
height: 24px;
text-align: center;
position: relative;
right: 195px;
top: -2px;
}
/* @media all and (max-width:767px) */
.callbackkiller .whatsapp-notifier__body {
color: #fff !important;
font-size: 14px;
line-height: 18px;
font-weight: bold;
text-align: center;
}
/* @media all and (max-width:767px) */
.callbackkiller .whatsapp__message-count {
position: absolute;
width: 20px;
height: 20px;
border-radius: 50%;
background-color: #ff360e;
font-size: 12px;
line-height: 21px;
color: #fff !important;
text-align: center;
z-index: 1000000;
right: 0px;
display: none;
}
.cbk-phone .cbk-phone-bgr {
background-color: #f44336;
border-radius: 60px !important;
-webkit-border-radius: 60px !important;
height: 100% !important;
opacity: 0.95;
width: 100% !important;
}
.cbk-phone .cbk-phone-bgr, .cbk-phone .cbk-phone-phone {
left: 0px !important;
position: absolute !important;
top: 0px !important;
z-index: 9997 !important;
}
.cbk-phone .cbk-phone-bgr {
background-color: rgba(19, 156, 20, 1) !important;
}
.callbackkiller.cbk-phone.cbk-phone-pulse .cbk-phone-circle {
background-color: rgba(19, 156, 20, 1) !important;
}
/* @media all and (max-width:767px) */
.callbackkiller.whatsapp.cbk-phone .cbk-phone-bgr, .callbackkiller.whatsapp.cbk-phone.cbk-phone-pulse .cbk-phone-circle, .callbackkiller.whatsapp.cbk-phone.cbk-phone-pulse .cbk-phone-second_circle, .callbackkiller.whatsapp.cbk-phone.cbk-phone-pulse .cbk-phone-third_circle {
background-color: rgba(19, 156, 20, 1) !important;
}
.cbk-multi-button-circle, .cbk-phone-circle {
transform-origin: center center 0px !important;
-moz-transform-origin: center center !important;
-webkit-transform-origin: center center 0px !important;
-o-transform-origin: center center !important;
-ms-transform-origin: center center !important;
}
.cbk-phone-pulse .cbk-phone-circle {
display: none;
position: fixed !important;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
margin: auto;
-webkit-border-radius: 100%;
-moz-border-radius: 100%;
-ms-border-radius: 100%;
-o-border-radius: 100%;
border-radius: 100%;
border: 2px solid transparent;
opacity: 0;
animation-play-state: running;
animation-duration: 12s;
animation-name: envybox-circle-pulse;
animation-iteration-count: infinite;
animation-timing-function: ease-in;
background-color: #a71933;
pointer-events: none;
}
.callbackkiller.cbk-phone.cbk-phone-pulse .cbk-phone-circle {
display: block;
-webkit-backface-visibility: visible !important;
}
.cbk-phone .cbk-phone-phone {
height: 60px !important;
margin: 24px;
width: 60px !important;
}
.cbk-phone .cbk-phone-content div {
display: block;
opacity: 0;
position: absolute !important;
-webkit-transform-origin: center center 0px;
transform-origin: center center 0px;
transform: perspective(400px) rotateY(-180deg) scale(0.4);
-moz-transform: perspective(400px) rotateY(-180deg) scale(.4);
-ms-transform: perspective(400px) rotateY(-180deg) scale(.4);
-webkit-transform: perspective(400px) rotateY(-180deg) scale(0.4);
-o-transform: perspective(400px) rotateY(-180deg) scale(.4);
-khtml-transform: perspective(400px) rotateY(-180deg) scale(.4);
-webkit-transition: all .8s cubic-bezier(.19,1,.22,1);
-moz-transition: all .8s cubic-bezier(.19,1,.22,1);
-o-transition: all .8s cubic-bezier(.19,1,.22,1);
transition: all .8s cubic-bezier(.19,1,.22,1);
}
.cbk-phone.cbk-phone-xs .cbk-phone-phone {
height: 30px !important;
margin: 12px;
width: 30px !important;
}
.cbk-phone .cbk-phone-content div.cbk-rotate-icon {
display: block !important;
opacity: 1 !important;
transform: perspective(400px) rotateY(0deg) scale(1) !important;
-moz-transform: perspective(400px) rotateY(0) scale(1) !important;
-ms-transform: perspective(400px) rotateY(0) scale(1) !important;
-webkit-transform: perspective(400px) rotateY(0deg) scale(1) !important;
-o-transform: perspective(400px) rotateY(0) scale(1) !important;
-khtml-transform: perspective(400px) rotateY(0) scale(1) !important;
-webkit-transform-style: preserve-3d !important;
-ms-transform-style: preserve-3d !important;
-o-transform-style: preserve-3d !important;
transform-style: preserve-3d !important;
-webkit-transition: opacity 3s cubic-bezier(.19,1,.22,1);
}
/* @media all and (max-width:767px) */
.callbackkiller.whatsapp.cbk-phone.cbk-phone-xs .cbk-phone-phone {
margin: 5px 0 0 6px;
height: 45px !important;
width: 45px !important;
}
/* @media all and (max-width:767px) */
.callbackkiller.whatsapp.cbk-phone.cbk-phone-xs .cbk-phone-phone img {
width: 100%;
}
</style>
<span class="callbackkiller whatsapp cbk-phone cbk-phone-xs cbk-phone-pulse cbk-phone-text-none"><a rel="nofollow" href="https://api.whatsapp.com/send?phone=<?=$phone;?>&text=<?= $message; ?>"><div class="whatsapp__message-count">1</div><div class="cbk-phone-bgr"></div><div class="cbk-phone-content"><div class="cbk-phone-phone cbk-rotate-icon"><img src="/image/mobutpanel_whatsapp.png" alt="whatsapp"></div></div><div class="cbk-phone-circle"></div><div class="cbk-phone-second_circle"></div><div class="cbk-phone-third_circle"></div></a><div class="whatsapp-notifier"><div class="whatsapp-notifier__inner-wrapp"><span class="whatsapp-notifier__close close close-fb">x</span><a rel="nofollow" href="https://api.whatsapp.com/send?phone=<?=$phone;?>&text=<?= $message; ?>"><div class="whatsapp-notifier__body">Написать в WhatsApp</div></a></div></div></span><!--/noindex--><!--googleon: all--><!--googleoff: all--><!--noindex--><div class="ktodostavit_frame popup"></div><!--/noindex--><!--googleon: all--><div id="fade_detail"></div>
<script type="text/javascript">
/* whatsapp widget */
$(".whatsapp-notifier__close").on("click", function () {
$( ".whatsapp-notifier__inner-wrapp" ).animate({ right: "-250px" }, 1000);
setTimeout(function () {
$(".whatsapp-notifier__inner-wrapp").animate({ right: "0" }, 1000);
}, 25000);
});
setTimeout(function () {
$(".whatsapp__message-count").show();
}, 10000);
setTimeout(function () {
$(".whatsapp-notifier__inner-wrapp").animate({ right: "0" }, 1000);
}, 12000);
/* /whatsapp widget */
</script>
Версия: Ocstore2.3
Тип модуля:для мобильных устройств

В течение минуты «загорается» и напоминает, чтобы пользователь может написать в Whatsapp. Напоминание закрывается по нажатию на кретстик

По нажатию на иконку происходит перенаправление на вотсаповскую форму

Телефон отправки сообщения и текст задаются настройками модуля в админке

Файлы модуля
Контроллер в админке
<?php class ControllerExtensionModuleMobutpanel extends Controller { private $error = array(); public function index() { $this->load->language('extension/module/mobutpanel'); $this->load->model('extension/module'); if (($this->request->server['REQUEST_METHOD'] == 'POST') && $this->validate()) { if (!isset($this->request->get['module_id'])) { $this->model_extension_module->addModule('mobutpanel', $this->request->post); } else { $this->model_extension_module->editModule($this->request->get['module_id'], $this->request->post); } // $this->session->data['success'] = $this->language->get('text_success'); $this->response->redirect($this->url->link('extension/extension', 'token=' . $this->session->data['token'] . '&type=module', true)); } $data['entry_phone'] = $this->language->get('entry_phone'); $data['entry_message'] = $this->language->get('entry_message'); $data['entry_status'] = $this->language->get('entry_status'); $data['entry_name'] = $this->language->get('entry_name'); $data['text_edit'] = $this->language->get('text_edit'); $data['heading_title'] = $this->language->get('heading_title'); $data['text_enabled'] = $this->language->get('text_enabled'); $data['text_disabled'] = $this->language->get('text_disabled'); $data['button_save'] = $this->language->get('button_save'); $data['button_cancel'] = $this->language->get('button_cancel'); if (isset($this->error['warning'])) { $data['error_warning'] = $this->error['warning']; } else { $data['error_warning'] = ''; } if (isset($this->error['name'])) { $data['error_name'] = $this->error['name']; } else { $data['error_name'] = ''; } if (isset($this->error['phone'])) { $data['error_phone'] = $this->error['phone']; } else { $data['error_phone'] = ''; } if (isset($this->error['message'])) { $data['error_message'] = $this->error['message']; } else { $data['error_message'] = ''; } $data['breadcrumbs'] = array(); $data['breadcrumbs'][] = array( 'text' => $this->language->get('text_home'), 'href' => $this->url->link('common/dashboard', 'token=' . $this->session->data['token'], true) ); $data['breadcrumbs'][] = array( 'text' => $this->language->get('text_extension'), 'href' => $this->url->link('extension/extension', 'token=' . $this->session->data['token'] . '&type=module', true) ); if (!isset($this->request->get['module_id'])) { $data['breadcrumbs'][] = array( 'text' => $this->language->get('heading_title'), 'href' => $this->url->link('extension/module/mobutpanel', 'token=' . $this->session->data['token'], true) ); } else { $data['breadcrumbs'][] = array( 'text' => $this->language->get('heading_title'), 'href' => $this->url->link('extension/module/mobutpanel', 'token=' . $this->session->data['token'] . '&module_id=' . $this->request->get['module_id'], true) ); } if (!isset($this->request->get['module_id'])) { $data['action'] = $this->url->link('extension/module/mobutpanel', 'token=' . $this->session->data['token'], true); } else { $data['action'] = $this->url->link('extension/module/mobutpanel', 'token=' . $this->session->data['token'] . '&module_id=' . $this->request->get['module_id'], true); } $data['cancel'] = $this->url->link('extension/extension', 'token=' . $this->session->data['token'] . '&type=module', true); if (isset($this->request->get['module_id']) && ($this->request->server['REQUEST_METHOD'] != 'POST')) { $module_info = $this->model_extension_module->getModule($this->request->get['module_id']); } if (isset($this->request->post['name'])) { $data['name'] = $this->request->post['name']; } elseif (!empty($module_info)) { $data['name'] = $module_info['name']; } else { $data['name'] = ''; } if (isset($this->request->post['phone'])) { $data['phone'] = $this->request->post['phone']; } elseif (!empty($module_info)) { $data['phone'] = $module_info['phone']; } else { $data['phone'] = '7'; } if (isset($this->request->post['message'])) { $data['message'] = $this->request->post['message']; } elseif (!empty($module_info)) { $data['message'] = $module_info['message']; } else { $data['message'] = 'Здравствуйте! Хочу получить консультацию.'; } if (isset($this->request->post['status'])) { $data['status'] = $this->request->post['status']; } elseif (!empty($module_info)) { $data['status'] = $module_info['status']; } else { $data['status'] = ''; } $data['header'] = $this->load->controller('common/header'); $data['column_left'] = $this->load->controller('common/column_left'); $data['footer'] = $this->load->controller('common/footer'); $this->response->setOutput($this->load->view('extension/module/mobutpanel', $data)); } protected function validate() { if (!$this->user->hasPermission('modify', 'extension/module/mobutpanel')) { $this->error['warning'] = $this->language->get('error_permission'); } if ((utf8_strlen($this->request->post['name']) < 3) || (utf8_strlen($this->request->post['name']) > 64)) { $this->error['name'] = $this->language->get('error_name'); } if (!$this->request->post['phone']) { $this->error['phone'] = $this->language->get('error_phone'); } if (!$this->request->post['message']) { $this->error['message'] = $this->language->get('error_message'); } return !$this->error; } }
Вьюшка в админке
<?php echo $header; ?><?php echo $column_left; ?> <div id="content"> <div class="page-header"> <div class="container-fluid"> <div class="pull-right"> <button type="submit" form="form-special" data-toggle="tooltip" title="<?php echo $button_save; ?>" class="btn btn-primary"><i class="fa fa-save"></i></button> <a href="<?php echo $cancel; ?>" data-toggle="tooltip" title="<?php echo $button_cancel; ?>" class="btn btn-default"><i class="fa fa-reply"></i></a></div> <ul class="breadcrumb"> <?php foreach ($breadcrumbs as $breadcrumb) { ?> <li><a href="<?php echo $breadcrumb['href']; ?>"><?php echo $breadcrumb['text']; ?></a></li> <?php } ?> </ul> </div> </div> <div class="container-fluid"> <?php if ($error_warning) { ?> <div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> <?php echo $error_warning; ?> <button type="button" class="close" data-dismiss="alert">×</button> </div> <?php } ?> <div class="panel panel-default"> <div class="panel-body"> <form action="<?php echo $action; ?>" method="post" enctype="multipart/form-data" id="form-special" class="form-horizontal"> <div class="form-group"> <label class="col-sm-2 control-label" for="input-name"><?php echo $entry_name; ?></label> <div class="col-sm-10"> <input type="text" name="name" value="<?php echo $name; ?>" placeholder="<?php echo $entry_name; ?>" id="input-name" class="form-control" /> <?php if ($error_name) { ?> <div class="text-danger"><?php echo $error_name; ?></div> <?php } ?> </div> </div> <div class="form-group"> <label class="col-sm-2 control-label" for="input-phone"><?php echo $entry_phone; ?></label> <div class="col-sm-10"> <input type="text" name="phone" value="<?php echo $phone; ?>" placeholder="<?php echo $entry_phone; ?>" id="input-phone" class="form-control" /> <?php if ($error_phone) { ?> <div class="text-danger"><?php echo $error_phone; ?></div> <?php } ?> </div> </div> <div class="form-group"> <label class="col-sm-2 control-label" for="input-phone"><?php echo $entry_message; ?></label> <div class="col-sm-10"> <input type="text" name="message" value="<?php echo $message; ?>" placeholder="<?php echo $entry_message; ?>" id="input-phone" class="form-control" /> <?php if ($error_message) { ?> <div class="text-danger"><?php echo $error_message; ?></div> <?php } ?> </div> </div> <div class="form-group"> <label class="col-sm-2 control-label" for="input-status"><?php echo $entry_status; ?></label> <div class="col-sm-10"> <select name="status" id="input-status" class="form-control"> <?php if ($status) { ?> <option value="1" selected="selected"><?php echo $text_enabled; ?></option> <option value="0"><?php echo $text_disabled; ?></option> <?php } else { ?> <option value="1"><?php echo $text_enabled; ?></option> <option value="0" selected="selected"><?php echo $text_disabled; ?></option> <?php } ?> </select> </div> </div> </form> </div> </div> </div> </div> <?php echo $footer; ?>
Контроллер на фронтенде
<?php class ControllerExtensionModuleMobutpanel extends Controller { public function index($setting) { $data['phone'] = $setting['phone']; $data['message'] = $setting['message']; if($this->isMobile()){ return $this->load->view('extension/module/mobutpanel', $data); } } public function isMobile() { return preg_match("/(android|avantgo|blackberry|bolt|boost|cricket|docomo|fone|hiptop|mini|mobi|palm|phone|pie|tablet|up\.browser|up\.link|webos|wos)/i", /*$_SERVER["HTTP_USER_AGENT"]*/$this->request->server['HTTP_USER_AGENT']); } }
Вьюшка на фронтенде
<style> .callbackkiller { box-sizing: content-box !important; font-size: 13px !important; font-weight: 300 !important; transform-origin: 50% 50% 0px; -webkit-box-shadow: 0 3px 12px rgba(0,0,0,.15); -moz-box-shadow: 0 3px 12px rgba(0,0,0,.15); box-shadow: 0px 3px 12px rgba(0,0,0,0.15); white-space: normal; } .close { text-shadow: none; } .callbackkiller, .callbackkiller * { color: #333 !important; font-family: CBKOpenSans,CBKRobotoLight,sans-serif !important; font-style: normal !important; text-transform: none !important; } .cbk-phone, .cbk-phone:hover { background-color: transparent !important; bottom: 5%; border-radius: 60px !important; -webkit-border-radius: 60px !important; color: #fff; display: block; font-size: 22px !important; height: 120px !important; left: auto; outline: none !important; overflow: hidden; padding: 0 !important; position: absolute; right: 20%; text-decoration: none; top: auto; width: 120px !important; z-index: 9999 !important; transition: none; -webkit-transition: none; } .cbk-phone-pulse, .cbk-phone-waves, .cbk-phone-wild, .multi-button-waves { overflow: visible !important; } .callbackkiller.whatsapp { display: none !important; } /* @media all and (max-width:767px) */ .callbackkiller.whatsapp { display: block !important; } .cbk-phone.cbk-phone-xs, .cbk-phone.cbk-phone-xs:hover { height: 60px !important; width: 60px !important; position: absolute; } /* @media all and (max-width:767px) */ .callbackkiller.cbk-phone.cbk-phone-pulse { --box-shadow-color: 0 9px 16px rgba(19,156,20,.6); } .callbackkiller.cbk-phone.cbk-phone-pulse { --box-shadow-color: 0 9px 16px rgba(255,34,65,.6); -webkit-animation: envybox-phone-pulse 12s infinite ease-in; -moz-animation: envybox-phone-pulse 12s infinite ease-in; -ms-animation: envybox-phone-pulse 12s infinite ease-in; -o-animation: envybox-phone-pulse 12s infinite ease-in; animation: envybox-phone-pulse 12s infinite ease-in; -webkit-backface-visibility: visible !important; } .callbackkiller.cbk-phone.cbk-phone-pulse { --box-shadow-color: 0 9px 16px rgba(19,156,20,1) !important; } /* @media all and (max-width:767px) */ .callbackkiller.whatsapp.cbk-phone.cbk-phone-xs { height: 57px !important; width: 57px !important; display: block; position: fixed; bottom: 10%; right: 4%; transform: scale(1); z-index: 5; } ul.tabs li span, .front_slider_wrapp .extended_pagination span, a, a span { -webkit-transition: color ease-out 0.07s; -moz-transition: color ease-out 0.07s; -o-transition: color ease-out 0.07s; transition: color ease-out 0.07s; } /* @media all and (max-width:767px) */ .callbackkiller .whatsapp-notifier { display: block; width: 227px; position: relative; top: 30px; left: -188px; overflow: hidden; } /* @media all and (max-width:767px) */ .callbackkiller .whatsapp-notifier__inner-wrapp { position: relative; background: #139c14; padding: 5px 5px 5px 15px; border-radius: 13px; right: -250px; } .alert .alert-link, .close { font-weight: 700; } .close, .list-group-item > .badge { float: right; } .close { font-size: 21px; line-height: 1; color: #000; text-shadow: 0px 1px 0px #fff; opacity: 0.2; filter: alpha(opacity=20); } .callbackkiller span { -webkit-transform: none !important; transform: none !important; } /* @media all and (max-width:767px) */ .callbackkiller .whatsapp-notifier__close { z-index: 999; opacity: 1; font-size: 18px; color: #aeaeae !important; width: 25px; height: 24px; text-align: center; position: relative; right: 195px; top: -2px; } /* @media all and (max-width:767px) */ .callbackkiller .whatsapp-notifier__body { color: #fff !important; font-size: 14px; line-height: 18px; font-weight: bold; text-align: center; } /* @media all and (max-width:767px) */ .callbackkiller .whatsapp__message-count { position: absolute; width: 20px; height: 20px; border-radius: 50%; background-color: #ff360e; font-size: 12px; line-height: 21px; color: #fff !important; text-align: center; z-index: 1000000; right: 0px; display: none; } .cbk-phone .cbk-phone-bgr { background-color: #f44336; border-radius: 60px !important; -webkit-border-radius: 60px !important; height: 100% !important; opacity: 0.95; width: 100% !important; } .cbk-phone .cbk-phone-bgr, .cbk-phone .cbk-phone-phone { left: 0px !important; position: absolute !important; top: 0px !important; z-index: 9997 !important; } .cbk-phone .cbk-phone-bgr { background-color: rgba(19, 156, 20, 1) !important; } .callbackkiller.cbk-phone.cbk-phone-pulse .cbk-phone-circle { background-color: rgba(19, 156, 20, 1) !important; } /* @media all and (max-width:767px) */ .callbackkiller.whatsapp.cbk-phone .cbk-phone-bgr, .callbackkiller.whatsapp.cbk-phone.cbk-phone-pulse .cbk-phone-circle, .callbackkiller.whatsapp.cbk-phone.cbk-phone-pulse .cbk-phone-second_circle, .callbackkiller.whatsapp.cbk-phone.cbk-phone-pulse .cbk-phone-third_circle { background-color: rgba(19, 156, 20, 1) !important; } .cbk-multi-button-circle, .cbk-phone-circle { transform-origin: center center 0px !important; -moz-transform-origin: center center !important; -webkit-transform-origin: center center 0px !important; -o-transform-origin: center center !important; -ms-transform-origin: center center !important; } .cbk-phone-pulse .cbk-phone-circle { display: none; position: fixed !important; top: 0px; left: 0px; right: 0px; bottom: 0px; margin: auto; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; border: 2px solid transparent; opacity: 0; animation-play-state: running; animation-duration: 12s; animation-name: envybox-circle-pulse; animation-iteration-count: infinite; animation-timing-function: ease-in; background-color: #a71933; pointer-events: none; } .callbackkiller.cbk-phone.cbk-phone-pulse .cbk-phone-circle { display: block; -webkit-backface-visibility: visible !important; } .cbk-phone .cbk-phone-phone { height: 60px !important; margin: 24px; width: 60px !important; } .cbk-phone .cbk-phone-content div { display: block; opacity: 0; position: absolute !important; -webkit-transform-origin: center center 0px; transform-origin: center center 0px; transform: perspective(400px) rotateY(-180deg) scale(0.4); -moz-transform: perspective(400px) rotateY(-180deg) scale(.4); -ms-transform: perspective(400px) rotateY(-180deg) scale(.4); -webkit-transform: perspective(400px) rotateY(-180deg) scale(0.4); -o-transform: perspective(400px) rotateY(-180deg) scale(.4); -khtml-transform: perspective(400px) rotateY(-180deg) scale(.4); -webkit-transition: all .8s cubic-bezier(.19,1,.22,1); -moz-transition: all .8s cubic-bezier(.19,1,.22,1); -o-transition: all .8s cubic-bezier(.19,1,.22,1); transition: all .8s cubic-bezier(.19,1,.22,1); } .cbk-phone.cbk-phone-xs .cbk-phone-phone { height: 30px !important; margin: 12px; width: 30px !important; } .cbk-phone .cbk-phone-content div.cbk-rotate-icon { display: block !important; opacity: 1 !important; transform: perspective(400px) rotateY(0deg) scale(1) !important; -moz-transform: perspective(400px) rotateY(0) scale(1) !important; -ms-transform: perspective(400px) rotateY(0) scale(1) !important; -webkit-transform: perspective(400px) rotateY(0deg) scale(1) !important; -o-transform: perspective(400px) rotateY(0) scale(1) !important; -khtml-transform: perspective(400px) rotateY(0) scale(1) !important; -webkit-transform-style: preserve-3d !important; -ms-transform-style: preserve-3d !important; -o-transform-style: preserve-3d !important; transform-style: preserve-3d !important; -webkit-transition: opacity 3s cubic-bezier(.19,1,.22,1); } /* @media all and (max-width:767px) */ .callbackkiller.whatsapp.cbk-phone.cbk-phone-xs .cbk-phone-phone { margin: 5px 0 0 6px; height: 45px !important; width: 45px !important; } /* @media all and (max-width:767px) */ .callbackkiller.whatsapp.cbk-phone.cbk-phone-xs .cbk-phone-phone img { width: 100%; } </style> <span class="callbackkiller whatsapp cbk-phone cbk-phone-xs cbk-phone-pulse cbk-phone-text-none"><a rel="nofollow" href="https://api.whatsapp.com/send?phone=<?=$phone;?>&text=<?= $message; ?>"><div class="whatsapp__message-count">1</div><div class="cbk-phone-bgr"></div><div class="cbk-phone-content"><div class="cbk-phone-phone cbk-rotate-icon"><img src="/image/mobutpanel_whatsapp.png" alt="whatsapp"></div></div><div class="cbk-phone-circle"></div><div class="cbk-phone-second_circle"></div><div class="cbk-phone-third_circle"></div></a><div class="whatsapp-notifier"><div class="whatsapp-notifier__inner-wrapp"><span class="whatsapp-notifier__close close close-fb">x</span><a rel="nofollow" href="https://api.whatsapp.com/send?phone=<?=$phone;?>&text=<?= $message; ?>"><div class="whatsapp-notifier__body">Написать в WhatsApp</div></a></div></div></span><!--/noindex--><!--googleon: all--><!--googleoff: all--><!--noindex--><div class="ktodostavit_frame popup"></div><!--/noindex--><!--googleon: all--><div id="fade_detail"></div> <script type="text/javascript"> /* whatsapp widget */ $(".whatsapp-notifier__close").on("click", function () { $( ".whatsapp-notifier__inner-wrapp" ).animate({ right: "-250px" }, 1000); setTimeout(function () { $(".whatsapp-notifier__inner-wrapp").animate({ right: "0" }, 1000); }, 25000); }); setTimeout(function () { $(".whatsapp__message-count").show(); }, 10000); setTimeout(function () { $(".whatsapp-notifier__inner-wrapp").animate({ right: "0" }, 1000); }, 12000); /* /whatsapp widget */ </script>