Version Description
- Initial Beta Release
Download this release
Release Info
Developer | nathanrice |
Plugin | Simple Social Icons |
Version | 0.9.0 |
Comparing to | |
See all releases |
Version 0.9.0
- images/sprite_24x24.png +0 -0
- images/sprite_32x32.png +0 -0
- images/sprite_48x48.png +0 -0
- readme.txt +30 -0
- simple-social-icons.php +344 -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 |
+
}
|