Script & Style Revamp with Submission Favelet

By  on  

It's been six months and some change since the launch of Script & Style and the website is doing extremely well. Traffic continues to rise, our RSS feed subscriber count is close to 4,000, the submissions continue to be quality, and we're slowly adding new features to the site. We've recently taken some time to revamp the website to continue its growth.

Click here to read Chris Coyier's article with regard to the site redesign.

The newest code snippet we've added to enhance your S&S experience is a submission favelet/bookmarklet. This new favelet allows you to quickly submit the article you're reading, no matter what the source, to Script & Style. All you need to do is select/highlight the text you'd like to act as the article description and click the favelet. A new window will appear with the submission screen already filled out for you!

The Favelet Code

//favelet modified from:  http://cubicle17.com/post/32941821/bookmarklet-search-netflix
(function()%7Bvar%20d=document,w=window,ds=d.getSelection,ws=w.getSelection,ss=d.selection,e=encodeURIComponent;t=(ws)%3Fws():(ds)%3Fds():(ss)%3Fss.createRange().text:'';t=(t.toString().length)%3Ft:prompt('Please select article description text.','');if(t)%7Ba='http://www.scriptandstyle.com/submit%3Ftitle=' + e(document.title) + '%26url=' + e(window.location) + '%26content=';u=a+e(t);f=function()%7Bx=w.open(u,'nfx','scrollbars=1,toolbar=0,resizable=1,status=1,width=600,height=600');if(!x)w.location.href=u;%7D;if(/Firefox/.test(navigator.userAgent))setTimeout(f,0);else%20f();%7D%7D)();

Don't worry about the mess of code. All you need to do is drag the link to your "favorites" toolbar and it will work on any site you visit!

Jump on over to Script & Style to check out the new look and be sure to grab the Script & Style favelet!

Recent Features

  • By
    5 More HTML5 APIs You Didn’t Know Existed

    The HTML5 revolution has provided us some awesome JavaScript and HTML APIs.  Some are APIs we knew we've needed for years, others are cutting edge mobile and desktop helpers.  Regardless of API strength or purpose, anything to help us better do our job is a...

  • By
    Creating Scrolling Parallax Effects with CSS

    Introduction For quite a long time now websites with the so called "parallax" effect have been really popular. In case you have not heard of this effect, it basically includes different layers of images that are moving in different directions or with different speed. This leads to a...

Incredible Demos

  • By
    Create a Trailing Mouse Cursor Effect Using MooTools

    Remember the old days of DHTML and effects that were an achievement to create but had absolutely no value? Well, a trailing mouse cursor script is sorta like that. And I'm sorta the type of guy that creates effects just because I can.

  • By
    Image Manipulation with PHP and the GD Library

    Yeah, I'm a Photoshop wizard. I rock the selection tool. I crop like a farmer. I dominate the bucket tool. Hell, I even went as far as wielding the wizard wand selection tool once. ...OK I'm rubbish when it comes to Photoshop.

Discussion

  1. I like the change to the layout. Not that I disliked the previous, but the new one lends itself to the content well. Cool favelet, nice job man!

  2. talv

    nice redesign but your footer still says 2008!

  3. Hey David, just wanted to let you know that I’ve turned the “Social Bookmarking Menu” into a WordPress plugin and submitted it to the plugins directory on WordPress.org…

    Until they add it though, it’s available for download on my site here: http://eight7teen.com/sexy-bookmarks

    Script & Style is still the default #1 link in the menu! I figured that was the least I could do for you and Chris getting a buzz going about the menu on Script & Style!

    You know, in the one day that it was on the front page over there, the original menu was downloaded over 4,000 times!! Anyway, thanks again and I’m still working on those questions… I’ll email them to you when I finish.

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!