<?php
if (!defined('ABSPATH')) {
exit("You must not access this file directly");
}
//get the settings
$tawktocustomise_settings = get_option('tawktocustomise_settings', [
'widget_position' => 'topRight',
'gradient_left' => '#27b469',
'gradient_right' => '#30c651',
'status' => 'active',
]);
?>
<div class="customise-tawk-to-widget-container">
<div class="customise-tawk-to-widget-container--header">
<h3>Customise Tawk.to Widget</h3>
</div>
<div class="customise-tawk-to-widget-container--body">
<div class="customise-tawk-to-main-body">
<div>
<h4>Site Widget Status</h4>
<div class="customise-tawk-to-widget-container--body--site-widget-status customise-tawk-to-widget-card ">
<div class="customise-toggler">
<input type="checkbox" id="customise-tawk-to-widget-switch" class="customise-toggler" <?php echo $tawktocustomise_settings['status'] == 'active' ? 'checked' : '' ?> /><label for="customise-tawk-to-widget-switch">Toggle</label>
</div>
<span>
<?php echo $tawktocustomise_settings['status'] == 'active' ? 'Active' : 'Inactive' ?>
</span>
</div>
</div>
<div class="cmt-3">
<h4>Widget Position</h4>
<div class="customise-tawk-to-widget-container--body--site-widget-position customise-tawk-to-widget-card">
<div class="customise-tawk-to-label">
<label for="widget_position">Widget Position</label>
<select name="widget_position" id="widget_position">
<option value="topRight" <?php echo selected($tawktocustomise_settings['widget_position'], 'topRight'); ?>>Top Right</option>
<option value="topLeft" <?php echo selected($tawktocustomise_settings['widget_position'], 'topLeft'); ?>>Top Left</option>
</select>
</div>
</div>
</div>
<div class="cmt-3">
<h4>Widget Appearance</h4>
<div class="customise-tawk-to-widget-container--body--site-widget-appearance customise-tawk-to-widget-card">
<div class="customise-tawk-to-label">
<label for="gradient_left">Gradient Left</label>
<input type="color" name="gradient_left" id="gradient_left" value="<?php echo esc_attr($tawktocustomise_settings['gradient_left']) ?>">
</div>
<hr class="cmb-1 cmt-1">
<div class="customise-tawk-to-label">
<label for="gradient_right">Gradient Right</label>
<input type="color" name="gradient_right" id="gradient_right" value="<?php echo esc_attr($tawktocustomise_settings['gradient_right']) ?>">
</div>
</div>
</div>
<div class="cmt-3">
<button class="customise-tawk-to-widget-container--body--site-widget-save" type="button">Save</button>
</div>
</div>
<div class="customise-ads-area">
<h2 class="customise-ads-header-title">OTHER AMAZING PLUGINS</h2>
<div class="customise-ads customise-ads-1">
<img src="<?php echo esc_url(ADVANCETAWKTOWIDGET_PLUGIN_URL . '/assets/img/terminal-africa.jpg') ?>" alt="Termianl Africa" class="customise-ads-image">
<div class="customise-ads-actions">
<h3>Terminal Africa</h3>
<div class="customise-ads-sub-action">
<a href="javascript:;" class="button-primary customise-ads-demo-video" data-type="47mu8w3" data-video="https://www.youtube.com/embed/gsk1AZ4hKYc">
Demo
</a>
<a href="javascript:;" class="button customise-ads-learn-more" data-type="47mu8w3" data-plugin-slug="terminal-africa">
Learn More
</a>
</div>
</div>
</div>
<div class="customise-ads customise-ads-1" style="margin-top: 20px;">
<img src="https://ps.w.org/codedeyo-google-trends-for-bloggers/assets/banner-772x250.png?rev=2928244" alt="Google Trends for WP" class="customise-ads-image">
<div class="customise-ads-actions">
<h3>Google Trends for WP</h3>
<div class="customise-ads-sub-action">
<a href="javascript:;" class="button-primary customise-ads-demo-video" data-type="3QI5HBW" data-video="https://www.youtube.com/embed/yJYo8ifhyyE?si=iZ2aI5LdCFpFJJYt">
Demo
</a>
<a href="javascript:;" class="button customise-ads-learn-more" data-type="3QI5HBW" data-plugin-slug="codedeyo-google-trends-for-bloggers">
Learn More
</a>
</div>
</div>
</div>
</div>
</div>
<!-- Modal dialog -->
<div class="modal">
<div class="modal-content">
<p class="close-action">
<span class="close-button">×</span>
</p>
<iframe width="560" height="315" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
</div>
</div>
|