PluginProbe
Taboola / trunk
Taboola vtrunk
1.0.4 1.0.5 1.0.6 1.0.8 2.0.1 2.0.2 2.1.0 2.1.1 2.2.2 2.2.3 3.0.0 3.0.1 3.0.2 3.1.0 trunk 1.0 1.0.1 1.0.10 1.0.11 1.0.12 1.0.13 1.0.14 1.0.15 1.0.2 1.0.3
← All changes | settings.php +100 -21 3.0.0trunk View file →
@@ -20,14 +20,22 @@
20 20 <a href="#tab2" class="nav-tab" id="tab2-link">Web Push</a>
21 21 </h2>
22 22
23 23 <?php
24 - if($_SERVER['REQUEST_METHOD'] == 'POST' && count($taboola_errors) == 0){
24 + if($_SERVER['REQUEST_METHOD'] == 'POST' && count($taboola_errors) == 0 && $taboola_save_error == ''){
25 25 echo "<div class='label-success'>";
26 26 echo "<h3 style='color:green;'>Changes applied!</h3>";
27 27 echo "<span>Verify the new changes by browsing to your site.</span>";
28 28 echo "</div>";
29 29 }
30 +
31 + if($taboola_save_error != ''){
32 + echo "<div class='label-error'>";
33 + echo "<h3 style='color:red;'>Settings were not saved</h3>";
34 + echo "<p>".esc_html($taboola_save_error)."</p>";
35 + echo "<p><b>All values</b> have been reverted to the last successful save.</p>";
36 + echo "</div>";
37 + }
30 38
31 39 if(count($taboola_errors) > 0){
32 40 echo "<div class='label-error'>";
33 41 echo "<h3 style='color:red;'>Missing or incorrect values</h3>";
@@ -237,11 +245,27 @@
237 245 <label>Placement Name:</label>
238 246 <input class="widefat" type="text" name="mid_placement[]" value="<?php echo esc_attr($widget->placement ?? ''); ?>" placeholder="Mid Article Thumbnails" />
239 247 </div>
240 248 </div>
249 + <div class='heading_mid_home'><label style="float:left;">Position the widget immediately below the element:</label>
250 + <div class='tooltip'>
251 + <!-- <i class="fa fa-question-circle" aria-hidden="true"></i> -->
252 + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="helpTooltip__icon___1XWGN">
253 + <g fill="none" fill-rule="evenodd"><path fill="currentColor" d="M12 2c5.52 0 10 4.48 10 10s-4.48 10-10 10S2 17.52 2 12 6.48 2 12 2zm-1 15.505v.99c0 .291.226.505.505.505h.99c.291 0 .505-.226.505-.505v-.99a.497.497 0 0 0-.505-.505h-.99a.497.497 0 0 0-.505.505zm4.07-6.255c.57-.57.93-1.37.93-2.25 0-2.21-1.79-4-4-4S8 6.79 8 9h2c0-1.1.9-2 2-2s2 .9 2 2c0 .55-.22 1.05-.59 1.41l-1.24 1.26C11.45 12.4 11 13.4 11 14.5v.5h2c0-1.5.45-2.1 1.17-2.83l.9-.92z"></path>
254 + </g>
255 + </svg>
256 + <div>The widget will be placed <i>just beneath</i> this element.<br><br>
257 + To target an element, 2 pieces of information are needed:<br><br>
258 + i) A CSS selector - e.g. <i>p</i> (for paragraph).<br>
259 + ii) An occurrence - e.g. 1st, 2nd, 3rd, etc.<br><br>
260 + For more information, see the <a href="https://developers.taboola.com/web-integrations/docs/wordpress-plugin-managing-placements" target='_blank'>Taboola Dev Center</a>.
261 + </div>
262 + </div>
263 + </div>
264 +
241 265 <div style="display: flex; flex-wrap: wrap; margin-top: 10px;">
242 266 <div style="flex: 1; min-width: 200px; padding-right: 10px;">
243 - <label>Position below:</label>
267 + <label>Position:</label>
244 268 <select class="widefat mid-widget-type-selector" name="mid_paragraph_ui_mode[]">
245 269 <option value="Paragraph" <?php echo !isset($widget->location_string) || $widget->location_string === 'p' ? 'selected' : ''; ?>>Paragraph</option>
246 270 <option value="Other" <?php echo isset($widget->location_string) && $widget->location_string !== 'p' ? 'selected' : ''; ?>>Other (Custom)</option>
247 271 </select>
@@ -285,30 +309,44 @@
285 309 onclick="setEnabledDisabled('#category_widget', this)"
286 310 name="category_enabled"/>
287 311 <span class="slider round"></span>
288 312 </label>
289 - <b style="font-size:15px;">Category (Section Page)</b>
290 - <div class='tooltip'>
291 - <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
292 - viewBox="0 0 24 24" fill="currentColor" class="helpTooltip__icon___1XWGN">
293 - <g fill="none" fill-rule="evenodd">
294 - <path fill="currentColor"
295 - d="M12 2c5.52 0 10 4.48 10 10s-4.48 10-10 10S2 17.52 2 12 6.48 2 12 2zm-1 15.505v.99c0 .291.226.505.505.505h.99c.291 0 .505-.226.505-.505v-.99a.497.497 0 0 0-.505-.505h-.99a.497.497 0 0 0-.505.505zm4.07-6.255c.57-.57.93-1.37.93-2.25 0-2.21-1.79-4-4-4S8 6.79 8 9h2c0-1.1.9-2 2-2s2 .9 2 2c0 .55-.22 1.05-.59 1.41l-1.24 1.26C11.45 12.4 11 13.4 11 14.5v.5h2c0-1.5.45-2.1 1.17-2.83l.9-.92z"></path>
296 - </g>
297 - </svg>
298 - <div>Settings will be applied to all Category/Section archive pages on your site.</div>
299 -</div>
313 + <b style="font-size:15px;float: left;">Category (Section Page)</b>
314 + <div class='tooltip'>
315 + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="helpTooltip__icon___1XWGN">
316 + <g fill="none" fill-rule="evenodd"><path fill="currentColor" d="M12 2c5.52 0 10 4.48 10 10s-4.48 10-10 10S2 17.52 2 12 6.48 2 12 2zm-1 15.505v.99c0 .291.226.505.505.505h.99c.291 0 .505-.226.505-.505v-.99a.497.497 0 0 0-.505-.505h-.99a.497.497 0 0 0-.505.505zm4.07-6.255c.57-.57.93-1.37.93-2.25 0-2.21-1.79-4-4-4S8 6.79 8 9h2c0-1.1.9-2 2-2s2 .9 2 2c0 .55-.22 1.05-.59 1.41l-1.24 1.26C11.45 12.4 11 13.4 11 14.5v.5h2c0-1.5.45-2.1 1.17-2.83l.9-.92z"></path>
317 + </g>
318 + </svg>
319 + <div>Settings will be applied to all 'Category/Section' pages on your site.</div>
320 + </div>
321 + </div>
300 322
301 - </div>
302 -
303 323 <div class="label_below">
324 +
304 325 <div class="mode_style">
305 - <label id="category_widget_id_label" style="float:left;">Mode&nbsp;(Widget&nbsp;ID):</label>
306 - </div>
307 - <div class="placement_style">
308 - <label id="category_placement_label" style="float:left;">Placement&nbsp;Name:</label>
309 - </div>
310 - </div>
326 + <label id="category_widget_id_label" style="float:left;">Mode (Widget ID):</label>
327 + <div class='tooltip'>
328 + <!-- <i class="fa fa-question-circle" aria-hidden="true"></i> -->
329 + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="helpTooltip__icon___1XWGN">
330 + <g fill="none" fill-rule="evenodd"><path fill="currentColor" d="M12 2c5.52 0 10 4.48 10 10s-4.48 10-10 10S2 17.52 2 12 6.48 2 12 2zm-1 15.505v.99c0 .291.226.505.505.505h.99c.291 0 .505-.226.505-.505v-.99a.497.497 0 0 0-.505-.505h-.99a.497.497 0 0 0-.505.505zm4.07-6.255c.57-.57.93-1.37.93-2.25 0-2.21-1.79-4-4-4S8 6.79 8 9h2c0-1.1.9-2 2-2s2 .9 2 2c0 .55-.22 1.05-.59 1.41l-1.24 1.26C11.45 12.4 11 13.4 11 14.5v.5h2c0-1.5.45-2.1 1.17-2.83l.9-.92z"></path>
331 + </g>
332 + </svg>
333 + <div>Your <i>category</i> Mode (Widget ID), as provided by Taboola.</div>
334 + </div>
335 + </div>
336 +
337 + <div class="placement_style"><label id="category_placement_label" style="float:left;">Placement Name:</label>
338 + <div class='tooltip'>
339 + <!-- <i class="fa fa-question-circle" aria-hidden="true"></i> -->
340 + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="helpTooltip__icon___1XWGN">
341 + <g fill="none" fill-rule="evenodd"><path fill="currentColor" d="M12 2c5.52 0 10 4.48 10 10s-4.48 10-10 10S2 17.52 2 12 6.48 2 12 2zm-1 15.505v.99c0 .291.226.505.505.505h.99c.291 0 .505-.226.505-.505v-.99a.497.497 0 0 0-.505-.505h-.99a.497.497 0 0 0-.505.505zm4.07-6.255c.57-.57.93-1.37.93-2.25 0-2.21-1.79-4-4-4S8 6.79 8 9h2c0-1.1.9-2 2-2s2 .9 2 2c0 .55-.22 1.05-.59 1.41l-1.24 1.26C11.45 12.4 11 13.4 11 14.5v.5h2c0-1.5.45-2.1 1.17-2.83l.9-.92z"></path>
342 + </g>
343 + </svg>
344 + <div>Your <i>category</i> Placement Name, as provided by Taboola.</div>
345 + </div>
346 + </div>
347 + </div>
348 +
311 349
312 350 <div class="input_below">
313 351 <div class="widget_below">
314 352 <input id="category_widget_id" type="text"
@@ -321,14 +359,55 @@
321 359 name="category_placement" placeholder="Placement Name"/>
322 360 </div>
323 361 </div>
324 362
363 + <div class='heading_mid_home'><label style="float:left;">Position the widget immediately below the element:</label>
364 + <div class='tooltip'>
365 + <!-- <i class="fa fa-question-circle" aria-hidden="true"></i> -->
366 + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="helpTooltip__icon___1XWGN">
367 + <g fill="none" fill-rule="evenodd"><path fill="currentColor" d="M12 2c5.52 0 10 4.48 10 10s-4.48 10-10 10S2 17.52 2 12 6.48 2 12 2zm-1 15.505v.99c0 .291.226.505.505.505h.99c.291 0 .505-.226.505-.505v-.99a.497.497 0 0 0-.505-.505h-.99a.497.497 0 0 0-.505.505zm4.07-6.255c.57-.57.93-1.37.93-2.25 0-2.21-1.79-4-4-4S8 6.79 8 9h2c0-1.1.9-2 2-2s2 .9 2 2c0 .55-.22 1.05-.59 1.41l-1.24 1.26C11.45 12.4 11 13.4 11 14.5v.5h2c0-1.5.45-2.1 1.17-2.83l.9-.92z"></path>
368 + </g>
369 + </svg>
370 + <div>The widget will be placed <i>just beneath</i> this element.<br><br>
371 + To target an element, 2 pieces of information are needed:<br><br>
372 + i) A CSS selector - e.g. <i>p</i> (for paragraph).<br>
373 + ii) An occurrence - e.g. 1st, 2nd, 3rd, etc.<br><br>
374 + For more information, see the <a href="https://developers.taboola.com/web-integrations/docs/wordpress-plugin-managing-placements" target='_blank'>Taboola Dev Center</a>.
375 + </div>
376 + </div>
377 + </div>
378 +
325 379 <div class="home_occurrence">
326 380 <div class="mode_style_home_selector">
327 381 <label id="category_location_string_label" style="float:left;">CSS selector&nbsp;:</label>
382 + <div class='tooltip'>
383 + <!-- <i class="fa fa-question-circle" aria-hidden="true"></i> -->
384 + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="helpTooltip__icon___1XWGN">
385 + <g fill="none" fill-rule="evenodd"><path fill="currentColor" d="M12 2c5.52 0 10 4.48 10 10s-4.48 10-10 10S2 17.52 2 12 6.48 2 12 2zm-1 15.505v.99c0 .291.226.505.505.505h.99c.291 0 .505-.226.505-.505v-.99a.497.497 0 0 0-.505-.505h-.99a.497.497 0 0 0-.505.505zm4.07-6.255c.57-.57.93-1.37.93-2.25 0-2.21-1.79-4-4-4S8 6.79 8 9h2c0-1.1.9-2 2-2s2 .9 2 2c0 .55-.22 1.05-.59 1.41l-1.24 1.26C11.45 12.4 11 13.4 11 14.5v.5h2c0-1.5.45-2.1 1.17-2.83l.9-.92z"></path>
386 + </g>
387 + </svg>
388 + <div>
389 + The element to target - e.g.:<br><br>
390 + <i>section</i> - to target a <i>section</i>.<br>
391 + <i>#my-id</i> - to target an <i>ID</i> of "my-id".<br>
392 + <i>.my-class</i> - to target a <i>class</i> of "my-class".
393 + </div>
394 + </div>
395 +
328 396 </div>
329 397 <div class="placement_style_home_occurrence">
330 398 <label id="category_occurrence_label" style="float:left;">Occurrence&nbsp;:</label>
399 + <div class='tooltip'>
400 + <!-- <i class="fa fa-question-circle" aria-hidden="true"></i> -->
401 + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="helpTooltip__icon___1XWGN">
402 + <g fill="none" fill-rule="evenodd"><path fill="currentColor" d="M12 2c5.52 0 10 4.48 10 10s-4.48 10-10 10S2 17.52 2 12 6.48 2 12 2zm-1 15.505v.99c0 .291.226.505.505.505h.99c.291 0 .505-.226.505-.505v-.99a.497.497 0 0 0-.505-.505h-.99a.497.497 0 0 0-.505.505zm4.07-6.255c.57-.57.93-1.37.93-2.25 0-2.21-1.79-4-4-4S8 6.79 8 9h2c0-1.1.9-2 2-2s2 .9 2 2c0 .55-.22 1.05-.59 1.41l-1.24 1.26C11.45 12.4 11 13.4 11 14.5v.5h2c0-1.5.45-2.1 1.17-2.83l.9-.92z"></path>
403 + </g>
404 + </svg>
405 + <div>For a <b>non-unique</b> selector - e.g. <i>section</i> - fill in the <b>occurrence</b> to target.<br><br>
406 + E.g. To target the <b>2nd</b> section, fill in <i>2</i>. <br><br>
407 + For a <b>unique</b> selector - e.g. <i>#my-id</i> - leave the default value of '1'.</div>
408 + </div>
409 +
331 410 </div>
332 411 </div>
333 412
334 413 <div class="home_placement">