Simple Social Icons - Version 0.9.0

Version Description

  • Initial Beta Release
Download this release

Release Info

Developer nathanrice
Plugin Icon 128x128 Simple Social Icons
Version 0.9.0
Comparing to
See all releases

Version 0.9.0

images/sprite_24x24.png ADDED
Binary file
images/sprite_32x32.png ADDED
Binary file
images/sprite_48x48.png ADDED
Binary file
readme.txt ADDED
@@ -0,0 +1,30 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ === Plugin Name ===
2
+ Contributors: nathanrice, studiopress
3
+ Tags: social media, social networking, social profiles
4
+ Requires at least: 3.3
5
+ Tested up to: 3.3.1
6
+ Stable tag: 0.9.0
7
+
8
+ This plugin/widget allows you to insert social icons in any widget area.
9
+
10
+ == Description ==
11
+
12
+ Simple Social Icons is an easy to use, customizable way to display icons that link visitors to your various social profiles. With it, you can easily choose which profiles to link to, customize the color and size of your icons, as well as align them to the left or right, all from the widget form (no settings page necessary!).
13
+
14
+ == Installation ==
15
+
16
+ 1. Upload the entire simple-social-icons folder to the /wp-content/plugins/ directory
17
+ 1. Activate the plugin through the 'Plugins' menu in WordPress
18
+ 1. In your Widgets menu, simply drag the widget labeled "Simple Social Icons" into a widgetized Area.
19
+ 1. Configure the widget by choosing a title, icon size and color, and the URLs to your various social profiles.
20
+
21
+ == Frequently Asked Questions ==
22
+
23
+ = Can I reorder the icons? =
24
+
25
+ No, not at this time.
26
+
27
+ == Changelog ==
28
+
29
+ = 0.9.0 =
30
+ * Initial Beta Release
simple-social-icons.php ADDED
@@ -0,0 +1,344 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+ /*
3
+ Plugin Name: Simple Social Icons
4
+ Plugin URI: http://www.studiopress.com/plugins/simple-social-icons
5
+ Description: A simple, CSS and sprite driven social icons widget.
6
+ Author: Nathan Rice
7
+ Author URI: http://www.nathanrice.net/
8
+
9
+ Version: 0.9.0
10
+
11
+ License: GNU General Public License v2.0 (or later)
12
+ License URI: http://www.opensource.org/licenses/gpl-license.php
13
+ */
14
+
15
+ class Simple_Social_Icons_Widget extends WP_Widget {
16
+
17
+ /**
18
+ * Default widget values.
19
+ *
20
+ * @var array
21
+ */
22
+ protected $defaults;
23
+
24
+ /**
25
+ * Default widget values.
26
+ *
27
+ * @var array
28
+ */
29
+ protected $sizes;
30
+
31
+ /**
32
+ * Default widget values.
33
+ *
34
+ * @var array
35
+ */
36
+ protected $profiles;
37
+
38
+ /**
39
+ * Constructor method.
40
+ *
41
+ * Set some global values and create widget.
42
+ */
43
+ function __construct() {
44
+
45
+ /**
46
+ * Default widget option values.
47
+ */
48
+ $this->defaults = array(
49
+ 'title' => '',
50
+ 'new_window' => 0,
51
+ 'size' => 32,
52
+ 'border_radius' => 6,
53
+ 'background_color' => '#999999',
54
+ 'background_color_hover' => '#666666',
55
+ 'alignment' => 'alignleft',
56
+ 'facebook' => '',
57
+ 'gplus' => '',
58
+ 'linkedin' => '',
59
+ 'pinterest' => '',
60
+ 'rss' => '',
61
+ 'twitter' => '',
62
+ );
63
+
64
+ /**
65
+ * Icon sizes.
66
+ */
67
+ $this->sizes = array( '24', '32', '48' );
68
+
69
+ /**
70
+ * Social profile choices.
71
+ */
72
+ $this->profiles = array(
73
+ 'facebook' => array(
74
+ 'label' => __( 'Facebook URI', 'ssiw' ),
75
+ 'pattern' => '<li class="social-facebook"><a href="%s" %s>Facebook</a></li>',
76
+ 'background_positions' => array(
77
+ '24' => '0 0',
78
+ '32' => '0 0',
79
+ '48' => '0 0',
80
+ )
81
+ ),
82
+ 'gplus' => array(
83
+ 'label' => __( 'Google+ URI', 'ssiw' ),
84
+ 'pattern' => '<li class="social-gplus"><a href="%s" %s>Google+</a></li>',
85
+ 'background_positions' => array(
86
+ '24' => '-24px 0',
87
+ '32' => '-32px 0',
88
+ '48' => '-48px 0',
89
+ )
90
+ ),
91
+ 'linkedin' => array(
92
+ 'label' => __( 'Linkedin URI', 'ssiw' ),
93
+ 'pattern' => '<li class="social-linkedin"><a href="%s" %s>Linkedin</a></li>',
94
+ 'background_positions' => array(
95
+ '24' => '-48px 0',
96
+ '32' => '-64px 0',
97
+ '48' => '-96px 0',
98
+ )
99
+ ),
100
+ 'pinterest' => array(
101
+ 'label' => __( 'Pinterest URI', 'ssiw' ),
102
+ 'pattern' => '<li class="social-pinterest"><a href="%s" %s>Pinterest</a></li>',
103
+ 'background_positions' => array(
104
+ '24' => '-72px 0',
105
+ '32' => '-96px 0',
106
+ '48' => '-144px 0',
107
+ )
108
+ ),
109
+ 'rss' => array(
110
+ 'label' => __( 'RSS URI', 'ssiw' ),
111
+ 'pattern' => '<li class="social-rss"><a href="%s" %s>RSS</a></li>',
112
+ 'background_positions' => array(
113
+ '24' => '-96px 0',
114
+ '32' => '-128px 0',
115
+ '48' => '-192px 0',
116
+ )
117
+ ),
118
+ 'twitter' => array(
119
+ 'label' => __( 'Twitter URI', 'ssiw' ),
120
+ 'pattern' => '<li class="social-twitter"><a href="%s" %s>Twitter</a></li>',
121
+ 'background_positions' => array(
122
+ '24' => '-120px 0',
123
+ '32' => '-160px 0',
124
+ '48' => '-240px 0',
125
+ )
126
+ ),
127
+ );
128
+
129
+ $widget_ops = array(
130
+ 'classname' => 'simple-social-icons',
131
+ 'description' => __( 'Displays select social icons.', 'ssiw' ),
132
+ );
133
+
134
+ $control_ops = array(
135
+ 'id_base' => 'simple-social-icons',
136
+ #'width' => 505,
137
+ #'height' => 350,
138
+ );
139
+
140
+ $this->WP_Widget( 'simple-social-icons', __( 'Simple Social Icons', 'ssiw' ), $widget_ops, $control_ops );
141
+
142
+ /** Load CSS in <head> */
143
+ add_action( 'wp_head', array( $this, 'css' ) );
144
+
145
+ }
146
+
147
+ /**
148
+ * Widget Form.
149
+ *
150
+ * Outputs the widget form that allows users to control the output of the widget.
151
+ *
152
+ */
153
+ function form( $instance ) {
154
+
155
+ /** Merge with defaults */
156
+ $instance = wp_parse_args( (array) $instance, $this->defaults );
157
+ ?>
158
+
159
+ <p><label for="<?php echo $this->get_field_id( 'title' ); ?>"><?php _e( 'Title:' ); ?></label> <input class="widefat" id="<?php echo $this->get_field_id( 'title' ); ?>" name="<?php echo $this->get_field_name( 'title' ); ?>" type="text" value="<?php echo esc_attr( $instance['title'] ); ?>" /></p>
160
+
161
+ <p><label><input id="<?php echo $this->get_field_id( 'new_window' ); ?>" type="checkbox" name="<?php echo $this->get_field_name( 'new_window' ); ?>" value="1" <?php checked( 1, $instance['new_window'] ); ?>/> <?php esc_html_e( 'Open links in new window?', 'ssiw' ); ?></label></p>
162
+
163
+ <p>
164
+ <label for="<?php echo $this->get_field_id( 'size' ); ?>"><?php _e( 'Icon Size', 'ssiw' ); ?>:</label>
165
+ <select id="<?php echo $this->get_field_id( 'size' ); ?>" name="<?php echo $this->get_field_name( 'size' ); ?>">
166
+ <?php
167
+ foreach ( (array) $this->sizes as $size ) {
168
+ printf( '<option value="%d" %s>%dpx</option>', (int) $size, selected( $size, $instance['size'], 0 ), (int) $size );
169
+ }
170
+ ?>
171
+ </select>
172
+ </p>
173
+
174
+ <p><label for="<?php echo $this->get_field_id( 'border_radius' ); ?>"><?php _e( 'Icon Border Radius:', 'ssiw' ); ?></label> <input id="<?php echo $this->get_field_id( 'border_radius' ); ?>" name="<?php echo $this->get_field_name( 'border_radius' ); ?>" type="text" value="<?php echo esc_attr( $instance['border_radius'] ); ?>" size="3" />px</p>
175
+
176
+ <p><label for="<?php echo $this->get_field_id( 'background_color' ); ?>"><?php _e( 'Icon Color:', 'ssiw' ); ?></label> <input id="<?php echo $this->get_field_id( 'background_color' ); ?>" name="<?php echo $this->get_field_name( 'background_color' ); ?>" type="text" value="<?php echo esc_attr( $instance['background_color'] ); ?>" size="8" /></p>
177
+
178
+ <p><label for="<?php echo $this->get_field_id( 'background_color_hover' ); ?>"><?php _e( 'Hover Color:', 'ssiw' ); ?></label> <input id="<?php echo $this->get_field_id( 'background_color_hover' ); ?>" name="<?php echo $this->get_field_name( 'background_color_hover' ); ?>" type="text" value="<?php echo esc_attr( $instance['background_color_hover'] ); ?>" size="8" /></p>
179
+
180
+ <p>
181
+ <label for="<?php echo $this->get_field_id( 'alignment' ); ?>"><?php _e( 'Alignment', 'ssiw' ); ?>:</label>
182
+ <select id="<?php echo $this->get_field_id( 'alignment' ); ?>" name="<?php echo $this->get_field_name( 'alignment' ); ?>">
183
+ <option value="alignleft" <?php selected( 'alignright', $instance['alignment'] ) ?>><?php _e( 'Align Left', 'ssiw' ); ?></option>
184
+ <option value="alignright" <?php selected( 'alignright', $instance['alignment'] ) ?>><?php _e( 'Align Right', 'ssiw' ); ?></option>
185
+ </select>
186
+ </p>
187
+
188
+ <hr style="background: #ccc; border: 0; height: 1px; margin: 20px 0;" />
189
+
190
+ <?php
191
+ foreach ( (array) $this->profiles as $profile => $data ) {
192
+
193
+ printf( '<p><label for="%s">%s:</label>', esc_attr( $this->get_field_id( $profile ) ), esc_attr( $data['label'] ) );
194
+ printf( '<input type="text" id="%s" class="widefat" name="%s" value="%s" /></p>', esc_attr( $this->get_field_id( $profile ) ), esc_attr( $this->get_field_name( $profile ) ), esc_url( $instance[$profile] ) );
195
+
196
+ }
197
+
198
+ }
199
+
200
+ /**
201
+ * Form validation and sanitization.
202
+ *
203
+ * Runs when you save the widget form. Allows you to validate or sanitize widget options before they are saved.
204
+ *
205
+ */
206
+ function update( $newinstance, $oldinstance ) {
207
+
208
+ foreach ( $newinstance as $key => $value ) {
209
+
210
+ /** Border radius must not be empty, must be a digit */
211
+ if ( 'border_radius' == $key && ( '' == $value || ! ctype_digit( $value ) ) ) {
212
+ $newinstance[$key] = 0;
213
+ }
214
+
215
+ /** Validate hex code colors */
216
+ elseif ( strpos( $key, '_color' ) && 0 == preg_match( '/^#(([a-fA-F0-9]{3}$)|([a-fA-F0-9]{6}$))/', $value ) ) {
217
+ $newinstance[$key] = $oldinstance[$key];
218
+ }
219
+
220
+ /** Sanitize Profile URIs */
221
+ elseif ( array_key_exists( $key, (array) $this->profiles ) ) {
222
+ $newinstance[$key] = esc_url( $newinstance[$key] );
223
+ }
224
+
225
+ }
226
+
227
+ return $newinstance;
228
+
229
+ }
230
+
231
+ /**
232
+ * Widget Output.
233
+ *
234
+ * Outputs the actual widget on the front-end based on the widget options the user selected.
235
+ *
236
+ */
237
+ function widget( $args, $instance ) {
238
+
239
+ extract( $args );
240
+
241
+ /** Merge with defaults */
242
+ $instance = wp_parse_args( (array) $instance, $this->defaults );
243
+
244
+ echo $before_widget;
245
+
246
+ if ( ! empty( $instance['title'] ) )
247
+ echo $before_title . apply_filters( 'widget_title', $instance['title'], $instance, $this->id_base ) . $after_title;
248
+
249
+ $output = '';
250
+
251
+ $new_window = $instance['new_window'] ? 'target="_blank"' : '';
252
+
253
+ foreach ( (array) $this->profiles as $profile => $data ) {
254
+ if ( ! empty( $instance[$profile] ) )
255
+ $output .= sprintf( $data['pattern'], esc_url( $instance[$profile] ), $new_window );
256
+ }
257
+
258
+ if ( $output )
259
+ printf( '<ul class="%s">%s</ul>', $instance['alignment'], $output );
260
+
261
+ echo $after_widget;
262
+
263
+ }
264
+
265
+ /**
266
+ * Custom CSS.
267
+ *
268
+ * Outputs custom CSS to control the look of the icons.
269
+ */
270
+ function css() {
271
+
272
+ /** Pull widget settings, merge with defaults */
273
+ $all_instances = $this->get_settings();
274
+ $instance = wp_parse_args( $all_instances[$this->number], $this->defaults );
275
+
276
+ /** The image locations */
277
+ $imgs = array(
278
+ '24' => plugin_dir_url( __FILE__ ) . 'images/sprite_24x24.png',
279
+ '32' => plugin_dir_url( __FILE__ ) . 'images/sprite_32x32.png',
280
+ '48' => plugin_dir_url( __FILE__ ) . 'images/sprite_48x48.png'
281
+ );
282
+
283
+ /** The CSS to output */
284
+ $css = '.simple-social-icons .alignleft, .simple-social-icons .alignright {
285
+ margin: 0; padding: 0;
286
+ }
287
+ .simple-social-icons ul li {
288
+ background: none; border: none; float: left;
289
+ }
290
+ .simple-social-icons ul li a,
291
+ .simple-social-icons ul li a:hover {
292
+ background: ' . $instance['background_color'] . ' url(' . $imgs[$instance['size']] . ') no-repeat;
293
+ -moz-border-radius: ' . $instance['border_radius'] . 'px
294
+ -webkit-border-radius: ' . $instance['border_radius'] . 'px;
295
+ border-radius: ' . $instance['border_radius'] . 'px;
296
+ display: block;
297
+ height: ' . $instance['size'] . 'px;
298
+ margin: 0 5px;
299
+ overflow: hidden;
300
+ padding: 0;
301
+ text-indent: -999px;
302
+ width: ' . $instance['size'] . 'px;
303
+ }
304
+
305
+ .simple-social-icons ul li a:hover {
306
+ background-color: ' . $instance['background_color_hover'] . ';
307
+ }';
308
+
309
+ /** Individual Profile button styles */
310
+ foreach ( (array) $this->profiles as $profile => $data ) {
311
+
312
+ if ( ! $instance[$profile] )
313
+ continue;
314
+
315
+ $css .= '.simple-social-icons ul li.social-' . $profile . ' a,
316
+ .simple-social-icons ul li.social-' . $profile . ' a:hover {
317
+ background-position: ' . $data['background_positions'][$instance['size']] . ';
318
+ }';
319
+
320
+ }
321
+
322
+ /** Minify a bit */
323
+ $css = str_replace( "\t", '', $css );
324
+ $css = str_replace( array( "\n", "\r" ), ' ', $css );
325
+
326
+ /** Echo the CSS */
327
+ echo '<style type="text/css" media="screen">' . $css . '</style>';
328
+
329
+ }
330
+
331
+ }
332
+
333
+ add_action( 'widgets_init', 'ssiw_load_widget' );
334
+ /**
335
+ * Widget Registration.
336
+ *
337
+ * Register Simple Social Icons widget.
338
+ *
339
+ */
340
+ function ssiw_load_widget() {
341
+
342
+ register_widget( 'Simple_Social_Icons_Widget' );
343
+
344
+ }