Editor css la o tema wordpress.

In acest scurt tutorial o sa va arat ce coduri am facut pentru a avea un editor css la cea mai recenta tema pe care am facuto.

Un editor css in care sa faci diferite editari si sa nu mai stai sa il cauti in tot css-ul la tema.

1. Se creaza un fisier cu nemele edit-css.php in care se pune urmatorul cod:

[codesyntax lang=”php”]

<?php

function themeoptions_admin_menu()
{
  add_theme_page("Theme Options", __('Css Editor', 'blog'), 'edit_themes', basename(__FILE__), 'themeoptions_page');
}

function themeoptions_page() {
	if ( isset( $_POST['update_themeoptions'] ) ) { themeoptions_update(); }  //check options update
	?>
	<div class="wrap" style="margin-top:20px;border:1px solid #ddd;width:850px;padding:20px;box-shadow: 0 12px 10px -8px rgba(0, 0, 0, 0.4);;background:#EEEEEE;">
		<div id="icon-edit-pages" class="icon32"><br /></div>

		<h2><?php _e('Edit css'); ?></h2>
		<br />

	<form method="POST" action="">
	  <input type="hidden" name="update_themeoptions" value="true" />

		<table class="form-table" style="background:transparent;">
	     <tr valign="top" style="background:transparent;">
	      <td>  
          <textarea rows="30" cols="70" style="border:1px solid #aaa;font-size:15px;color:#444;" name="addcsstheme" id="addcsstheme">
          <?php echo get_option('addcss'); ?>
          </textarea>

          </td>
         </tr>

         <input type="submit" name="submit" value="<?php _e('Salveaza setarile', 'blog'); ?>" class="btn button-primary" style="text-shadow:none;" />
        </table>         

        <input class='button-primary' type='submit' name='Save' value='<?php _e('Salveaza setarile' , 'blog'); ?>' id='submitbutton' />

		</form>

	</div>
	<?php
}

add_action('admin_menu', 'themeoptions_admin_menu');

// Update options
function themeoptions_update(){

  if (isset($_POST['meniu'])=='on') { $display = 'checked'; } else { $display = ''; }
	update_option('meniu', $display);

    update_option('addcss', $_POST['addcsstheme']);

}

[/codesyntax]

2. Odata pus in tema el trebuie chemat in functions.php cu aceasta linie de cod:

[codesyntax lang=”php”]

require get_template_directory() . '/edit-css.php';

[/codesyntax]

In acest moment ar trebuii sa va apara in dashbord editorul.

3. Pentru a avea efect codurile scrise acolo mai trebuie adaugata o linie de cod in header.php inainte de wp_head

[codesyntax lang=”php”]

<style type="text/css">
<?php echo get_option('addcss'); ?>
</style>

[/codesyntax]

Eventualele nelamuriri ma puteti intreba.