var title google chrome extensions n.
Download
Skip this Video
Loading SlideShow in 5 Seconds..
var title = “ Google Chrome Extensions ”; PowerPoint Presentation
Download Presentation
var title = “ Google Chrome Extensions ”;

Loading in 2 Seconds...

play fullscreen
1 / 27

var title = “ Google Chrome Extensions ”; - PowerPoint PPT Presentation


  • 141 Views
  • Uploaded on

var title = “ Google Chrome Extensions ”;. $(this).attr(“title”, title); $(this).data( { description: ‘How to create and distribute’ , by: ‘Christo Tsvetanov ’ } );. What is Google Chrome Extension?.

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about 'var title = “ Google Chrome Extensions ”;' - hashim


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
var title google chrome extensions

var title = “Google Chrome Extensions”;

$(this).attr(“title”, title);

$(this).data({

description: ‘How to create and distribute’,

by: ‘Christo Tsvetanov’

});

what is google chrome extension
What is Google Chrome Extension?
  • Small software programs that can modify and enhance the functionality of the Chrome browser.
  • HTML, JavaScript, jQuery, and CSS
  • Browser action
  • Page action
  • Manifest file
  • Background page
  • Popup
  • Content script
where to start
Where to start?
  • http://developer.chrome.com/extensions/index.html
manifest file
Manifest file
  • http://developer.chrome.com/extensions/manifest.html
manifest json
manifest.json
  • Mandatory
    • "manifest_version": 2,
    • "name": "One-Click Translate Selection",
    • "version": "2.0",
options
Options
  • "options_page": "options.html",
change icon at runtime
Change icon at runtime
  • chrome.browserAction.setIcon({path: ‘icon19-active.png'});
message passing
Message Passing
  • http://developer.chrome.com/extensions/messaging.html
send m essage
Send Message
  • From background.js
receive message
Receive Message
  • From content_script.js
  • chrome.extension.onRequest.addListener(onExtensionMessage);
publishing
Publishing
  • As “sources”
  • As .crx file
  • Chrome Web Store
  • Demo
best practices
Best Practices
  • Use Browser Actions for features that make sense on most pages.
  • Use Page Actions for features that make sense for only a few pages
  • Do use big, colorful icons that make the most of the 19x19-pixel space.
  • Do use alpha transparency to add soft edges to your icon.
jquery
jQuery
  • Avoid using of CDN
  • Load jQuery in popup.html
    • <script src="/js/jquery-1.8.1.min.js"></script>
    • <script src="/js/popup.js"></script>
  • "background": { "scripts": ["jquery.js","background.js"] },
  • Jsfiles are loaded in the order they are specified!!!
  • Injecting jQuery?
links
Links
  • http://goo.gl/bnXrgQ
lazy method
Lazy method
  • Go to https://chrome.google.com/webstore/
  • In search bar type: translate selection
  • On top select the Extensions tab
  • Find the extension with author Christo Tsvetanov
thanks to our sponsors
Thanks to our Sponsors:

Diamond Sponsor:

Gold Sponsors:

Silver Sponsors:

Technological Partners:

Swag Sponsors:

Media Partners: