| 1 |
<style> |
| 2 |
.taboola-container { |
| 3 |
padding: 20px; |
| 4 |
padding-left: 0; |
| 5 |
width: 400px; |
| 6 |
font-size: 14px; |
| 7 |
} |
| 8 |
table { |
| 9 |
width: 380px; |
| 10 |
margin-left: 20px; |
| 11 |
} |
| 12 |
table td img { |
| 13 |
position: relative; |
| 14 |
top: 3px; |
| 15 |
margin-left: 5px; |
| 16 |
} |
| 17 |
/* table { |
| 18 |
padding: 12px; |
| 19 |
border: 3px solid #467FD7; |
| 20 |
border-radius: 5px; |
| 21 |
margin-top: 10px; |
| 22 |
width: 100%; |
| 23 |
}*/ |
| 24 |
table tr td:first-child { |
| 25 |
width: 110px; |
| 26 |
} |
| 27 |
table input { |
| 28 |
width: 100%; |
| 29 |
} |
| 30 |
input[type='text'] { |
| 31 |
border-radius: 3px; |
| 32 |
} |
| 33 |
hr { |
| 34 |
margin-top: 15px; |
| 35 |
margin-bottom: 15px; |
| 36 |
border-bottom: none; |
| 37 |
} |
| 38 |
input[type='checkbox'] { |
| 39 |
|
| 40 |
} |
| 41 |
input[type='submit']{ |
| 42 |
float: right; |
| 43 |
} |
| 44 |
.checkbox { |
| 45 |
margin-bottom: 10px; |
| 46 |
} |
| 47 |
.request_link { |
| 48 |
float: right; |
| 49 |
margin-right: 10px; |
| 50 |
line-height: 26px; |
| 51 |
} |
| 52 |
table .tooltip { |
| 53 |
/* position:relative; |
| 54 |
top:50px; |
| 55 |
left:50px;*/ |
| 56 |
} |
| 57 |
.tooltip div { /* hide and position tooltip */ |
| 58 |
background-color: black; |
| 59 |
color: white; |
| 60 |
border-radius: 5px; |
| 61 |
opacity: 0; |
| 62 |
position: absolute; |
| 63 |
-webkit-transition: opacity 0.5s; |
| 64 |
-moz-transition: opacity 0.5s; |
| 65 |
-ms-transition: opacity 0.5s; |
| 66 |
-o-transition: opacity 0.5s; |
| 67 |
transition: opacity 0.5s; |
| 68 |
width: 200px; |
| 69 |
padding: 10px; |
| 70 |
margin-left: 30px; |
| 71 |
margin-top: -45px; |
| 72 |
} |
| 73 |
table .tooltip:hover div { /* display tooltip on hover */ |
| 74 |
opacity:1; |
| 75 |
} |
| 76 |
.label-success { |
| 77 |
font-size: 17px; |
| 78 |
display: block; |
| 79 |
margin-top: 10px; |
| 80 |
color: green; |
| 81 |
} |
| 82 |
.label-error { |
| 83 |
font-size: 17px; |
| 84 |
display: block; |
| 85 |
margin-top: 10px; |
| 86 |
color: red; |
| 87 |
} |
| 88 |
|
| 89 |
.toggle_icon{ |
| 90 |
background: url(<?php echo $this->plugin_url.'img/arrow_right_32.png' ?>) no-repeat; |
| 91 |
background-size:contain; |
| 92 |
width:24px; |
| 93 |
height:24px; |
| 94 |
display:inline-block; |
| 95 |
vertical-align: middle; |
| 96 |
} |
| 97 |
|
| 98 |
.toggle_icon_on{ |
| 99 |
-ms-transform: rotate(90deg); /* IE 9 */ |
| 100 |
-webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */ |
| 101 |
transform: rotate(90deg); |
| 102 |
} |
| 103 |
.apply_button{ |
| 104 |
margin-top: 20px !important; |
| 105 |
} |
| 106 |
|
| 107 |
</style> |
| 108 |
|
| 109 |
<div class="taboola-container"> |
| 110 |
<img src='<?php echo $this->plugin_url.'img/taboola.png' ?>' style='width:200px;'/> |
| 111 |
<hr> |
| 112 |
|
| 113 |
<form method="POST"> |
| 114 |
<table> |
| 115 |
<tr> |
| 116 |
<td>Publisher ID</td> |
| 117 |
<td> |
| 118 |
<input type="text" name="publisher_id" placeholder="publisher" value="<?php echo !empty($settings->publisher_id) ? htmlspecialchars($settings->publisher_id) : '' ?>"/> |
| 119 |
</td> |
| 120 |
<td class='tooltip'> |
| 121 |
<img src='<?php echo $this->plugin_url.'img/question-mark.png' ?>'/> |
| 122 |
<div>Please contact your Taboola representative to receive the Publisher ID </div> |
| 123 |
</td> |
| 124 |
</tr> |
| 125 |
<tr> |
| 126 |
<td colspan='2' style='line-height: 26px; font-size: 13px;'> |
| 127 |
Don't have a Publisher ID? |
| 128 |
<a style='float: inherit; margin-left:5px;' class='request_link' href=' https://taboola.com/contact' target='_blank'>Contact Taboola</a> |
| 129 |
</td> |
| 130 |
</tr> |
| 131 |
</table> |
| 132 |
|
| 133 |
<hr style='margin-bottom: 25px; margin-top: 5px;'> |
| 134 |
|
| 135 |
<div class='checkbox'> |
| 136 |
<input id="first_bc_enabled" type="checkbox" <?php echo !empty($settings->first_bc_enabled) ? "checked='checked'" : "" ?> name="first_bc_enabled"/> |
| 137 |
Below Article |
| 138 |
</div> |
| 139 |
<table> |
| 140 |
<tr> |
| 141 |
<td>Widget ID</td> |
| 142 |
<td> |
| 143 |
<input type="text" value="<?php echo !empty($settings->first_bc_widget_id) ? htmlspecialchars($settings->first_bc_widget_id) : '' ?>" name="first_bc_widget_id" placeholder="Widget ID" /> |
| 144 |
</td> |
| 145 |
<td class='tooltip'> |
| 146 |
<img src='<?php echo $this->plugin_url.'img/question-mark.png' ?>'/> |
| 147 |
<div>Please contact your Taboola representative to receive the Widget ID</div> |
| 148 |
</td> |
| 149 |
</tr> |
| 150 |
|
| 151 |
</table> |
| 152 |
<hr> |
| 153 |
|
| 154 |
<div class='checkbox'> |
| 155 |
<input id="second_bc_enabled" type="checkbox" <?php echo !empty($settings->second_bc_enabled) ? "checked='checked'" : "" ?> name="second_bc_enabled"/> |
| 156 |
Below Article 2nd |
| 157 |
</div> |
| 158 |
|
| 159 |
<table> |
| 160 |
<tr> |
| 161 |
<td>Widget ID</td> |
| 162 |
<td> |
| 163 |
<input type="text" value="<?php echo !empty($settings->second_bc_widget_id) ? htmlspecialchars($settings->second_bc_widget_id) : '' ?>" name="second_bc_widget_id" placeholder="Widget ID" /> |
| 164 |
</td> |
| 165 |
<td class='tooltip'> |
| 166 |
<img src='<?php echo $this->plugin_url.'img/question-mark.png' ?>'/> |
| 167 |
<div>Please contact your Taboola representative to receive the Widget ID</div> |
| 168 |
</td> |
| 169 |
</tr> |
| 170 |
|
| 171 |
</table> |
| 172 |
<hr style='border-bottom: 1px solid #fafafa;'> |
| 173 |
|
| 174 |
<?php $location_defined = !empty($settings->location_string); ?> |
| 175 |
|
| 176 |
|
| 177 |
<div class='toggle_intercept checkbox'> |
| 178 |
<?php if ($location_defined): ?> |
| 179 |
<div class='toggle_icon toggle_icon_on'></div> |
| 180 |
Advanced Settings |
| 181 |
</div> |
| 182 |
<table class='location_section'> |
| 183 |
|
| 184 |
<?php else: ?> |
| 185 |
<div class='toggle_icon'></div> |
| 186 |
Advanced Settings |
| 187 |
</div> |
| 188 |
<table class='location_section' style='display:none'> |
| 189 |
|
| 190 |
<?php endif; ?> |
| 191 |
|
| 192 |
<tr> |
| 193 |
<td>Location</td> |
| 194 |
<td> |
| 195 |
<input type="text" value="<?php echo !empty($settings->location_string) ? htmlspecialchars($settings->location_string) : '' ?>" name="location_string" placeholder="" /> |
| 196 |
</td> |
| 197 |
<td class='tooltip'> |
| 198 |
<img src='<?php echo $this->plugin_url.'img/question-mark.png' ?>'/> |
| 199 |
<div>This field controls the location of these widgets on the page. If you would like to move your widget from its default location directly below the article a Taboola representative will provide you with the necessary information.</div> |
| 200 |
</td> |
| 201 |
</tr> |
| 202 |
<tr> |
| 203 |
<td colspan="2"> <div class='checkbox'> |
| 204 |
<input id="out_of_content_enabled" type="checkbox" <?php echo !empty($settings->out_of_content_enabled) ? "checked='checked'" : "" ?> name="out_of_content_enabled"/> |
| 205 |
Place widget after main content DOM element |
| 206 |
</div></td> |
| 207 |
<td class='tooltip'> |
| 208 |
<img src='<?php echo $this->plugin_url.'img/question-mark.png' ?>'/> |
| 209 |
<div>This may be disabled if your website doesn't use Taboola's "Read more" feature, or if the widget is not placed correctly. DO NOT disable it if your widget includes "Read More"</div> |
| 210 |
</td> |
| 211 |
|
| 212 |
</tr> |
| 213 |
|
| 214 |
</table> |
| 215 |
<input class='button-secondary apply_button' type="submit" value="Apply Changes ✔"/> |
| 216 |
<!-- <a class='request_link' href=' https://taboola.com/contact' target='_blank'>Request Widget</a> --> |
| 217 |
</form> |
| 218 |
<div style='clear:both'></div> |
| 219 |
|
| 220 |
<?php |
| 221 |
$logPublisher = empty($settings->publisher_id) ? "wordpressplugin" : $settings->publisher_id; |
| 222 |
$userDetails = wp_get_current_user(); |
| 223 |
$detailsString = $userDetails->first_name." ".$userDetails->last_name; |
| 224 |
?> |
| 225 |
<img src="https://logs-01.loggly.com/inputs/d14862f3-64ad-49ca-b28d-1b5d155414ec.gif?source=wp&type=settings&pub=<?=$logPublisher?>&user=<?=urlencode($detailsString)?>&email=<?=urlencode($userDetails->user_email)?>&url=<?=urlencode("//{$_SERVER['HTTP_HOST']}{$_SERVER['REQUEST_URI']}")?>"/> |
| 226 |
<!-- <form name="install_log" style="display:none;" method="post" action="http://logs-01.loggly.com/inputs/d14862f3-64ad-49ca-b28d-1b5d155414ec/tag/http/"> |
| 227 |
<input name="tim" type="hidden" value="<?=date("H:i:s.000")?>"> |
| 228 |
<input name="pub" type="hidden" value="<?=$logPublisher?>"> |
| 229 |
<input name="data" type="hideen" value="WORDPRESS_PLUGIN_INSTALL|<?="//{$_SERVER['HTTP_HOST']}{$_SERVER['REQUEST_URI']}|{$detailsString}"?>"> |
| 230 |
</form> --> |
| 231 |
|
| 232 |
<?php |
| 233 |
if($_SERVER['REQUEST_METHOD'] == 'POST' && count($taboola_errors) == 0){ |
| 234 |
echo "<span class='label-success'>Your changes have been made! You can now see them on your site</span>"; |
| 235 |
} |
| 236 |
|
| 237 |
if(count($taboola_errors) > 0){ |
| 238 |
for($i = 0; $i < count($taboola_errors); $i++){ |
| 239 |
echo "<span class='label-error'>".$taboola_errors[$i]."</span>"; |
| 240 |
} |
| 241 |
} |
| 242 |
?> |
| 243 |
</div> |
| 244 |
<script> |
| 245 |
function sync_checkboxes(){ |
| 246 |
if(jQuery('#first_bc_enabled').attr("checked")){ |
| 247 |
jQuery('#second_bc_enabled').attr('disabled',false) |
| 248 |
} else { |
| 249 |
jQuery('#second_bc_enabled').attr('checked', false); |
| 250 |
jQuery('#second_bc_enabled').attr('disabled',true) |
| 251 |
} |
| 252 |
} |
| 253 |
jQuery('#first_bc_enabled').change(sync_checkboxes); |
| 254 |
setTimeout(function(){jQuery('.label-success').fadeOut()}, 6000); |
| 255 |
setTimeout(function(){jQuery('.label-error').fadeOut()}, 6000); |
| 256 |
sync_checkboxes() |
| 257 |
|
| 258 |
jQuery('.toggle_intercept').click(function(){ |
| 259 |
if (jQuery('.location_section').fadeToggle != undefined){ |
| 260 |
jQuery('.location_section').fadeToggle('fast'); |
| 261 |
}else{ |
| 262 |
jQuery('.location_section').toggle(); |
| 263 |
} |
| 264 |
jQuery('.toggle_icon').toggleClass('toggle_icon_on'); |
| 265 |
}); |
| 266 |
|
| 267 |
window.onload = function(){ |
| 268 |
document.forms['install_log'].submit() |
| 269 |
|
| 270 |
} |
| 271 |
</script> |
| 272 |
|
