< aboutcher />;

I had written this code a few years ago for use on a website although not the icon sprite I’m including… I needed to use it recently so I’ve decided to upload it here too..

I know it’s not the most elegant solution, but it works well over all browsers and fallbacks (no CSS) gracefully as a list, finally if there isn’t an actual icon available for your social networking site, then it will default to the ‘share this’ icon.

CSS:

/* =================================================
 * @package: Social Links
 * @author: Adam Boutcher <adam@aboutcher.co.uk>
 * @link: www.aboutcher.co.uk
 * @copyright: 2013
 * @internal: Default icon is "Share This"
 * Icons are CC-Attrib3 - www.awicons.com
 * ================================================= */
.social_links{margin:0;text-align:center;}.social_links .social_t{display:block;font-variant:small-caps;margin-bottom:5px;}
.social_links ul{display:inline-block;*display:inline;*zoom:1;list-style-type:none;margin:0 auto;padding:0;}
.social_links ul li{float:left;margin:0;padding:0;}.social_links .social_i{display:block;width:36px;height:36px;overflow:hidden;margin-right:5px;color:transparent;text-indent:-9999px;background:url('/images/icons/social_sprite.png') no-repeat;}
.social_links .social_i:hover{background-position:0 -36px;}.social_links ul>li:last-child .social_i{margin-right:0;}
.social_links .fb{background-position:-36px 0;}.social_links .fb:hover{background-position:-36px -36px;} /* Facebook */
.social_links .tw{background-position:-72px 0;}.social_links .tw:hover{background-position:-72px -36px;} /* Twitter */
.social_links .gp{background-position:-108px 0;}.social_links .gp:hover{background-position:-108px -36px;}/* Google+ */
.social_links .rs{background-position:-144px 0;}.social_links .rs:hover{background-position:-144px -36px;}/* RSS Feed */
.social_links .pt{background-position:-180px 0;}.social_links .pt:hover{background-position:-180px -36px;}/* Pintrest */
.social_links .li{background-position:-216px 0;}.social_links .li:hover{background-position:-216px -36px;}/* LinkedIn */
.social_links .yt{background-position:-252px 0;}.social_links .yt:hover{background-position:-252px -36px;}/* YouTube */
.social_links .em{background-position:-288px 0;}.social_links .em:hover{background-position:-288px -36px;}/* Email */
.social_links .ad{background-position:-324px 0;}.social_links .ad:hover{background-position:-324px -36px;}/* Add */
.social_links .rd{background-position:-360px 0;}.social_links .rd:hover{background-position:-360px -36px;}/* Reddit */
.social_links .su{background-position:-396px 0;}.social_links .su:hover{background-position:-396px -36px;}/* StumbleUpon */
.social_links .dl{background-position:-432px 0;}.social_links .dl:hover{background-position:-432px -36px;}/* Delicious */
.social_links .dg{background-position:-468px 0;}.social_links .dg:hover{background-position:-468px -36px;}/* Digg */
.social_links .gh{background-position:-504px 0;}.social_links .gh:hover{background-position:-504px -36px;}/* GitHub */
.social_links .cp{background-position:-540px 0;}.social_links .cp:hover{background-position:-540px -36px;}/* CodePen */

HTML:

Find us on:

	
Share
	
Facebook
	
Twitter
	
Google+
	
RSS Feed
	
Pintrest
	
LinkedIn
	
YouTube
	
Email
	
Add This
	
Reddit
	
StumbleUpon
	
Delicious
	
Digg
	
GitHub
	
CodePen

Image Sprite:

Social Media Icon Sprite

You can see a demo of it on the footer of this site too; I will try to include other sprites if I can find the time to make them.

Edit (6th July 2013):

Added GitHub to the icon list and changed the code to be a class over an id so it can be used multiple times in the same page; also added CodePen icon.

While using ldir within a different project, I found a couple of bugs releated to how it retrieves its own URL/URI so I figured out a better way of retrieving this information and updated ldir available to everyone else.

I have decided to deprecate the $GET parameter when using the function as it should now detect $_GET variables automatically and utilise them although this maybe still be a little buggy but the ultimate aim is for it to figure out the $_GET variables itself.

In the time it took me to write a post for version 1.8.0 I improved some of the $_GET parameter code so I incemented the version number to 1.8.1 and you can grab the latest version of ldir on its page as always

Changelog:

• Automatic $_GET variable detection
• Improved $_GET variable detection
• Microtime generation time in HTML comments
• Improved SELF detection for the link URL

Just because I spent about 2 hours looking for this info…

A rooted android device with busybox can easily release the DHCP allocated IP with the following commands

su
dhcpcd -k wlan0
dhcpcd -n wlan0

turn wifi on and off and now you should have a new DHCP IP rather than a renewed IP.

I’ve stared using the very powerful yet minimalistic text editor Sublime Text 2, one of the great features is the ability to customise it to your personal needs.

GPL v3

Some of the code I write I license under the GPL v3 but because the code is only a small function, I don’t want to include the full GPL in the source so I use the minimal header. To ease my life and make it quicker to include this minimal header in my code I have written a small snippet for Sublime to insert the minimal GPL.

Just type

**GPL**

and press tab to comete the code. This will then move the cursor to the program and description part where you pop the name and a brief description. You’ll probably want to change the copyright name to your own in the snippet.

To install the snippet just download it, open Sublime click Preferences > Browse Packages and put it in the user folder in there, then restart Sublime.

Sublime SMARTY Support

It took me a while to find the forum post so I’m reposting the info here, sublime actually supports smarty semi-natively but its not turned on, so here’s how to turn it back on…

1. Open file “Packages\HTML\HTML.tmLanguage”, if you search for string “<!–” you will notice that (currently) there is two references to “Smarty language” commented. Un-comment these.
2. Download the SMARTY.PLIST and rename it “Smarty.tmLanguage” and place in the user folder (Packages\User\).
3. Some colour schemes may not support it properly but idlefingers does so very well too.

I have just updated one of the many sites I help maintain, GimpFM, to bring it into a more modern web standard.

For those interested, I have used bootstrap as the base framework. I typically use Zurb’s Foundation but after a bit of hype I thought I’d give bootstrap a go.

Overall I’m pleased with the outcome of the site and bootstrap has potential and is very well featured but foundation seems faster and easier to make the site responsive during development.

Anyway, that’s all for now.