← All changes | settings.php +68 -20 1.0 → 1.0.4 View file →

		@@ -85,8 +85,26 @@
85	85	margin-top: 10px;
86	86	color: red;
87	87	}
88	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	+
89	107	</style>
90	108
91	109	<div class="taboola-container">
92	110	<img src='<?php echo $this->plugin_url.'img/taboola.png' ?>' style='width:200px;'/>
		@@ -96,9 +114,9 @@
96	114	<table>
97	115	<tr>
98	116	<td>Publisher ID</td>
99	117	<td>
100		- <input type="text" name="publisher_id" placeholder="publisher" value="<?php echo $settings->publisher_id ?>"/>
	118	+ <input type="text" name="publisher_id" placeholder="publisher" value="<?php echo htmlspecialchars($settings->publisher_id) ?>"/>
101	119	</td>
102	120	<td class='tooltip'>
103	121	<img src='<?php echo $this->plugin_url.'img/question-mark.png' ?>'/>
104	122	<div>Please contact your Taboola representative to receive the Publisher ID </div>
		@@ -115,9 +133,9 @@
115	133	<hr style='margin-bottom: 25px; margin-top: 5px;'>
116	134
117	135	<div class='checkbox'>
118	136	<input id="first_bc_enabled" type="checkbox" <?php echo $settings->first_bc_enabled ? "checked='checked'" : "" ?> name="first_bc_enabled"/>
119		- Taboola widget below article
	137	+ Below Article
120	138	</div>
121	139	<table>
122	140	<tr>
123	141	<td>Widget ID</td>
		@@ -128,20 +146,15 @@
128	146	<img src='<?php echo $this->plugin_url.'img/question-mark.png' ?>'/>
129	147	<div>Please contact your Taboola representative to receive the Widget ID</div>
130	148	</td>
131	149	</tr>
132		- <!-- <tr>
133		- <td>Custom CSS</td>
134		- <td>
135		- <input type="text" value="<?php echo $settings->first_bc_custom_css ?>" name="first_bc_custom_css" placeholder="Custom CSS" />
136		- </td>
137		- </tr>-->
	150	+
138	151	</table>
139	152	<hr>
140	153
141	154	<div class='checkbox'>
142	155	<input id="second_bc_enabled" type="checkbox" <?php echo $settings->second_bc_enabled ? "checked='checked'" : "" ?> name="second_bc_enabled"/>
143		- Taboola widget below the first one
	156	+ Below Article 2nd
144	157	</div>
145	158
146	159	<table>
147	160	<tr>
		@@ -146,9 +159,9 @@
146	159	<table>
147	160	<tr>
148	161	<td>Widget ID</td>
149	162	<td>
150		- <input type="text" value="<?php echo $settings->second_bc_widget_id ?>" name="second_bc_widget_id" placeholder="Widget ID" />
	163	+ <input type="text" value="<?php echo htmlspecialchars($settings->second_bc_widget_id) ?>" name="second_bc_widget_id" placeholder="Widget ID" />
151	164	</td>
152	165	<td class='tooltip'>
153	166	<img src='<?php echo $this->plugin_url.'img/question-mark.png' ?>'/>
154	167	<div>Please contact your Taboola representative to receive the Widget ID</div>
		@@ -153,18 +166,44 @@
153	166	<img src='<?php echo $this->plugin_url.'img/question-mark.png' ?>'/>
154	167	<div>Please contact your Taboola representative to receive the Widget ID</div>
155	168	</td>
156	169	</tr>
157		- <!-- <tr>
158		- <td>Custom CSS</td>
	170	+
	171	+ </table>
	172	+ <hr style='border-bottom: 1px solid #fafafa;'>
	173	+
	174	+ <?php $location_defined = (htmlspecialchars($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	+
	193	+ <tr>
	194	+ <td>Location</td>
159	195	<td>
160		- <input type="text" value="<?php echo $settings->second_bc_custom_css ?>" name="second_bc_custom_css" placeholder="Custom CSS" />
	196	+ <input type="text" value="<?php echo htmlspecialchars($settings->location_string) ?>" name="location_string" placeholder="" />
161	197	</td>
162		- </tr>-->
	198	+ <td class='tooltip'>
	199	+ <img src='<?php echo $this->plugin_url.'img/question-mark.png' ?>'/>
	200	+ <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>
	201	+ </td>
	202	+ </tr>
	203	+
163	204	</table>
164		- <hr style='border-bottom: 1px solid #fafafa;'>
165		-
166		- <input class='button-secondary' type="submit" value="Apply Changes ✔"/>
	205	+ <input class='button-secondary apply_button' type="submit" value="Apply Changes ✔"/>
167	206	<!-- <a class='request_link' href=' http://taboola.com/contact' target='_blank'>Request Widget</a> -->
168	207	</form>
169	208	<div style='clear:both'></div>
170	209	<?php
		@@ -180,12 +219,12 @@
180	219	</div>
181	220	<script>
182	221	function sync_checkboxes(){
183	222	if(jQuery('#first_bc_enabled').attr("checked")){
184		- jQuery('#second_bc_enabled').prop('disabled',false)
	223	+ jQuery('#second_bc_enabled').attr('disabled',false)
185	224	} else {
186		- jQuery('#second_bc_enabled').prop('checked', false);
187		- jQuery('#second_bc_enabled').prop('disabled',true)
	225	+ jQuery('#second_bc_enabled').attr('checked', false);
	226	+ jQuery('#second_bc_enabled').attr('disabled',true)
188	227	}
189	228	}
190	229	jQuery('#first_bc_enabled').change(sync_checkboxes);
191	230	setTimeout(function(){jQuery('.label-success').fadeOut()}, 6000);
		@@ -190,5 +229,14 @@
190	229	jQuery('#first_bc_enabled').change(sync_checkboxes);
191	230	setTimeout(function(){jQuery('.label-success').fadeOut()}, 6000);
192	231	setTimeout(function(){jQuery('.label-error').fadeOut()}, 6000);
193	232	sync_checkboxes()
	233	+
	234	+ jQuery('.toggle_intercept').click(function(){
	235	+ if (jQuery('.location_section').fadeToggle != undefined){
	236	+ jQuery('.location_section').fadeToggle('fast');
	237	+ }else{
	238	+ jQuery('.location_section').toggle();
	239	+ }
	240	+ jQuery('.toggle_icon').toggleClass('toggle_icon_on');
	241	+ });
194	242	</script>