In this month’s featured article, we take a look at more than 40 jQuery plugins that can spice up your website. Our list includes all kinds of plugins to help you enhance different aspects of your site, including form, navigation, media elements, and the overall user interface. The list also includes plugins to simplify working with effects and animations, drag and drop, AJAX, and overlays. Don’t forget to also visit our jQuery Plugins category which showcases over 200 items.

jQuery Form Plugins

Uniform Uniform is a popular jQuery plugin that applies a consistent skinning to your form elements across all browsers. It does this by masking your standard form controls with custom themed controls. It works in sync with your real form elements to ensure accessibility and compatibility.

Recurly.js Recurly.js is a Javascript library designed to be easily embedded and customized form elements to match your website. The library performs in-line validation, real-time total calculations, and gracefully handles errors.

Ajax AutoComplete for jQuery Ajax Autocomplete for jQuery allows you to easily create autocomplete/autosuggest boxes for text input fields. Built with focus on performance – results for every query are cached and pulled from local cache for the same repeating query.

Chosen Chosen is a JavaScript plugin that makes long, unwieldy select boxes much more user-friendly. It is currently available in both jQuery and Prototype flavors.

Validation Validation is a plugin that makes client-side form validation trivial by offering lots of option for customization. It comes bundled with a useful set of validation methods, including URL and email validation and also includes an API to write your own methods.

In-Field Labels In-Field Labels jQuery Plugin turns properly formatted HTML forms into forms with in-field label support. Labels fade when the field is focussed and disappear when text entry begins. Clearing a field and leaving brings back the label.

Power PWChecker Power PWChecker is simple jQuery plugin can be integrated seamlessly with any online form (sign up form/ user registration form) to check password strength and give users clues for creating strong and secure passwords.

Form Wizard The form wizard plugin is a jQuery plugin which can be used to create wizard like page flows for forms without having to reload the page in between wizard steps. The plugin is unobtrusive and gives the developer great freedom on how they set up the flow of the different steps in their wizards.

jQuery Typography Plugins

Lettering.js Lettering.js brings radical web typography to your content. It does so by wrapping your text with span tags, allowing you to target CSS rules to individual letters, words or sentences.

FitText FitText is a plugin that makes font-sizes flexible. Use this plugin on your fluid or responsive layout to achieve scalable headlines that fill the width of a parent element.

Airport Airport is a rather simple text effect plugin for Jquery. It emulates the style of those flickering information boards you sometimes find on airports and train stations.

SlabText SlabText is a jQuery plugin for producing big, bold and responsive headline. It does so by splitting your headline into rows and assigning different font-weight to each row.

jQuery Content Presentation Plugins

jQuery News Ticker jQuery News Ticker brings a lightweight and easy to use news ticket to your site. You can set it to load content from an RSS feed or list elements. The speed, direction of text animation and other visual effects can be easily customized.

Booklet Booklet is a jQuery plugin for displaying content on the Web in a flipbook layout. You can place any sort of HTML elements inside of your booklet pages. It supports manual page turning, keyboard navigation and page numbers.

turn.js turn.js is a plugin for jQuery that adds a beautiful transition similar to real pages in a book or magazine for HTML5.

jQuery Collapse jQuery Collapse is a lightweight plugin that enables expanding and collapsing of content blocks. It includes feature like cookie persistence whereby which it will remember what’s visible and what’s not on each visitor’s visits.

jPages jPages is a client-side pagination plugin but it gives you a lot more features comparing to most of the other plugins for this purpose, such as auto page turn, key and scroll browse, showing items with delay and completely customizable navigation panel.

Masonry Masonry is a dynamic grid layout plugin for jQuery. Think of it as the flip-side of CSS floats. Whereas floating arranges elements horizontally then vertically, Masonry arranges elements vertically, positioning each element in the next open spot in the grid. The result minimizes vertical gaps between elements of varying height, just like a mason fitting stones in a wall.

PageSlide PageSlide is a jQuery plugin allows you to add slide interaction to your pages. When clicked, your main viewport will slide to reveal an additional interaction pane. This is pretty handy for revealing sidebar navigation or widgets in a web application.

Alert, Tooltip and Notification jQuery Plugins

Slide Note Slide Note is a jQuery plugin that makes it easy to display sliding notifications on your site or web application. It offers flexible positioning options, support for AJAX, CSS hooks and more.

Apprise Apprise is an alert box plugin that is very simple, fast and attractive. IT gives you complete control over style, content, position and functionality. Apprise is, more or less, for the developer who wants an attractive alert or dialog box without having to download a massive UI framework.

qTip2 qTip2 is an advanced tooltip plugin that is user-friendly yet featured rich. It provides you with features like rounded corners, speech bubble tips and is completely free to use under the MIT license.

jQuery Video and Audio Plugins

jQuery tubular jQuery tubular is a plugin that places a YouTube video of your choice into your page as a background. Usage is straightforward and requires JavaScript and the Flash player to be installed and functional on the client’s browser.

jPlayer jPlayer is a free and open source media library written on the top of jQuery. It allows you to rapidly weave cross-platform audio and video into your web pages. It is totally customizable and skinnable using HTML and CSS.

FitVids.JS FitVids.JS is a lightweight and easy-to-use jQuery plugin for fluid width video embeds. It is ideal for responsive web design whereby which the embedded video size will increase or decrease automatically to adjust based on the browser’s size.

Speakker Speakker is a cross-browser audio solution featuring HTML5. It comes out of the box in two variations and with incredible options of customization: Flexible dimensions, unlimited colors and two different button sets for light and dark themes.

Buzz Buzz is a small but powerful Javascript library that allows you to easily take advantage of the new HTML5 audio element. It degrades gracefully on non-modern browsers.

jQuery Image Plugins

CloudZoom CloudZoom allows you to add image zoom functionality to your images when mouse hovered over. You can easily alter the appearance of the smaller image, lens and zoom window through regular CSS.

MobilyNotes MobilyNotes is a lightweight jQuery plugin that shows your images or other HTML content in a stacked manner. You can use it to rotate your images and content.

CraftMap CraftMap is a lightweight, fully configurable jQuery plugin that converts a simple image into a functional map by overlaying dynamic elements on it such as markers. Like Google Maps, you can place your own marker icons and add location information to specific markers with a draggable image interface.

NailThumb NailThumb is a plugin that allows you to create thumbnails easily from high-resolution images, without any distortion, with one line of code only. You can even decide the thumbnail dimensions directly from CSS. It integrates perfectly with any media gallery.

Slidorion Slidorion combines the look of an image slider and an accordion to display beautiful images along with a variable length description. With slides linked to each tab, and accompanied by a large array of effects, the Slidorion is a great alternative to the traditional jQuery slider.

Craftyslide Craftyslide is a tiny (just 2kb) slideshow built on jQuery. It aims to be different, by providing a simple, no-frills method of displaying images; packaged into a small, clean and efficient plugin.

Glisse.js Glisse.js is a simple, responsive and fully customizable jQuery photo viewer. The transitions between the images are handled via CSS3.

jQuery Navigation Plugins

Page Scroller Page Scroller is a simple and elegant navigation plugin that adds smooth scroll functionality to your web page. The plugin is so simple that you can animate any web site.

jQuery contextMenu contextMenu plugin allows you to add context menus to your web application. These can be triggered with right-click, left-click, hover or your own custom trigger events. You can populate your menu dynamically and on-demand and incorporate form input elements within the menu.

jQCloud jQCloud is a jQuery plugin that builds neat and pure HTML + CSS word clouds and tag clouds that are actually shaped like a cloud.

jQuery Charts and Timeline

jqPlot jqPlot is a plotting and charting plugin for the jQuery Javascript framework. jqPlot produces beautiful line, bar and pie charts with many features like automatic trend line computation, tooltips and data point highlighting.

Flot Flot is a pure Javascript plotting library for jQuery. It produces graphical plots of arbitrary datasets on-the-fly client-side. The focus is on simple usage (all settings are optional), attractive looks and interactive features like zooming and mouse tracking.

Morris.js Morris.js is a lightweight library that uses jQuery and Raphaël to make drawing time-series graphs easy.

Timeline Timeline is a jQuery plugin that allows you to easily add interactive timelines to your site. It is also great for pulling in media from different sources. It has built in support for pulling in Tweets and media from Twitter, YouTube, Flickr, Vimeo, Google Maps and SoundCloud. To add events to your timeline, you can populate it using a Google spreadsheet or via JSON.

Post from: Hot Scripts Blog

40+ jQuery Plugins to Spice Up your Website

Related posts:

1. Hovercard – A jQuery plugin to display inline info
2. jQuery Mobile Framework Released
3. Beyond Traditional Image Showcase with jQuery

New & Noteworthy Scripts

easybook easybook is a PHP application that lets you easily publish book in various electronic formats: PDF, HTML and EPUB. It works by converting text archives written using the Markdown syntax. (Markdown is the standard format for writing documentation on the Internet). You can use easybook to publish novels, manuals, technical books and websites with your projects documentation.

Ospriet Ospriet is a moderation tool that allows audiences to post and vote on questions/comments for talks, presentation and events. It is built on Twitter and is written in node.js and uses MongoDB for database storage. Anyone with aTwitter account can submit a question or comment by posting an @-reply to a dedicated Twitter account. These submissions are then moderated and posted to the application with attributions.

Presenteer Presenteer.js is a jQuery plugin that provides a very flexible HTML5 presentation tool that works in one line of code and is configurable with constructor options and callbacks. It allows you to create stunning web-based presentation with effects like rotation, slide, etc.

elFinder elFinder is an open-source file manager for the Web written in JavaScript using jQuery and jQuery UI. Its layout and simplicity of use is highly inspired from Mac OS X Finder application. You can perform all operations with files and folders on a remote server like copy, move, upload, create file/folder and delete. elFinder support background file upload with drag-and-drop HTML5.

ProjectSend ProjectSend (previously cFTP) is a free, clients-oriented, private file sharing web application. Clients are created and assigned a username and password. Files can then be uploaded under each account and optionally a name and description can be attributed to them. ProjectSend works on common hosting environments to provide an easy and secure multi-file uploading system.

phpSitemapNG phpSitemapNG is a free Google Sitemaps generator written in PHP, but also generates RSS-based, txt-based and HTML-based sitemap files. It will spider your website and generate the XML-based sitemaps.

W-Script W-script is a free wallpaper script that allows you to start a wallpaper showcase and sharing Web site. It support features like color indexing, bulk upload from browser, unlimited catalogs, and automated wallpaper size generation for different desktop resolution and mobile devices.

PHP Tag cloud PHP Tag cloud is an easy-to-use PHP tag cloud class that allows you to generate and display tag clouds from either a database or text file source. The class provides different methods to manipulate the tag cloud including addition of new tags, adjusting the size of the tags, limiting the number of tags or even setting the order.

Cockpito Cockpito is an easy-to-install and use application metrics measuring and monitoring software, written in PHP/MySQL. By simply adding ready-to-use functions inside your application (web app, desktop app, mobile app or website), you can send tracking data to your Cockpito application and then monitor and track usage metrics.

Useful Hosted Apps

PHPForms PHPForms is a hosted application that allows you to create Web forms quickly and easily using an advanced Web Form Builder. You can create an unlimited number of forms with any form elements like radio-buttons, text areas, pull-down menus, checboxes, etc. Form submissions may be sent to multiple email addresses or saved on the server and eventually exported as CSV files.

TeamBox Teambox brings the familiarity of social networks to your projects. Sharing tasks and files is simple and secure. Manage tasks with status, due dates and milestones. Use the Kanban view for a quick overview of projects.

CushyCMS CushyCMS is a fast, simple and free content management system that aims to make life easier for web designers by simplifying content management. Cushy is a hosted application — no custom installation, packages or mods required on your end!

Helpful Web Design Resources

Smush.it Smush.it uses optimization techniques specific to image format to remove unnecessary bytes from image files. After Smush.it runs on a web page it reports how many bytes would be saved by optimizing the page’s images and provides a downloadable zip file with the minimized image files.

Stripemania Stripemania is a simple and free tool to create seamless diagonal stripes for your designs. You are able to choose the size of the stripes and the spacing between those. You can even add color gradient effect for all of your stripes.

Clean CSS Clean CSS is an online tool that allows you to optimize and format your CSS declarations. By simply copy-and-pasting your code or uploading it from a URL, you can select different compression options.

Useful Desktop and Online Tools

Fiddle Salad Fiddle Salad is an online IDE for building client-side web applications. You can use it to write and test your HTML/CSS/JavaScript code in a single-page interface and review your output in real-time. It supports Zend Coding mode, JavaScript debug and version tracking.

SnipSave SnipSave is a free online tool that allows you to save your code snippets online. It features a very easy-to-use interface where you can quickly create, edit, tag and delete your snippets. SnipSave will auto-detect your code and apply relevant syntax-highlighting.

Wappalyzer Wappalyzer is a browser extension that uncovers the technologies used on websites. It detects content management systems, web shops, web servers, JavaScript frameworks, analytics tools and many more.This extension is available for Firefox, and Google Chrome.

Recent Web Development News

Google Offering Free GoMo Sites Google is helping small businesses to optimize online storefronts for mobile by offering free websites via its GoMo page. Google’s GoMo and DudaMobile have joined together to better streamline desktop sites to be more mobile-friendly, by offering various templates, which can be customized.

Adobe Shadow Labs Release 2 Now Available Adobe Shadow, tools that make developing mobile Web sites easier and faster, has been updated to stay in line with current Web standards. Adobe released the details of the new Shadow Labs Release 2 today. They’re incorporating many of the features that users have requested.

WordPress.com Gets New REST API WordPress.com has announced a brand new REST API, which gives developers access to tons of new content, including posts and comments, as well as the ability to Follow, Like, or Reblog content for users.

Twitter Makes Its MySQL Work Open Source Twitter announced on its engineering blog that its work with MySQL will now be available to all under an open source license. This is pretty big since Twitter is basically built on MySQL from the interest graph and timelines to user data and the tweets themselves.

Post from: Hot Scripts Blog

What’s Hot in Web Development? – April Issue

Related posts:

1. What’s Hot in Web Development? – March Issue
2. Hot Scripts Launches Web Development Blog
3. Web Development Frameworks

New & Noteworthy Scripts

Timeline Timeline is a jQuery plugin that allows you to easily add interactive timelines to your site. It is also great for pulling in media from different sources. It has built in support for pulling in Tweets and media from Twitter, YouTube, Flickr, Vimeo, Google Maps and SoundCloud. To add events to your timeline, you can populate it using a Google spreadsheet or via JSON.

AjaXplorer AjaXplorer is a PHP and AJAX based file management system that you can install on your server to host and access your files from anywhere. It sports a modern and responsive interface very similar to OS-native file explorers. Users can easily share files or folders over the Internet, preview and edit most common file formats directly online, without having to download/upload the files to/from their local computer.

GelSheet GelSheet is a free and open source web spreadsheet that allows users to create, edit and export in many formats. It’s intended to run either standalone or integrated within another web tool. GelSheet is also available as a WordPress plugin.

jQuery File Upload jQuery File Upload is a file upload widget with multiple file and drag and drop support. During the file upload process, nice progress bars and preview images are displayed. It also supports cross-domain, chunked and resumable file uploads. You can use it with any server-side programming language that can handle HTML form file upload.

Hammer.js Hammer.js is a JavaScript library for adding touch events in your web site. It is lightweight (with only 2kb) and extremely easy to implement. It currently support gestures like tap, double tap, hold, drag and transform. Please note that this library requires jQuery.

Kimai Kimai is a free open source timetracker based on PHP5 and MySQL 5. It tracks work time and prints out a summary of your activities on demand. You can also run date-ranged reports by customer, project or activity. Kimai has support for multiple users as well.

Flotr2 Flotr2 is a library for drawing HTML5 charts and graphs. It can generate line graphs, bar charts, pie charts and bubble charts. These graphs and charts are generated using HTML5′s canvas and work across several desktop and mobile browsers. Once you provide the data points, the application will automatically calibrate the scale of your axes. Graphs can be zoomed and downloaded as PNG or JPG images.

jTable jTable is a jQuery plugin that is used to create AJAX based CRUD tables without coding HTML or Javascript. The HTML table is automatically generated with records fetched from the server using AJAX. Records can also be added, updated and deleted. jTable unlike other similar CRUD datagrids is easy to use and comes with PHP and ASP.NET sample codes.

Centurion Project Centurion is an open-source CMS delivered as a flexible PHP5 Content Management Framework. It is based on the Zend Framework and its components are generic, simple, clear and reusable. Centurion comes with the following components: Forms, caching, files, CRUD, views, signals and database.

OSClass OSClass is a PHP-based script that allows you to create a classified ads website. It can be used to set up a generic listings site or an industry-specific classified ads site for autos, jobs, real estate, and dating. It is easy to install and scales nicely on websites with millions of pageviews per month.

Useful Hosted Apps

Pusher Pusher is a hosted application that provides a set of different APIs for quickly, easily and securely adding scalable realtime functionality to web and mobile apps. These sets of APIs and libraries available in different languages is great for building apps that requires chat, activity streams, notification, collaboration and dashboards functionalities.

Trestle Trestle provides a suite of Cloud based services that includes user accounts, image manipulation, audio conversion and push notifications designed to make your job as a developer easier. Whether you choose just a single service API or you decide to use them all, there’s likely a service available to help you get your project done faster.

IntenseDebate IntenseDebate is a hosted application that allows you to provide feature-rich comment system for WordPress, Blogger, Tumblr and many other blogging/CMS platforms. Let your readers post comments using services like Facebook, Twitter, and OpenID.

Helpful Web Design Resources

creaTTor creaTTor is a community-driven creative library of free assets for your web design projects. It has a growing collection of site templates including WordPress themes, Joomla templates, Drupal themes, etc. You will also find free vectors, graphics and Flash components.

Entypo Entypo is a set of 100+ carefully crafted pictograms available as an OpenType font, vector EPS and web font. These sets are perfect for websites, apps and digital services.

Subtle Patterns Subtle Patterns is a design resource site offering high quality tilable textured patterns for free. It currently serves over 200 patterns and you can also download all patterns on the site as a single Photoshop pattern file.

New Desktop and Online Tools

Intype Intype is a text editor with advanced text editing features including select & edit, snippet insertion and management, auto-paired characters, fast syntax highlighting and code-coloring themes. Snippets, themes or even language grammars can be changed or added in the comfy extension editor. Intype has been optimized for speed and has snappy responses.

DirtyMarkup DirtyMarkup is an online tool that combines the power of HTML Tidy, CSS Tidy, JS Beautify, and the Ace editor to effortlessly clean up your messy code. Just paste your code (HTML, CSS or JavaScript) into the editor and press “clean” to tidy and beautify your code.

Crunch Crunch is an Adobe Air based CSS/LESS editor and compiler. (LESS is a JavaScript based CSS preprocessor which allows you to write CSS in its extended syntax and it will automatically compile that code into normal CSS.) Crunch supports multi-tab and syntax highlighting.

SpritePad SpritePad is an online tool that allows you to create your CSS sprints within seconds. Simply drag and drop your images directly in your browser and have them immediately available as one PNG spring with its CSS code.

Recent Web Development News

PHP 5.4.0 Released PHP version 5.4.0 was released earlier this month. This release is a major leap forward in the 5.x series and includes a large number of new features and bug fixes. Some of the key features in PHP 5.4.0 include: new language syntax, improved performance and reduced memory consumption, etc

Microsoft Makes ASP.NET Open Source Microsoft has announced that it is opensourcing ASP.NET MVC 4, ASP.NET Web API, ASP.NET Web Pages v2 (Razor) under the Apache 2.0 license. While the source for ASP.NET MVC was made available since its release, community contributions were never included in releases. Microsoft will now ship community code inside ASP.NET in upcoming versions of Visual Studio.

Google’s Go Programming Language Gets Stable Release Google has been toiling away on the Go Project since 2009. After three years and over 200 people contributing to the project, the Go Project has reached a major milestone and can now be considered usable by the masses.

Adobe Releases AIR 3.2 and Flash Player 11.2 Adobe announced the release of Flash Player 11.2 and Air 3.2 today, as the firm continues their push to help developers deliver media rich applications and console-quality games that run in web browsers.

MacAfee Introduces Free Plugin for MySQL Audits McAfee has released a free open source plugin for MySQL database that shows detailed activity from database audits. The plugin features visibility into database vulnerabilities and supports databases such as Oracle, Sybase, MS-SQL and DB2.

Google Releases App Engine 1.6.4 The Google App Engine blog announced the release of App Engine 1.6.4 today. Unlike other incremental numbered updates, App Engine receives quite the hefty update this time with plenty of features that should make developers happy.

Developers Prefer Google Over Facebook A new study from Appcelerator and the International Data Corporation (IDC) found that developers are more interested in Google than Facebook. According to the report, 39 percent of the more than 2,000 mobile developers surveyed plan to focus more on Google initiatives than Facebook’s social graph this year.

Post from: Hot Scripts Blog

What’s Hot in Web Development? – March Issue

Related posts:

1. Hot Scripts Launches Web Development Blog
2. The A to Z of Trending Web Development Technologies
3. Web Development Applications for Mac OS X

General Web Development

W3Schools

W3Schools is a  developer’s portal with tutorials and references relating to web development subjects, including HTML, XML, CSS, JavaScript, PHP, ASP, ASP.NET, and SQL. The tutorials and references on the website are accompanied by great try-it-yourself examples.

Tizag

Tizag was created to be a stepping-stone to the budding webmaster and a handy reference to the veteran developer. Each tutorial has been written to be easy-to-understand and the references covers in-depth attributes/tags/syntax of each language along with accompanying examples.

Google Code University

Google Code University is an initiative from Google and schools across the US to provide course content and tutorials on programming related topics. You can find great courses on desktop, web and mobile programming as well as courses on specialized topics like web security, distributed systems and Google APIs and Tools. All courses are accompanied by great examples and exercises.

HTML5

HTML-5-Tutorial

HTML-5-Tutorial.com is geared to those who want to edit and write HTML code by hand. Knowing how the nuts and bolts of a webpage fit and work together gives you the means to utilize HTML5′s full potential.

HTML5Doctor

HTML5Doctor has a growing list of categorized posts grouped in order to get you started with HTML5 or help you understand the specification and specific elements a little more. The blog posts are well written with ample of code samples.

Dive Into HTML5

Dive Into HTML5  is a free online version of Mark Pilgrim’s book “HTML5L: Up & Running”. It seeks to elaborate on a handpicked selection of features from the HTML5 specification and other fine Standards.

JavaScript & jQuery

Codecademy

Codecademy is an interactive command-line driven teach-yourself tool that makes learning to code easy, fun and addictive. JavaScript is currently the only web-based course available and is broken down into eight lessons that will teach you how to set variables, create alerts and work with strings. You will earn badges each time you complete a lesson and you can track and share your progress with your friends.

Eloquent JavaScript

Eloquent JavaScript is a free online book providing an introduction to the JavaScript programming language and programming in general. It goes beyond the cut-and-paste scripts of the recipe books and teaches you to write code that’s elegant and effective. Apart from a bookful of text, it contains plenty of example programs, and an environment to try them out and play with them.

jQuery fundamentals

jQuery fundamentals is a free ebook that provides an overview of the jQuery JavaScript library. When you’re done with the book, you should be able to complete basic tasks using jQuery, and have a solid basis from which to continue your learning. This book was designed as material to be used in a classroom setting, but you may find it useful for individual study.

appendTo

appendTo offers a couple of fundamental JavaScript and jQuery screencasts designed to help you learn at your own pace. Most of the screencasts are accompanied by exercises to test the skills you’ve just learned.

JavaScript Garden

JavaScript Garden is a growing collection of documentation about the most quirky parts of the JavaScript programming language. It gives advice to avoid common mistakes and subtle bugs, as well as performance issues and bad practices, that non-expert JavaScript programmers may encounter on their endeavors into the depths of the language.

jQuery Air

jQuery Air is a free web-course offered by code school. You’ll watch five videos, each followed by code challenges where you’ll learn to code jQuery and apply principles directly in the browser.

Mozilla Developers Network JavaScript Guide

Mozilla Developers Network JavaScript Guide is a comprehensive guide that explains everything you need to know about using JavaScript. It covers topics like variables, expression, operations, objects, methods and arrays.

JavaScript Essential

JavaScript Essential is a book available for free reading online. It is designed to provide a detailed and comprehensive, yet easy to follow, guide to developing powerful, dynamic web pages using JavaScript.

PHP

Zend’s PHP 101

PHP 101 is a 15-part tutorial series intended for everyone interested in learning about elementary PHP 4 or basic PHP 5. These tutorials are highly informative and entertaining at the same time.

Practical PHP Programming

Practical PHP Programming is a series of PHP tutorials with the goal of making the task of learning PHP something fun. It contains lots of information for newcomers as well as information on advanced functionality in PHP for veterans.

PHP 5 Power Programming

PHP 5 Power Programming is a free eBook (available in PDF) that will show you how to make the most of PHP 5′s industrial-strength enhancements in any project – no matter how large or complex. Whether you’re creating web applications, extensions, packages, or shell scripts – or migrating PHP 4 code – this book covers high-powered solutions you won’t find anywhere else.

phpacademy

phpacademy has a growing collection of over 300 video tutorials covering a wide range of PHP-related and other web development topics for both beginner and intermediate users. All the videos are on-demand and completely free.

Ruby on Rails

RailsforZombies

RailsforZombies is browser-based tutorial that will teach you the basics of web application development using Ruby on Rails. It consists of 5 video lessons broken down into different video chapters. You can watch the videos online or download them to watch offline – either on your desktop or iPhone/iPad. Each lesson is followed by exercise where you’ll be programming Rails in your browser.

RailsCasts

RailsCasts offers screencasts (both free and paid) featuring tips and tricks with Ruby on Rails. The screencasts are short and focus on one technique so you can quickly move on to applying it to your own project. The topics target the intermediate Rails developer, but beginners and experts will get something out of it as well.

Four Days on Rails

Four Days on Rails is a free eBook that attempts to teach you the underlying coding that goes through developing a Rail application. After reading this 40-pages eBook, you will have a useful toolbox of Rails techniques and a good idea of where to look on the web for more information.

Ruby on Rails Tutorial book

The Ruby on Rails 3 Tutorial book teach you how to develop and deploy real, industrial-strength web applications with Ruby on Rails. It covers a wide array of topics including installing and deploying Ruby on Rails, scaffolding, working with static pages and handling layouts, etc.

Post from: Hot Scripts Blog

Learn How to Code for the Web

Related posts:

1. 5 Powerful PHP Code Generators
2. How often do you search for source code example while coding?
3. Mozilla Bespin – Code in the Cloud

Twitter Clone Scripts

ShareTronix

ShareTronix is an open source microblogging platform with features aplenty. It supports all the features you’re already accustomed with on Twitter and also includes a lot of extra functionalities aimed at enterprise-level microblogging. As with most applications of this type, you’ll find support for status update, real-time dashboard with network activity, groups, search and content tagging. ShareTronix takes status updates beyond text and allow you to attach pictures, videos and other files to your posts to make your conversation more engaging. Some other nice features that caught my attention are real-time RSS aggregation, a powerful search powered by Sphinx, LDAP authentication support, and great integration with Twitter and Facebook.

PeoplePods

PeoplePods is a social software toolkit aimed at building applications where people meet, talk, share, read, work and explore. Based on the foundation of Twitter-like features, registered members can create their own profile, follow others and join public or private groups. PeoplePods has overtime matured in a really stable platform and now powers a couple of great communities, with NeighborGoods.net being my favorite.

StatusNet

StatusNet is an enterprise social network application available as a hosted or on the premise solution. Based in PHP and mySQL, this microblogging application allows its members to ask questions, share information and read posts in real-time. It has support for groups, topics, activity streams, search, etc. The best thing about StatusNet is that it is open source and there are multiple plugins and extensions available to customize the site to your needs.

Twitter Script

Twitter Script is a free PHP application that allows you to run your own microblogging web site just like Twitter and Jaiku. It has multi-language support, comes with a template system that is easy to customize and makes great use of AJAX to provide a responsive experience.

Digg, Mixx and Reddit Clone Scripts

Pligg

Pligg was the first Digg clone released a couple of years ago and is still actively maintained by a group of enthusiast and developers. Users can submit and vote on news article and top voted articles make it to the top of the homepage of your Pligg site. It has support for RSS subscription, groups, private messaging, commenting, etc. Pligg is powered by the Smarty template system, which makes it easier for skinning.

PHPDug

PHPDug is a lightweight Digg clone that is easy to setup and maintain. It has great multilingual support and sports a minimalist but clean design. It has the ability to automatically add stories from RSS feed and can also generate on-the-fly thumbnails for YouTube and Google videos.

YouTube Clone Scripts

PHPMotion

PHPmotion is a free video sharing application that mimics YouTube to some extend. Your members can upload videos, and add description/tags. Videos can, in turn, be embedded on 3^rd-party web sites. PHPmotion will automatically convert your movies into FLV – it can handle .mpg. .avi, .divx and other video formats. Other than videos, PHPmotion can be used as an image or audio sharing platform.

Clip Bucket

ClipBucket is an open source multimedia management script provided free to the community. This script comes with all the bells & whistles required to start your own video sharing web site like YouTube, DailyMotion or MetaCafe. The script is constantly updated to provide the most versatile, reliable and scalable media distribution platform with the latest social networking features.

Facebook Clone Scripts

BuddyPress

BuddyPress is a collection of multiple WordPress plugins and themes that transform an installation of WordPress into a social networking platform. It has all features you’d expect to let your members socially interact. Each registered member gets a personal blog and an extended profile page with his list of friends and groups. Members can private messages each other or leave short messages on each other’s wire.

Elgg

Elgg is an award-winning open source social networking engine that provides a robust framework on which to build all kinds of social environments, from a campus wide social network for your university, school or college or an internal collaborative platform for your organization through to a brand-building communications tool for your company and its clients.

Oxwall

Oxwall is a flexible and easy to use PHP/mySQL community software platform. It comes with some great features like photo and video sharing, blogs, forums, wiki, groups, events, privacy control, etc. Oxwall also has some great plugins and themes to allow you to further customize your social site.

Groupon Clone Script

NDOT Deals

NDOT Deals is unfortunately the only free open source Groupon clone application that I could locate. It allows you to start your own group buying web site. Some of the features includes mobile version of the site, affiliates integration, payment gateway integration, free themes and social media integration. Please take note that the free version is very limited in terms of features.

Google Calendar Clone Script

wdCalendar

wdCalendar is a JQuery-based Google Calendar clone. The interface makes great use of AJAX to provide a responsive interface with drag-and-drop functionalities. The calendar can be set to daily/weekly/monthly view.

StackOverflow / Yahoo Answers Clone Scripts

Question2Answer

Question2Asnwer is a free and open source platform for Q&A communities similar to StackOverflow or Yahoo Answers. It is based in PHP and mySQL and is very easy to install. Question2Asnwer has some great community engagement tools like commenting, voting, email notification, user points and rankings. If you use WordPress, please take note that Question2Asnwer offers out-of-the-box integration with your existing WordPress site and user database.

Coordino

Coordino is based on the standard PHP/mySQL platform to provide a feature-rich question and answer system. You can use it to create a niche question and answer site or as a knowledge base solution for your Intranet. Some of its key features include user rewards, tagging, site administration and remote authentication.

OSQA

OSQA is a free open source Q&A system written in Python and utilizes the Django application framework. It is more than a mere Q&A platform but comes with some decent features not found in other similar applications. Your members can for instance follow other people and topics and exchange private messages. There is also support for widgets to expand its functionality and most importantly its interface is sleek and usable.

Photobucket / ImageShack Clone Scripts

Cheverato

Chevereto is a free script, written in PHP, that lets you set up your own image hosting on your web server. It supports image upload either from your local computer or from a remote URL. Images uploaded can be set to automatically resize and you can set it to shorten the image URL using TinyURL web service.

CF Image Host

CF Image Host is a free, simple and easy to use PHP Image hosting script, which aims to make it easy to setup and maintain a photo/image hosting/sharing site. With thumbnails and social bookmarking links generated for each image, sharing your images or photos across the web couldn’t be made any easier.

Dropbox Clone Script

SparkleShare

SparkleShare is a free open source collaboration and sharing tool similar to Dropbox. You can store files on your hosting account and share them with others. Documents are synchronized to all your peers when changes are made. You will also be notified via its desktop client (available for Mac, Windows, Linux and Android) when someone has made a change.

TinyURL Clone Scripts

YOURLS

YOURLS is a small set of PHP scripts that will allow you to run your own URL shortening service (a la TinyURL). You can make it private or public, you can pick custom keyword URLs, it comes with its own API. It also includes some really great analytics like historical click reports, referrals tracking, and visitors’ geo-location.

lilURL

lilURL is a simple PHP/ mySQL script for generating short URLs. It’s similar to TinyURL, Shorl, MakeAShorterLink, etc, but you can run it on your own server.

PopURLs Clone Script

NewsBlock

NewsBlock is a free PHP script that allows you to replicate functionalities of PopURLs. This script leverages SimplePie’s RSS feed parsing capabilities to return multiple feeds from various website with each one having its own block on the homepage.

Del.icio.us Clone Script

GetBoo

GetBoo is a PHP-based del.icio.us clone with a decent bookmarking system that can support both social (with tags) and private (with folders) bookmarks. It has a feature that will allow your users to import and export their bookmark from their browsers. The admin console includes spam protection, transaction, bookmarklets, RSS feeds, and more.

Post from: Hot Scripts Blog

Open-Source Clone Scripts of Popular Websites

Related posts:

1. Clone Scripts – Misconceptions and Uses
2. 11 Popular Open Source Enterprise Software
3. Top 5 Free Open-Source Shopping Carts

This year’s list is even better than last year, featuring both new and updated scripts that take innovation, feature sets and — most importantly — use of web technologies to the next level. Our list is comprised of web scripts coded in different languages and in a broad range of categories. I feel certain that you will find something new to use on your site or at least items to keep tabs on for upcoming projects.

ownCloud

ownCloud gives you universal access to your files through a web interface or WebDAV. It also provides a platform to easily view and sync your contacts, calendars, and bookmarks across all your devices, and enables basic editing right on the web.

GitLab

GitLab is a Ruby on Rails Git repository management application that you can install on your server to manage your projects and code repositories. It is lightweight, fast, secure, and sports a streamlined interface that makes browsing of source code, issues, comments, commits, and file history easy. Finally, it supports team collaboration extremely well.

Candy

Candy is a web-based chat client with focus on real-time multi-user chatting. It is build for Jabber (XMPP) and is very easy to configure and use. Candy has been tested in a productive environment with up to 400 concurrent users and works well across all major web browsers.

JSZip

JSZip is a JavaScript class that allows you to create zip files on-the-fly. It works by compressing files on the client side and hence reduces server processing. Its API provides a simple way to place any file into a zip file, but it does suffer from a tendency for different browsers to generate weird file names.

HybridAuth

HybridAuth is an open source social sign-on PHP library that enables developers to easily implement social sign-in, social sharing, user profiles, friend lists, activity streams, and more. HybridAuth acts as an abstract api between your application and various social apis and identity providers such as Facebook, Twitter, MySpace, and Google.

Fork CMS

Fork CMS is an intuitive content management system that provides a user-friendly platform to build, monitor, and update your website. It is highly flexible and provides an array of built-in features like page-specific template and block configurations aimed at giving you total control of your content layout. Fork CMS is extensible through modules like a form builder, blog, FAQ, etc.

PhotoSwipe

PhotoSwipe is a free HTML/CSS/JavaScript-based image gallery specifically targeting mobile and touch devices. It provides visitors with the look and feel of a native application that makes interaction with images familiar and intuitive. It supports iOS devices, Android, and Blackberry 6 as well desktop browsers.

html2canvas

html2canvas allows you to take screenshots of a web page (or just a portion of one) using JavaScript and HTML5 canvas. It works by reading the DOM elements, applying the CSS style, and converting that into a canvas image for output. Unlike other screenshot services, html2canvas works on the client’s browser and does not require any rendering from the server.

OpenPublic

OpenPublic is an open-source content management system (CMS) based on Drupal and tailored for the needs of government-related web portals. It provides secure and scalable sites, and is already in use by several government bodies around the world.

Fuel CMS

Fuel CMS is a CodeIgniter-based content management system that is easy and flexible for rapid development. It works on the concept of inline editing with real-time preview and has great integration with third-party services like WordPress and Google Analytics. For developers looking for added functionality, Fuel CMS provides an expanded code library and custom module creation, along with opt-in controller development.

Selfoss

Selfoss is a lightweight PHP-based RSS reader that can also aggregate live streams and multi-source mashups. It can be extended with its open plugin system that allows you to write your own data connectors to fetch and display content.

EasyBasket

EasyBasket takes a different approach to creating a shopping cart by allowing you to quickly insert the cart anywhere on your page with a single line of code. There’s no need to install a database or a dozen class files. Easy Basket currently supports Google Checkout and PayPal and will work on any type of web page, be it HTML, ASP.NET or PHP.

OSClass

OSClass is a PHP-based script that allows you to create a classified ads website. It can be used to set up a generic listings site or an industry-specific classified ads site for autos, jobs, real estate, and dating. It is easy to install and scales nicely on websites with millions of pageviews per month. OSclass can be extended through plugins or skins via themes. Finally, OSclass is SEO-friendly with sitemap.xml generation, robots.txt, and nice URLs.

MyWebSQL

MyWebSQL is a MySQL web client and administration application, similar to phpMyAdmin but with a more intuitive interface and incredibly fast performance. It boosts a rich set of features, including multiple server login, WYSIWYG table creator and editor, inline multi-record editing, and more. MyWebSQL also supports SQLite.

SimpleModal

SimpleModal is a MooTool plugin used to create modal (overlay) windows. It can be used to generate alert or confirm messages with just a few lines of code. SimpleModal can work in asynchronous mode and retrieve content from external pages or fetch inline content.

jsMorph

jsMorph is a pure JavaScript animation framework that can support morphing, motion, and tweening. It can manipulate any HTML element either individually or as a group. jSMorph also has super-fast rendering due to optimized browser rendering buffer usage.

SCM Music Player

SCM Music Player is a free and open source web music player that brings a seamless music experience to your website. Through its dockable player that sits either at the top or bottom of your site, it allows continuous playback across your pages.

OpenScholar

OpenScholar is a full-featured, open-source website-creation package designed for the academic community. It is scalable, easy to use, and requires minimum resources and effort to administer.

SeekQuarry

SeekQuarry is an open source PHP search engine that can be configured as either 1) a general purpose search engine for the whole web; or 2) providing search results for a set of URLs or domains. It is fast and supports distributed crawling.

Coordino

Coordino allows you to create a question-and-answer system similar to that used by Yahoo! Answers or StackOverflow. It is written on top of the CakePHP framework and in addition to the built-in knowledge-base platform, it supports a user reward system based on points, along with remote authentication.

WIODE

WIODE is a web-based open source IDE that was built as a replacement for standard desktop-installed IDEs. It is loaded with items such as an intuitive file manager, syntax highlighting, Zen Coding, mobile interface, FTP, multiple users, a code library, and much more, all designed to make cloud coding simple.

Tiny Tiny RSS

Tiny Tiny RSS is an open source web-based news feed (RSS/Atom) aggregator, which lets you read news from any location, while still feeling as close to a real desktop application as possible. It has a streamlined interface that uses AJAX and supports RSS, RDF, and Atom feeds.

Elycharts

Elycharts is a JavaScript charting library that doesn’t require client side plugins such as Java or Flash. It can draw all of the frequently used chart types, ranging from line charts, column and bar charts, to pie charts. All charts can handle multiple data series, with stacked and cumulative options, and with multiple axis support and automatic axis scaling.

Share Count

Share Count is a JavaScript-based application that allows you to aggregate your social share counts from different social networks. It currently supports Twitter, Facebook, Like, Digg, and Delicious.

Post from: Hot Scripts Blog

Emerging Free Web Scripts to Watch for in 2012

Related posts:

1. 25 Emerging Free Web Scripts to Watch
2. Free PHP Image Gallery Top 10 Scripts from Hot Scripts
3. Free PHP Image Captchas Top 10 Scripts from Hot Scripts

1. PHP – Magento

Since its first beta release, Magento, a PHP ecommerce platform, has evolved significantly. Now used by over 90,000 merchants to power their online stores, Magento’s success lies in its versatility, offering unrivaled cutting-edge features with different extensions. Its array of built-in marketing tools — like SEO-friendly URLs, A/B split testing, cross-selling, and email campaigns — help optimize and increase online sales. Magento is backed by an expanding community of developers offering free support through an online forum.

2. ASP.NET – nopCommerce

As a fully customizable ASP.NET and MS SQL-based ecommerce solution, nopCommerce is maintained by a vibrant community of developers passionate about developing a robust ecommerce application. It has everything you need to help you get started selling physical or digital goods. One key feature is its pluggable modular/layered architecture that lets additional functionality and presentation elements to be dynamically added to the application at run-time. The pluggable modularized architecture makes it easy to create and manage websites. A lot of SEO effort went into this product. All the way from search-friendly URLs and XML sitemaps to properly structured content and products, it has been built to help spiders easily crawl your store.

3. RUBY ON RAILS — Spree

With a Ruby on Rails ecommerce platform, Spree combines Ruby-powered performance to provide a simple and highly scalable solution. Its powerful extension system makes it easy to customize the application to suit your exact business needs, applying custom logic to your checkout, shipping, or payment processes. It also has tight integration with Google Analytics ecommerce tracking and supports SEO-friendly URLs laid out to provide multiple entries to the same product page (helps with internal linking). Spree’s forte is in its API, offering a secure way to modify orders, shipment, and product data via third-party services and software (CRM, QuickBooks, iPhone applications).

4. JAVASCRIPT — SimpleCartJS

A lightweight JavaScript shopping cart, SimpleCartJS impresses more with each new version. You can set up an ecommerce checkout in a few minutes, with no database or programming knowledge (just some HTML/CSS skills for skinning). Unfortunately, there is no backend for inventory management, and it only works with PayPal and Google Checkout. But if you’re looking for an easy-to-set-up checkout for a landing page with a simple and uncluttered interface, it may be perfect.

5. JAVA — KonaKart

KonaKart may be a good choice if you need a Java-based ecommerce solution. It can provide a powerful solution that should cover most, if not all of your requirements, delivering unparalleled price / performance. It has a rich feature set to provide your customers with all of the information and functionality that they require in order to shop at your online store. The only downside is that, realistically speaking, it will require some JSP/Java development and deployment knowledge to bring a store into production.

Post from: Hot Scripts Blog

Top 5 Free Open-Source Shopping Carts

Related posts:

1. 11 Popular Open Source Enterprise Software
2. 6zap – An Open Source Webmail Client
3. Free PHP Image Gallery Top 10 Scripts from Hot Scripts

The concept of design frameworks is highly inspired from web development frameworks that you’re probably already familiar with. Also known as a CSS / HTML framework, library or boilerplate, these sets of predefined HTML, CSS, and sometimes even JavaScript files package a number of ready-made options and features for design and layout of a web page. Most frameworks address the follow layers of front-end design:

1)  Structure (HTML) — Usually a plain HTML file containing structural grids and containers for your content. Some frameworks predefine several HTML elements, and others may also include dummy filler text.

2) Presentation (CSS) — A set of prewritten CSS declarations for browser resets, grid layouts, and default styling of certain elements like typography and forms. Some frameworks take this further by including CSS media-queries for print and mobile.

3) Functionality (JavaScript) — Certain frameworks group commonly used JavaScript functions (like form validation, animation, tooltip, data picket, etc.) in their package either natively or using JavaScript frameworks like jQuery or MooTools as dependency.

Here are some factors to consider when choosing an HTML / CSS framework:

1)  Learning Curve — While none of these frameworks will require you to learn a new language construct or syntax, you will need to be familiar with the different CSS classes. Some are pretty straightforward to use and remember, but others could involve a learning curve or constant reference to the documentation.

2)  Size — One of the downsides of using frameworks is the extra load time they may add to your site. The key in choosing your framework is to weigh the features and functionality you need against the extras. For example, if you don’t need HTML5 and CSS3 support, opt for something more lightweight. Finally, avoid those that rely too much on dependency files.

3)  Mobile Support — If you’re targeting an audience that accesses your website or application using mobile devices, it makes sense to choose a framework with support for adaptive and responsive layouts. There are also certain mobile-specific frameworks that you can consider.

Below is a list of some popular HTML / CSS frameworks categorized into different segments to make your choice even easier.

Generic CSS/HTML Frameworks

Not Just a Grid is a flexible and modular css framework that is designed to assist in the rapid prototyping and development of websites. It has been designed for the future with larger screen sizes and the use of CSS3 for progressive enhancement and richer user experiences.

Semantic is a pretty basic CSS grid framework with columns and gutters. It relies on simple markup without having you to learn complicated CSS classes definitions. There are some great examples on the site and its documentation is well-covered.

StackLayout is a component based CSS layout system that is highly semantic and cross-browser compatible. It’ll allow you to mockup complex design easily thanks to its semantic class names and its  component support of unlimited combination of stack containers.

Easy Framework provides a solid base for your front-end projects. It is more than a CSS framework designed for building layouts. It includes built-in (jQuery powered) interactive functions that are so easy to use that you really don’t have to know first thing about JavaScript. It also includes a library of preformatted and precoded CSS/HTML content blocks that you can simply paste into your master template.

Baseline makes it easy to develop a website with a pleasing grid and good typography. Baseline starts with several files to reset the browser’s default behavior, build a basic typographic layout — including style for HTML forms and new HTML 5 elements — and build a simple grid system. Baseline was born to be a quick way to prototype a website and grew up to become a full typographic framework for the web using “real” baseline grid as its foundation.

Mobile / Responsive CSS Frameworks

Mobile Boilerplate provides a baseline for creating rich and performant mobile web apps. You get cross-browser consistency among A-grade smartphones, and fallback support for legacy Blackberry, Symbian, and IE Mobile. You get an offline caching setup for free, fast button clicks, a media query polyfill, and many common mobile WebKit optimizations.

BluCSS is a generic CSS framework with a strong focus on responsive design. It has 4 distinct stages: desktop screen, laptop, table and mobile. It does have some basic styling combined, but nothing special. Perhaps one of its beast feature is responsible image functionality whereby which images gets resized automatically depending on the browser’s width.

Skeleton is a small collection of CSS & JS files that can help you rapidly develop sites that look beautiful at any size, be it a 17″ laptop screen or an iPhone. Skeleton is built on three core principles: responsive grid down to mobile, fast to start and style agnostic. Skelteon relies a lot on media queries and has support for a bunch of different mobile resolutions.

For more frameworks, please check out our Roundup of Mobile Web Application Frameworks

Magazine-based CSS / HTML Frameworks

Magazine Grid is a CSS-Framework that is bundled with common magazine design elements such as pagination, gutters and grids. Primary aimed at iPad magazine digital publication, this framework makes use of HTML5 elements to structure your page. At only 4kB in filesize, it is superlight to load fast on mobile devices.

Laker is a compendium of files, frameworks, styles and tips for designing digital publications in HTML5. It combines a few frameworks like the Baker Framework (covered above), jQuery, jPlayer and Less Framework.  It has support for swipe, doubleTab, native slideshows as well as ability to include sound, YouTube videos, etc.

Baker is an HTML5 ebook framework for publishing interactive books and magazines on iOS devices including iPad and iPhone. You’ll start by using their CSS file to design your site in 768px and when you’re done, the Baker Framework will allow you to package and publish your application. Baker Framework introduces a few great features for your HTML5 magazine including multi-orientation and gestures.

HTML5 & CSS3 Specific Frameworks

Perkins is an impressive framework that combines latest web standards (HTML5 and CSS3) to offer a highly customizable base for your web project. It is loaded with a CSS grid style, lots of basic styles, mixins, helpers and other goodies like transparent textures, @font-face generated icons.

G5 Framework is a feature-rich framework packed with a bunch of external libraries like Modernizr, jQuery, Easy Grid, Tipsy Tool Tips, Orbit Image Slider, etc. It is based on HTML5 and sports a clean code structure. It has some extra items which I are not that necessary, but could prove useful for some – e.g: gZip, predefined robots.txt and. htaccess files, etc.

Fluid Baseline Grid System is an HTML5 & CSS3 development kit that provides a solid foundation to quickly design websites with ease. The FBG system was built with typographic standards in mind and combines principals of fluid-column layouts, baseline grids and mobile-first responsive design into a resolution independent and device agnostic framework. It is packed with CSS normalization, beautiful typographic standards, corrected bugs, common browser inconsistencies and improved usability.

Gridless is an optionated HTML5 and CSS3 boilerplate for making mobile first responsive, cross-browser websites with beautiful typography. Gridless takes the boring parts of making websites and webapps out. It comes packed with everything you’re tired of doing in every new project: CSS normalization, beautiful typography, a well-organized folder structure, IE bugfixes and other nice tricks.

52framework, dubbed as ‘the framework from the future’ is a decent HTML5, CSS and JavaScript framework that has received a lot of attention from web designers. It caters for a lot HTML5 specific elements like canvas, local storage, form validation, etc.

Lightweight HTML/ CSS Frameworks

Instant CSS Code takes a different approach to CSS framework. Instead of bundling everything in a framework, it provides you with an online tool to customize your project framework and generate the required files. For example, you can select which JavaScript library you’d like to work with, the type of DocType your document will be coded in, etc.

Cabin CSS is a lightweight and modular CSS framework that allows you to add ‘extensions’ when you need them. For example, you can extend the core framework by calling other CSS files for forms, grids, tables only when needed.

Post from: Hot Scripts Blog

A Guide to HTML / CSS Frameworks & Libraries

Related posts:

1. New Category – PHP Frameworks
2. Web Development Frameworks
3. PCSS – where CSS meets PHP

But to properly position yourself in the social space, you need more than just Share buttons and activity feeds. In addition to these, you can consider other social tools that integrate better and seamlessly with your website. Facebook and Twitter offer various widgets and APIs that provide added social integration for your site to take advantage of the direction the Web is heading.

In this article, we’ll take a look at some of the other types of integration that the two most popular social networking sites, Facebook and Twitter, offer.

Facebook

Widgets & Plugins

Facebook offers several simple-to-implement copy and paste social plugins:

Like Box

The Facebook Like Box is foremost different from the Like button. It empowers you with a ‘Become a Fan’ button and also showcases a list of random people that “Like” your site. When placed on your homepage or within a sidebar throughout your site, the Like button can help you attract and gain more subscribers to your Facebook Page. The Like button can also be configured to display a list of recent activities on your page.  In my opinion, it looks better when it is a minimalist-style.

Send Button

The Facebook Send Button was introduced earlier this year and replaces the ‘Email to a Friend’ widget. By placing the Send button on your content pages, your site visitors can send that particular article or page to friends, groups or any email address. Unlike the Like Button which only posts content to a wall, the Share button provides more methods for users to share your content – and best of all, Send Buttons counts towards your overall ‘Like’ count.

Comments Box

The Facebook Comments Box is a handy plugin that allows Facebook users to leave comments on any of your pages. Site administrators can also moderate comments (delete, ban users or boost a comment). The one aspect that I love is the automatic sign-in which logs the user in – this feature promotes easy participation. The downside of this plugin though is that it is not SEO friendly in its purest implementation, because it is rendered in an iFrame – search engine bots do not index iFrames. On the other hand, you can leverage the Facebook Graph API to pull comments in plain HTML. The other thing to remember is, you can hinder participation from non-Facebook visitors if you only provide Facebook Comments.  So, it is wise to use this plugin in conjunction with another comment system.

Recommendations

The Recommendations plugin provides personalized recommendations to your site visitors even if they are not logged in your site. It takes into account all social interactions with your site (comments, likes, shares, etc) along with interactions made by the friends of the Facebook account to return highly personalized recommendations. These recommendations are usually in the form of object recommendations which can be an article on your site, a link or any other item that was shared by others on Facebook.

Registration

The Registration plugin allows your web site visitors to easily register on your site with their Facebook account. Note that this plugin doesn’t handle the actual registration, but provides a way for Facebook users to prefill your form’s fields with information pulled from their Facebook account. Visitors who do not have a Facebook account will be able to use the same form to sign up for your web site.

API

Facebook also offers an API, known as the Facebok Social Graph API. The Facebok Social Graph API allows you to access and write data to Facebook through a REST protocol. If you’ve never worked with an API before, it can be a bit daunting to start with; however, there are several libraries and classes that you can use to get started.

Below is a list of selected PHP & ASP.NET toolkits that provide a good abstraction to Facebook’s Graph API (the toolkits also provide some great usage examples):

Facebook Login

Easy authentication with Facebook is perhaps the most common usage of the Facebook API.  The Login API allows users access to your site without having to create an account. You can authenticate users on your web site by allowing them to provide their Facebook login credentials; all the while capturing their personal information and requesting permissions like ability to write to their wall, send them messages or upload photos and videos.

Toolkits: PHP, ASP.NET

Facebook Friends Invite

Facebook Invite allows your site visitors to send invite requests to their friends.  In turn, their friends will visit your site, join an event, or get involved in other participation-based activities – an excellent way to drive more awareness to your site.

Toolkits: PHP, ASP.NET

Facebook Bookmark Button

By providing a Facebook bookmark button, you can empower your Facebook visitors an easy and fast way to save your site’s pages within their Facebook account. This can increase the chance of someone returning to your site.

Toolkits: PHP, ASP.NET

Facebook Stream Publish

Stream publish allows you to provide an easy way for users to publish sotries on user profile, friends’ profile or to a Facebook page. It supports publishing content, image, video and Flash content. The API will takes care of all file conversion.

Toolkits: PHP, ASP.NET

Twitter

Widgets

One-Click Follow Button

The one-click follow button was launched a couple of months ago and provides an easy way for your visitors to follow your Twitter account without having to leave your site. As pointed out by Twitter in its announcement post, the addition of the one-click follow button allows your audience to be more connected and engage with your Tweets.

Search Widget

The search widget is similar to the profile widget that displays a list of your most recent Twitter updates on your website except that you can configure it to return results for a specific search term. For example, you can configure the widget to display tweets that contain a specific hash tag or @ replies.

Twitter API

As always, APIs allow you to gain more control over the data you can fetch or write to via a service. Here are some of the most common uses of Twitter’s API:

Fetching Streaming Tweets

The Twitter API allows you to gather tweets for selected keywords from its database. You can in turn store these in your own database or display them on your site. This is very handy if you’re building a mashup application.

Resources: Twitter API Library in PHP, ASP.NET Tutorial on how to display real-time tweets

Posting Status Updates

You can automate your status updates from your web site application to your Twitter account using Twitter’s API. Most popular CMS’ have plugins that allow you to post a tweet – with a link to your article – as soon as the article is published. However, you can take a look at the following resources if you’re working from a custom application and need that functionality:

Resources: PHP code on how to tweet remotely,  Tutorial on how to post status updates using ASP.NET

Twitter Login

Similar to Facebook’s Connect, you can add a way for your site’s audience to login your web site using their Twitter credentials. The implementation is based on the OAuth API, and the documentation on the Twitter’s website is fairly easy to follow. If you prefer easier implementation, you can use these wrappers:

Resources: Twitter PHP Login Wrapper, .NET Library for Twitter Integration

Post from: Hot Scripts Blog

Facebook & Twitter Web Site Integration

Related posts:

1. 7 Useful Social Applications for your Web Site
2. 10 Useful APIs for your Web Site & App
3. Make your Web site more Mobile Friendly

Unfortunately the number of decent service providers is limited and in this article, we’ll take a look at some of the key providers.

Social Commenting

DISQUS

DISQUS is a comments platform that helps site owners easily add realtime comment with interactive discussions to their pages. The key to the widespread adoption of DISQUS is its support of social networking sign-ups that provide an easy way for visitors to login, leave comments and share them. It currently handles social services like Google, Twitter, Facebook, Yahoo and OpenID. DISQUS is available as generic JavaScript snippet or as plugins for popular CMSs.

IntenseDebate

IntenseDebate is a feature-rich comment system for WordPress, Blogger, Tumblr and many other blogging/CMS platforms. It allows your readers post comments using services like Facebook, Twitter, and OpenID. They can also sign up for an IntenseDebate profile or simply comment as an anonymous user. For Twitter users, there’s an option that allows them to send a simultaneous tweet when they post a comment. It’s a great way for your commenters to link back to your site and drive new traffic and comments.

Echo Commenting

Echo is a suit of services that offers highly social real-time applications. Their commenting application allows comments to flow into a stream in real-time which in turns drive more engagement and provides an ideal communication channels for commenters. Similar to the other two services reviewed above, Echo allows users to log in with their social networking identity. One of its other convenience is Echo’s ability to pull in social mentions from Twitter and Facebook that eventually get added to the comment stream.

Social Sign-In

Janrain Engage

Janrain Engage (formerly RPX) helps connect your site to the social web through a robust set of APIs and social widget interfaces. Ultimately, a Janrain Engage solution accelerates your user registration and sign-in process by quickly and easily converting anonymous site visitors into active registered users. In addition, Janrain Engage enables you to import a rich set of profile data and social graphs from your users’ social networks allowing you to gain both deeper insight into your users, keep their profiles up to date, and transform your site into a more social destination.

Gigya

Gigya makes sites social by providing a full solution of social plugins including social login, game mechanics, sharing, comments, and live chat. Its social login solution provides several options for people to connect with your site or app using established identities from more than 24 providers including Facebook, Twitter, Yahoo, PayPal, LinkedIn, Google and AOL.  Gigya can also access and apply rich profile data including gender, interests and activities.

Social Toolbars

BumpIn SocialBar

SocialBar is a social networking toolbar that sits at the bottom of your page to provide a variety of social and site specific features to your visitors. It combines recommendations from Facebook, tweets from Twitter as well as social bookmarking buttons. There are several other add-ons like social chat, site search and translation that you can include when configuring and generation your toolbar.

Wibiya

Wibiya is another social networking toolbar that allows you to easily increase page views and user engagement, and promote your content via social services. Similar to Socialbar, you can choose from different applications during configuration to boost your web site’s social connectivity.

Post from: Hot Scripts Blog

7 Useful Social Applications for your Web Site

Related posts:

1. 10 Useful APIs for your Web Site & App
2. Web Applications to enhance your Workflow and Productivity
3. Web Development Applications for Mac OS X