Your SlideShare is downloading. ×
0
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
[wcatx] jQuery for WordPress Theme Designers
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

[wcatx] jQuery for WordPress Theme Designers

210

Published on

A talk given at WordCamp Austin 2013 on using jQuery with WordPress Themes. Full post and slides at http://brvry.me/Z456Ol

A talk given at WordCamp Austin 2013 on using jQuery with WordPress Themes. Full post and slides at http://brvry.me/Z456Ol

Published in: Design, Technology, Business
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
210
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. jQuery for theme designersJOEL G GOODMANPRINCIPAL / BRAVERY TRANSMEDIA
  • 2. who is joel goodman?
  • 3. Joel G GoodmanAustin • Chicago • St Louis • SO Cal@joelGoodman#wcATX #WPJquery
  • 4. ”jQuery for theme designers @joelgoodman #wcatx #wpjqueryWHAT IS JQUERY?“jQuery is a fast, small, and feature-rich JavaScript library.It makes things like HTML document traversal andmanipulation, event handling, animation, and Ajax muchsimpler with an easy-to-use API that works across amultitude of browsers. With a combination of versatilityand extensibility, jQuery has changed the way thatmillions of people write JavaScript.jquery.com
  • 5. ”jQuery for theme designers @joelgoodman #wcatx #wpjqueryWHAT IS JQUERY?“A kind of shorthand for writing Javascript.Me
  • 6. jQuery for theme designers @joelgoodman #wcatx #wpjqueryWHY IS JQUERY GOOD?• It’s a shortcut• That means you don’thave to learn actualjavascript
  • 7. jQuery for theme designers @joelgoodman #wcatx #wpjqueryWHY IS JQUERY GOOD FOR THEME DESIGNERS?Huge DevelopmentCommunity lots of documentation
  • 8. jQuery for theme designers @joelgoodman #wcatx #wpjqueryWHY IS JQUERY GOOD FOR THEME DESIGNERS?Plugins for just abouteverything In WordPress Core
  • 9. jQuery for theme designers @joelgoodman #wcatx #wpjqueryLET’S GET DOWN TO IT2METHODS TOCORRECTLYINCLUDE JQUERYIN YOUR THEMEwp_register_script();wp_enqueue_script();
  • 10. jQuery for theme designers @joelgoodman #wcatx #wpjqueryTell WOrdPress about your script.
  • 11. jQuery for theme designers @joelgoodman #wcatx #wpjquery
  • 12. jQuery for theme designers @joelgoodman #wcatx #wpjqueryTell WOrdPress t0 run your script.
  • 13. jQuery for theme designers @joelgoodman #wcatx #wpjqueryTell WOrdPress t0 run your script.
  • 14. jQuery for theme designers @joelgoodman #wcatx #wpjqueryPULL YOUR SCRIPT OUT OF THE QUEUENOW IN REVERSE.
  • 15. jQuery for theme designers @joelgoodman #wcatx #wpjqueryOR GET FANCY.NOW IN REVERSE.
  • 16. jQuery for theme designers @joelgoodman #wcatx #wpjquery• de-registers stock jquery• re-registers the script but with the googlehosted version of the sourceNOW IN REVERSE.
  • 17. jQuery for theme designers @joelgoodman #wcatx #wpjqueryHow about a demo?
  • 18. jQuery for theme designers @joelgoodman #wcatx #wpjquery
  • 19. jQuery for theme designers @joelgoodman #wcatx #wpjquery
  • 20. jQuery for theme designers @joelgoodman #wcatx #wpjquery
  • 21. jQuery for theme designers @joelgoodman #wcatx #wpjqueryHOW ABOUT A DEMO?•defines a click/tap action•Adds/removes .hide-menu•CSS handles the animation
  • 22. jQuery for theme designers @joelgoodman #wcatx #wpjqueryHOW ABOUT A DEMO?
  • 23. jQuery for theme designers @joelgoodman #wcatx #wpjqueryHow about anotherdemo?
  • 24. jQuery for theme designers @joelgoodman #wcatx #wpjquerySAY YOU WANT TO USE A JQUERY PLUGIN
  • 25. jQuery for theme designers @joelgoodman #wcatx #wpjquerySAY YOU WANT TO USE A JQUERY PLUGIN
  • 26. jQuery for theme designers @joelgoodman #wcatx #wpjquerySAY YOU WANT TO USE A JQUERY PLUGIN
  • 27. jQuery for theme designers @joelgoodman #wcatx #wpjquerySAY YOU WANT TO USE A JQUERY PLUGINFirst we enqueue jQuery
  • 28. jQuery for theme designers @joelgoodman #wcatx #wpjquerySAY YOU WANT TO USE A JQUERY PLUGINThen we register our plugins
  • 29. jQuery for theme designers @joelgoodman #wcatx #wpjquerySAY YOU WANT TO USE A JQUERY PLUGINFinally, we register our script fileand enqueue it all.
  • 30. jQuery for theme designers @joelgoodman #wcatx #wpjquerySAY YOU WANT TO USE A JQUERY PLUGIN/js/brvry-effects.js
  • 31. jQuery for theme designers @joelgoodman #wcatx #wpjquerySAY YOU WANT TO USE A JQUERY PLUGIN•select the .nav-bar menu•the local scroll pluginhandles the rest.
  • 32. jQuery for theme designers @joelgoodman #wcatx #wpjquery
  • 33. jQuery for theme designers @joelgoodman #wcatx #wpjqueryWHAT’S WITH ALL THE HASSLE?DON’T BREAK STUFF
  • 34. jQuery for theme designers @joelgoodman #wcatx #wpjquery• safely de-registers stock jquery• re-registers the script but with the googlehosted version of the sourceREMEMBER THIS?
  • 35. jQuery for theme designersJOEL G GOODMANPRINCIPAL / BRAVERY TRANSMEDIAQuestions!
  • 36. JOEL G GOODMANPrincipal, Bravery Transmediajoel@brvry.me@joelgoodman • @braverymediabraverytransmedia.com

×