Simple Full Screen Background Image

Version Description

Release Info

Developer	mordauk
Plugin	Simple Full Screen Background Image
Version	1.0
Comparing to
See all releases

simple-full-screen-background/includes/admin-page.php ADDED Viewed

	@@ -0,0 +1,91 @@


1	+ <?php
2	+
3	+ function fsb_admin_page() {
4	+
5	+ global $fsb_options;
6	+ ?>
7	+
8	+ <script type="text/javascript">
9	+ //<![CDATA[
10	+ jQuery(document).ready(function()
11	+ {
12	+ // Media Uploader
13	+ window.widgetFormfield = '';
14	+
15	+ jQuery('.upload_image_button').live('click', function() {
16	+ window.widgetFormfield = jQuery('.upload_field',jQuery(this).parent());
17	+ tb_show('Choose Image', 'media-upload.php?TB_iframe=true');
18	+ return false;
19	+ });
20	+
21	+ window.original_send_to_editor = window.send_to_editor;
22	+ window.send_to_editor = function(html) {
23	+ if (window.widgetFormfield) {
24	+ imgurl = jQuery('img',html).attr('src');
25	+ window.widgetFormfield.val(imgurl);
26	+ tb_remove();
27	+ }
28	+ else {
29	+ window.original_send_to_editor(html);
30	+ }
31	+ window.widgetFormfield = '';
32	+ window.imagefield = false;
33	+
34	+ jQuery('#fsb_preview_image').attr('src', imgurl);
35	+ }
36	+ });
37	+ //]]>
38	+ </script>
39	+
40	+ <div class="wrap">
41	+ <div id="fsb-wrap" class="fsb-help">
42	+ <h2>Full Screen Background Image</h2>
43	+ <?php
44	+ if ( ! isset( $_REQUEST['updated'] ) )
45	+ $_REQUEST['updated'] = false;
46	+ ?>
47	+ <?php if ( false !== $_REQUEST['updated'] ) : ?>
48	+ <div class="updated fade"><p><strong><?php _e( 'Options saved' ); ?></strong></p></div>
49	+ <?php endif; ?>
50	+ <form method="post" action="options.php">
51	+
52	+ <?php settings_fields( 'fsb_register_settings' ); ?>
53	+
54	+ <h4>Choose Your Image</h4>
55	+
56	+ <p>
57	+ <input id="fsb_settings[image]" name="fsb_settings[image]" type="text" class="upload_field" value="<?php echo $fsb_options['image']; ?>"/>
58	+ <input class="upload_image_button" type="button" value="Choose Image"/>
59	+ <label class="description" for="fsb_settings[image]"><?php _e( 'This image will be applied to the background of your website' ); ?></label>
60	+ </p>
61	+
62	+ <p>
63	+ <?php if($fsb_options['image']) { ?>
64	+ <img src="<?php echo $fsb_options['image']; ?>" id="fsb_preview_image" style="padding: 3px; border: 1px solid #f0f0f0; max-width: 600px; overflow: hidden;"/>
65	+ <?php } else { ?>
66	+ <img src="<?php echo plugin_dir_url( __FILE__ ) . 'preview.jpg'; ?>" id="fsb_preview_image" style="padding: 3px; border: 1px solid #f0f0f0; max-width: 600px; overflow: hidden;"/>
67	+ <?php } ?>
68	+ </p>
69	+
70	+ <!-- save the options -->
71	+ <p class="submit">
72	+ <input type="submit" class="button-primary" value="<?php _e( 'Save Options' ); ?>" />
73	+ </p>
74	+
75	+
76	+ </form>
77	+ </div><!--end fsb-wrap-->
78	+ </div><!--end wrap-->
79	+ <?php
80	+
81	+ }
82	+ function fsb_init_admin() {
83	+ add_submenu_page( 'themes.php', 'Full Screen Background Image', 'Fullscreen BG Image', 'manage_options', 'full-screen-background', 'fsb_admin_page' );
84	+ }
85	+ add_action('admin_menu', 'fsb_init_admin');
86	+
87	+ // register the plugin settings
88	+ function fsb_register_settings() {
89	+ register_setting( 'fsb_register_settings', 'fsb_settings' );
90	+ }
91	+ add_action( 'admin_init', 'fsb_register_settings' );

simple-full-screen-background/includes/display-image.php ADDED Viewed

	@@ -0,0 +1,12 @@


1	+ <?php
2	+
3	+ function fsb_display_image() {
4	+ global $fsb_options;
5	+
6	+ if($fsb_options) {
7	+ $image = '<img src="' . $fsb_options['image'] . '" id="fsb_image"/>';
8	+ }
9	+ // output the image
10	+ echo $image;
11	+ }
12	+ add_action('wp_footer', 'fsb_display_image');

simple-full-screen-background/includes/fullscreen-image.css ADDED Viewed

	@@ -0,0 +1,21 @@


1	+ img#fsb_image {
2	+ /* Set rules to fill background */
3	+ min-height: 100%;
4	+ min-width: 1024px;
5	+
6	+ /* Set up proportionate scaling */
7	+ width: 100%;
8	+ height: auto;
9	+
10	+ /* Set up positioning */
11	+ position: fixed;
12	+ top: 0;
13	+ left: 0;
14	+ z-index: -9999;
15	+ }
16	+ @media screen and (max-width: 1024px) { /* Specific to this particular image */
17	+ img#fsb_image {
18	+ left: 50%;
19	+ margin-left: -512px; /* 50% */
20	+ }
21	+ }

simple-full-screen-background/includes/preview.jpg ADDED Viewed

Binary file

simple-full-screen-background/includes/scripts.php ADDED Viewed

	@@ -0,0 +1,6 @@


1	+ <?php
2	+
3	+ function fsb_load_css() {
4	+ wp_enqueue_style('fsb-image', plugin_dir_url( __FILE__ ) . 'fullscreen-image.css');
5	+ }
6	+ add_action('init', 'fsb_load_css');

simple-full-screen-background/readme.txt ADDED Viewed

	@@ -0,0 +1,35 @@


1	+ === Simple Full Screen Background Image ===
2	+ Author: Pippin Williamson
3	+ Author URI: http://pippinsplugins.com
4	+ Plugin URI: http://pippinspages.com/simple-fullscreen-background-image
5	+ Donate link: https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=72HGD7SA97KPE
6	+ Tags: background, fullscreen, image, bg image, full screen
7	+ Requires at least: 2.8
8	+ Tested up to: 3.2.1
9	+ Stable tag: 1.0
10	+
11	+ This plugin lets provides a simple way to set an automatically scaled full screen background image.
12	+
13	+ == Description ==
14	+
15	+ Simple Full Screen Background Image will allow you to easily upload and set a full screen image as the background of your website. Images will be automatically scaled
16	+ with the browser, so regardless of the browser size, the image will always fill the screen, even as the browser is resized live.
17	+
18	+ == Usage ==
19	+
20	+ Once activated, go to Appearance > Fullscreen BG Image. From here click Choose Image, then either upload from your computer or choose one from the media library.
21	+ Once you have chosen your image, select the size you wish to insert and click Insert Into Post. A preview of your image will appear below. Now click Save Options
22	+ and view your site. The image should now be applied as a full screen background image.
23	+
24	+ == Installation ==
25	+
26	+ 1. Upload the 'simple-full-screen-background' folder to the `/wp-content/plugins/` directory
27	+ 2. Activate the plugin through the 'Plugins' menu in WordPress
28	+
29	+ == Screenshots ==
30	+
31	+ Check out http://pippinsplugins.com/simple-fullscreen-background-image for screenshots and a demonstration video
32	+
33	+
34	+
35	+

simple-full-screen-background/screenshot-1.png ADDED Viewed

Binary file

simple-full-screen-background/screenshot-2.png ADDED Viewed

Binary file

simple-full-screen-background/screenshot-3.png ADDED Viewed

Binary file

simple-full-screen-background/simple-full-screen-background.php ADDED Viewed

	@@ -0,0 +1,21 @@


1	+ <?php
2	+ /*
3	+ Plugin Name: Simple Full Screen Background Image
4	+ Description: Easily set an automatically scaled full-screen background image
5	+ Version: 1.0
6	+ Author: Pippin Williamson
7	+ Author URI: http://pippinsplugins.com
8	+ */
9	+
10	+ /*****************************************
11	+ * global
12	+ *****************************************/
13	+
14	+ $fsb_options = get_option('fsb_settings');
15	+
16	+ /*****************************************
17	+ * includes
18	+ *****************************************/
19	+ include('includes/admin-page.php');
20	+ include('includes/display-image.php');
21	+ include('includes/scripts.php');

Simple Full Screen Background Image - Version 1.0

Version Description

Release Info

Version 1.0