Convert an Userscript to a Chrome Extension

Let me show you an example how to convert a Userscript like “Pinterest without registration” to a basic Chrome Extension.

    1. Get the Userscript from https://greasyfork.org/en/scripts/6325-pinterest-without-registration.
    2. Install it to Tampermonkey or Greasemonkey.
    3. Test it at http://pinterest.com
    4. Create a new directory on your disk like “ChromeExtensionPinterest”
    5. Create inside this directory a file “content.js”
    6. $(document).ready(function () {
      	if(!!$("div.HomePage").length)
      		location.href = "https://www.pinterest.com/categories";
      
      	$("head").append("<style>.UnauthBanner, body > .Modal, .ModalManager > .Modal {display: none !important; } " +
      		".noScroll { overflow: auto !important; } " +
      		"div.gridContainer > div, .Grid { height: auto !important; }</style>");
      	$("body").removeClass("noTouch");
      	
      	$('.leftHeaderContent > .searchFormHidden').css('float', 'right');
      	$('.searchFormHidden').removeClass('searchFormHidden');
      	$('form[name=search] .tokenizedInputWrapper').css({
      		'border-left': $('form[name=search] .tokenizedInputWrapper').css('border-right'),
      		'border-radius': '6px'
      	});
      });
      
      
    7. Create inside this directory a file “manifest.json”
      {
        "manifest_version": 2,
        "name": "Pinterest Extension",
        "version": "0.1",
         "browser_action": {
         },
        "content_scripts": [
          {
            "matches": [
              "https://*.pinterest.com/*"
            ],
            "js": ["jquery-2.1.4.min.js", "content.js"]
          }
        ]
      }
      
    8. Don’t forget to download and copy jquery-2.2.3.js from http://code.jquery.com
    9. jQuery isn’t necessary, but it makes everything easier.

    10. Install your new Chrome Extension

 

 

  1. Leave a comment

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: