Video icon 64
Learning to code? Skill up faster with our practical video courses. Start your free trial today.
Advertisement

Quick Tip: Create A WordPress Global Options Page

by

WordPress is a great platform to build customized websites in a very efficient way. WordPress manages all this magic in only 11 database tables. wp_options is one of the tables and it acts as the mind of a WordPress powered website.

This table stores all the information related to your website like site name, site description slogan, site URL and lots of other things. All this information can be grabbed easily using the get_option() function, you just need to pass the field name which you want to get. For example: get_option('home') will return the URL of the home page.

But WordPress doesn't give the opportunity to add new options to this table which can be grabbed easily. So here is a tutorial which creates a new page in your WordPress admin and on that page you can save your custom global options.


What Will We Get?

If you want to store your Twitter ID then just follow this tutorial and you will get your Twitter ID using get_option('twitterid') in the active theme of your WordPress installation.


Code

Here is the code block, where I will go through each step of the code. You just need to place this code block in your functions.php file of your active theme and you are done.


Step 1 Add Admin Menu

This step will just add a new menu for the admin with which we can view our page.

add_action('admin_menu', 'add_global_custom_options');

Step 2 Assign a Function Which Parses the Admin Form

Here we will assign the custom function which will create a form.

	function add_global_custom_options()
	{
		add_options_page('Global Custom Options', 'Global Custom Options', 'manage_options', 'functions','global_custom_options');
	}

Step 3 Create a Function Which Generates the Form

<?php
function global_custom_options()
{
?>
	<div class="wrap">
		<h2>Global Custom Options</h2>
		<form method="post" action="options.php">
			<?php wp_nonce_field('update-options') ?>
			<p><strong>Twitter ID:</strong><br />
				<input type="text" name="twitterid" size="45" value="<?php echo get_option('twitterid'); ?>" />
			</p>
			<p><input type="submit" name="Submit" value="Store Options" /></p>
			<input type="hidden" name="action" value="update" />
			<input type="hidden" name="page_options" value="twitterid" />
		</form>
	</div>
<?php
}
?>

Please note that this form is for only one field for now. If you want to make it for more fields the you just have to follow the below two steps for each.

1 – Place a new textbox with a unique name. For example if you want to store a Facebook page link then it would be like below:

<p><strong>Facebook Page Links:</strong><br />
	<input type="text" name="fb_link" size="45" value="<?php echo get_option('fb_link'); ?>" />
</p>

2 – You need to update the value of the hidden field with the name "page_options", in this case it should be updated to the below value.

<input type="hidden" name="page_options" value="twitterid,fb_link" />

You can see that all option names are added here separated by a comma(,). Without this step nothing will work as expected.


How to Use?

After placing the above code in functions.php have a look at the admin page. You will find a new link in your Admin Menu called "Global Custom Options".

Just enter your values in that form and you are good to go for using those values in your theme files like "get_option('twitterid')".


Future Enhancement

This is just a sample code block with which you will come to understand how this feature could work. If you wanted, you could then extend this functionality to code a plugin with which you could create these fields dynamically and generate the form accordingly.

Do you think you'll find this code useful in your themes? Let us know what you think of it in the comments.


Update: While this article shows a quick way to achieve a particular result, it does not strictly adhere to best practices. Recommended reading on this topic: Using The Settings API: Part 1 – Create A Theme Options Page

Advertisement