Następnie dodałem funkcję, która doda opcje do panelu wordpressa z ustawieniami mojego plugina. Tutaj na uwagę zasługuje funkcja, która dodaje element do menu wordpressa o nazwie „add_menu_page” oraz podpięcie akcji pod menu za pomocą funkcji „add_action”. Zwróc też uwage na funkcję wp_editor(), która wyświetla ładny edytor WYSIWG w panelu admina.

function wfce_plugin_menu() {
    add_menu_page('WP Fancy Cookie', 'WP Fancy Cookie', 'administrator', 'wfce_settings', 'wfce_display_settings');
}
add_action('admin_menu', 'wfce_plugin_menu');

function wfce_display_settings(){
	$wfce_policy_url 				= get_option('wfce_policy_url');
	$wfce_accept_policy_button_text = get_option('wfce_accept_policy_button_text');
	$wfce_policy_text				= get_option('wfce_policy_text');
	$wfce_css_code					= get_option('wfce_css_code');
	
	
	echo '
	<h2>'.__('Settings').' WP Fancy Cookie version '.get_option('wfce_version').'</h2>
	<div class="wrap">
			<form action="options.php" name="options">
				<table class="form-table" width="100%" cellpadding="10">
					<tbody>
					<tr>
						<td scope="row" align="left">
						 <label>'.__("Policy url page").'</label>
						 </td>
						<td>
							<input type="text" name="wfce_policy_url" value="'.$wfce_policy_url.'">
						</td>
					</tr>
					<tr>
						<td scope="row" align="left" colspan="2">
							
						</td>
					</tr>
					<tr>
						<td scope="row" align="left">
						 <label>'.__("Accept policy button text").'</label>
						 </td>
						<td>
							<input type="text" name="wfce_accept_policy_button_text" value="'.$wfce_accept_policy_button_text.'">
						</td>
					</tr>
					<tr>
						<td scope="row" align="left">
						 <label>'.__("CSS code").'</label>
						 </td>
						<td>
							<textarea rows="15" name="wfce_css_code">'.$wfce_css_code.'</textarea>
							<input type="hidden" name="action" value="update'.__('Update').'" />
			 				<input type="hidden" name="page_options" value="wfce_policy_url" />
			 				
						</td>
					</tr>
					<tr>
						<td scope="row" align="left">
							Zapisz zmiany
						</td>
						<td>
							<input type="submit" name="Submit" value="'.__('Update').'" />
						</td>
					</tr>
					</tbody>
				</table>	
				'.wp_editor($wfce_policy_text,'wfce_policy_text').'
			</form>
	';
	
	echo '</div>';
}

Teraz czas na pliki js i css

@CHARSET "UTF-8";

#wfce_cookie{text-align:center; position:absolute; bottom: 0; left: 0; width: 100%; height:30px; padding-top:2px; float:left; z-index:1000; background-color:#fff; opacity: 0.9, moz-opacity:0.9;}

.wfce_btn_accept_light {
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) );
	background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
	background-color:#ededed;
	-webkit-border-top-left-radius:6px;
	-moz-border-radius-topleft:6px;
	border-top-left-radius:6px;
	-webkit-border-top-right-radius:6px;
	-moz-border-radius-topright:6px;
	border-top-right-radius:6px;
	-webkit-border-bottom-right-radius:6px;
	-moz-border-radius-bottomright:6px;
	border-bottom-right-radius:6px;
	-webkit-border-bottom-left-radius:6px;
	-moz-border-radius-bottomleft:6px;
	border-bottom-left-radius:6px;
	text-indent:0;
	border:1px solid #dcdcdc;
	display:inline-block;
	color:#777777;
	font-family:arial;
	font-size:12px;
	font-weight:bold;
	font-style:normal;
	height:27px;
	line-height:27px;
	width:68px; padding-left:3px; padding-right:3px;
	text-decoration:none;
	text-align:center;
	text-shadow:1px 1px 0px #ffffff;
}
.wfce_btn_accept_light:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed) );
	background:-moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed');
	background-color:#dfdfdf;
	cursor:pointer;
}.wfce_btn_accept_light:active {
	position:relative;
	top:1px;
}

.wfce_btn_accept_green {
	-moz-box-shadow:inset 0px 1px 0px 0px #c1ed9c;
	-webkit-box-shadow:inset 0px 1px 0px 0px #c1ed9c;
	box-shadow:inset 0px 1px 0px 0px #c1ed9c;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #9dce2c), color-stop(1, #8cb82b) );
	background:-moz-linear-gradient( center top, #9dce2c 5%, #8cb82b 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#9dce2c', endColorstr='#8cb82b');
	background-color:#9dce2c;
	-webkit-border-top-left-radius:6px;
	-moz-border-radius-topleft:6px;
	border-top-left-radius:6px;
	-webkit-border-top-right-radius:6px;
	-moz-border-radius-topright:6px;
	border-top-right-radius:6px;
	-webkit-border-bottom-right-radius:6px;
	-moz-border-radius-bottomright:6px;
	border-bottom-right-radius:6px;
	-webkit-border-bottom-left-radius:6px;
	-moz-border-radius-bottomleft:6px;
	border-bottom-left-radius:6px;
	text-indent:0;
	border:1px solid #83c41a;
	display:inline-block;
	color:#ffffff;
	font-family:Arial;
	font-size:12px;
	font-weight:bold;
	font-style:normal;
	height:27px;
	line-height:27px;
	width:68px; padding-left:3px; padding-right:3px;
	text-decoration:none;
	text-align:center;
	text-shadow:1px 1px 0px #689324;
}
.wfce_btn_accept_green:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #8cb82b), color-stop(1, #9dce2c) );
	background:-moz-linear-gradient( center top, #8cb82b 5%, #9dce2c 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#8cb82b', endColorstr='#9dce2c');
	background-color:#8cb82b;
	cursor:pointer;
}.wfce_btn_accept_green:active {
	position:relative;
	top:1px;
}

.wfce_btn_accept_blue {
	-moz-box-shadow:inset 0px 1px 0px 0px #bbdaf7;
	-webkit-box-shadow:inset 0px 1px 0px 0px #bbdaf7;
	box-shadow:inset 0px 1px 0px 0px #bbdaf7;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #79bbff), color-stop(1, #378de5) );
	background:-moz-linear-gradient( center top, #79bbff 5%, #378de5 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#79bbff', endColorstr='#378de5');
	background-color:#79bbff;
	-webkit-border-top-left-radius:6px;
	-moz-border-radius-topleft:6px;
	border-top-left-radius:6px;
	-webkit-border-top-right-radius:6px;
	-moz-border-radius-topright:6px;
	border-top-right-radius:6px;
	-webkit-border-bottom-right-radius:6px;
	-moz-border-radius-bottomright:6px;
	border-bottom-right-radius:6px;
	-webkit-border-bottom-left-radius:6px;
	-moz-border-radius-bottomleft:6px;
	border-bottom-left-radius:6px;
	text-indent:0;
	border:1px solid #84bbf3;
	display:inline-block;
	color:#ffffff;
	font-family:Arial;
	font-size:12px;
	font-weight:bold;
	font-style:normal;
	height:27px;
	line-height:27px;
	width:68px; padding-left:3px; padding-right:3px;
	text-decoration:none;
	text-align:center;
	text-shadow:1px 1px 0px #528ecc;
}
.wfce_btn_accept_blue:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #378de5), color-stop(1, #79bbff) );
	background:-moz-linear-gradient( center top, #378de5 5%, #79bbff 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#378de5', endColorstr='#79bbff');
	background-color:#378de5;
}.wfce_btn_accept_blue:active {
	position:relative;
	top:1px;
	cursor:pointer;
}
.wfce_btn_accept_pink {
	-moz-box-shadow:inset 0px 1px 0px 0px #fbafe3;
	-webkit-box-shadow:inset 0px 1px 0px 0px #fbafe3;
	box-shadow:inset 0px 1px 0px 0px #fbafe3;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ff5bb0), color-stop(1, #ef027d) );
	background:-moz-linear-gradient( center top, #ff5bb0 5%, #ef027d 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bb0', endColorstr='#ef027d');
	background-color:#ff5bb0;
	-webkit-border-top-left-radius:6px;
	-moz-border-radius-topleft:6px;
	border-top-left-radius:6px;
	-webkit-border-top-right-radius:6px;
	-moz-border-radius-topright:6px;
	border-top-right-radius:6px;
	-webkit-border-bottom-right-radius:6px;
	-moz-border-radius-bottomright:6px;
	border-bottom-right-radius:6px;
	-webkit-border-bottom-left-radius:6px;
	-moz-border-radius-bottomleft:6px;
	border-bottom-left-radius:6px;
	text-indent:0;
	border:1px solid #ee1eb5;
	display:inline-block;
	color:#ffffff;
	font-family:Arial;
	font-size:12px;
	font-weight:bold;
	font-style:normal;
	height:27px;
	line-height:27px;
	width:68px; padding-left:3px; padding-right:3px;
	text-decoration:none;
	text-align:center;
	text-shadow:1px 1px 0px #c70067;
}
.wfce_btn_accept_pink:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ef027d), color-stop(1, #ff5bb0) );
	background:-moz-linear-gradient( center top, #ef027d 5%, #ff5bb0 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ef027d', endColorstr='#ff5bb0');
	background-color:#ef027d;
	cursor:pointer;
}.wfce_btn_accept_pink:active {
	position:relative;
	top:1px;
}

Plik js:

(function($){
	$("#wfce_accept_btn").click(function (ev){
		$("#wfce_cookie").slideUp();
		ev.preventDefault();
	});
})(jQuery);

Strony: 1 2 3