SlideShare uma empresa Scribd logo
1 de 25
SPS St. Louis Mark Rackley
mrackley@paitgroup.com
A Power User’s Intro to jQuery Awesomeness in SharePoint
© 2016 PAIT Group http://www.paitgroup.com @mrackley
Mark Rackley / Partner & CTO
• 20+ years software
architecture and
development experience
• Office 365 MVP, SharePoint
Junkie since 2007
• Event Organizer
(SharePointalooza.org)
• Blogger, Writer, Speaker
• Bacon aficionado
@mrackley
www.SharePointHillbilly.com
www.PaitGroup.com
www.SharePointaLooza.org
www.StratusForms.com
#SayNoToInfoPath
© 2016 PAIT Group http://www.paitgroup.com @mrackley
Agenda
• What are we talking about?
• Why should you care?
• How to do it
• Best practices and things you should avoid doing
• Demos, examples, and where to find them
© 2016 PAIT Group http://www.paitgroup.com @mrackley
What are we talking about?
• Enhancing pages in SharePoint using JavaScript and jQuery
(developer stuff)
• It’s easy to do (yes, even for you)
• The possibilities are pretty endless
• Dashboards
• Custom Forms
• Animations
• More organized and visually appealing SharePoint content
© 2016 PAIT Group http://www.paitgroup.com @mrackley
Why Should You Care?
• SharePoint gets you MOST of the way there
• It makes SharePoint more visually appealing
• It makes SharePoint easier to use
• It’s simple (if you are careful)
• It’s only going to get more important
© 2016 PAIT Group http://www.paitgroup.com @mrackley
How (a Power User) Should do it
• Upload file(s) to a document library
• Users must have read access to library
• Create or edit an existing page
• Insert a Content Editor Web Part
• Link Content Editor Web Part to file you uploaded in
document library
• Ta and da…
DEMO: Add your first jQuery
script
© 2016 PAIT Group http://www.paitgroup.com @mrackley
Best Practices for the Power User
• Understand the basics
• Functionality is generally made up of multiple files
• Some are stored in your document library
• Some are stored somewhere else
• Some may already to referenced
• Don’t reference a script more than once
• Don’t throw multiple scripts on a page and expect them to work
• Don’t combine scripts and expect them to work
• Don’t mess with the script without understanding what you are
changing and expect it to work
© 2016 PAIT Group http://www.paitgroup.com @mrackley
Anatomy of a Script
© 2016 PAIT Group http://www.paitgroup.com @mrackley
Anatomy of a Script
• Script References
© 2016 PAIT Group http://www.paitgroup.com @mrackley
Anatomy of a Script
• Style Sheet References
© 2016 PAIT Group http://www.paitgroup.com @mrackley
Anatomy of a Script
• Additional Styles
© 2016 PAIT Group http://www.paitgroup.com @mrackley
Anatomy of a Script
• HTML
© 2016 PAIT Group http://www.paitgroup.com @mrackley
Anatomy of a Script
• JavaScript
Examples and Demos
© 2016 PAIT Group http://www.paitgroup.com @mrackley
Tabbed Web Parts
• http://www.paitgroup.com/sharepoint-tabbed-web-
partshillbillytabs-3-0/
Place web parts on a page into tabs.
© 2016 PAIT Group http://www.paitgroup.com @mrackley
Content Slider
• http://info.paitgroup.com/blog/the-ultimate-content-slider-
for-sharepoint
• Everybody loves content sliders
© 2016 PAIT Group http://www.paitgroup.com @mrackley
Digital Signatures in SharePoint
• http://www.paitgroup.com/easy-digital-signatures-in-
sharepoint/
• Easy digital signatures for your lists and libraries
© 2016 PAIT Group http://www.paitgroup.com @mrackley
Office 365 Video Portal
• http://www.paitgroup.com/integrate-your-office-365-video-
portal-with-sharepoint-online/
• Integrate your Office 365 Video Portal into your SharePoint
Online
© 2016 PAIT Group http://www.paitgroup.com @mrackley
Tabify SharePoint Forms
• http://www.markrackley.net/2015/12/03/tabify-your-
sharepoint-forms/
Modify your SharePoint form so that the fields are displayed in
tabs
© 2016 PAIT Group http://www.paitgroup.com @mrackley
Responsive Promoted Links
• http://info.paitgroup.com/blog/sharepoint-responsive-
promoted-links
• Add responsive tiles to a page that can be used as links to
other pages or sites. Personalize tiles so that users only see
links that are relevant
© 2016 PAIT Group http://www.paitgroup.com @mrackley
Cascading Drop Down Lists
• http://www.markrackley.net/2014/05/20/cascading-drop-
down-lists-in-sharepoint-office-365-using-rest/
Filter a drop down list based upon the value of another drop
down list.
© 2016 PAIT Group http://www.paitgroup.com @mrackley
Customize SharePoint Forms
• http://www.markrackley.net/2013/08/29/easy-custom-
layouts-for-default-sharepoint-forms/
Use HTML to transform a default form in SharePoint so that it
looks highly stylized
© 2016 PAIT Group http://www.paitgroup.com @mrackley
What’s next???
• Learn HTML, CSS, JavaScript
• http://www.pluralsight.com
• Create a page in SharePoint and play around
Thank you.
© 2015 PAIT Group June 29, 2015

Mais conteúdo relacionado

Mais procurados

SPTechCon Dev Days - Third Party jQuery Libraries
SPTechCon Dev Days - Third Party jQuery LibrariesSPTechCon Dev Days - Third Party jQuery Libraries
SPTechCon Dev Days - Third Party jQuery Libraries
Mark Rackley
 
SharePoint & jQuery Guide - SPSNashville 2014
SharePoint & jQuery Guide - SPSNashville 2014SharePoint & jQuery Guide - SPSNashville 2014
SharePoint & jQuery Guide - SPSNashville 2014
Mark Rackley
 
SPUnite17 Migrating your Customizations from On-prem to SharePoint Online
SPUnite17 Migrating your Customizations from On-prem to SharePoint OnlineSPUnite17 Migrating your Customizations from On-prem to SharePoint Online
SPUnite17 Migrating your Customizations from On-prem to SharePoint Online
NCCOMMS
 
SharePoint - Creating Beautiful Yet Powerful Dashboards Using jQuery
SharePoint - Creating Beautiful Yet Powerful Dashboards Using jQuerySharePoint - Creating Beautiful Yet Powerful Dashboards Using jQuery
SharePoint - Creating Beautiful Yet Powerful Dashboards Using jQuery
Ken Kuzdas
 

Mais procurados (20)

Introduction to StratusForms #SayNoToInfoPath
Introduction to StratusForms #SayNoToInfoPathIntroduction to StratusForms #SayNoToInfoPath
Introduction to StratusForms #SayNoToInfoPath
 
SPTechCon Boston 2015 - Overcoming SharePoint Limitations
SPTechCon Boston 2015 - Overcoming SharePoint LimitationsSPTechCon Boston 2015 - Overcoming SharePoint Limitations
SPTechCon Boston 2015 - Overcoming SharePoint Limitations
 
The SharePoint & jQuery Guide
The SharePoint & jQuery GuideThe SharePoint & jQuery Guide
The SharePoint & jQuery Guide
 
NOW I Get it!! What SharePoint IS and why I need it
NOW I Get it!! What SharePoint IS and why I need itNOW I Get it!! What SharePoint IS and why I need it
NOW I Get it!! What SharePoint IS and why I need it
 
SPTechCon Dev Days - Third Party jQuery Libraries
SPTechCon Dev Days - Third Party jQuery LibrariesSPTechCon Dev Days - Third Party jQuery Libraries
SPTechCon Dev Days - Third Party jQuery Libraries
 
SharePoint & jQuery Guide - SPSNashville 2014
SharePoint & jQuery Guide - SPSNashville 2014SharePoint & jQuery Guide - SPSNashville 2014
SharePoint & jQuery Guide - SPSNashville 2014
 
SPUnite17 Transforming your Organisation into a Digital Workplace
SPUnite17 Transforming your Organisation into a Digital WorkplaceSPUnite17 Transforming your Organisation into a Digital Workplace
SPUnite17 Transforming your Organisation into a Digital Workplace
 
TulsaTechFest - Maximize SharePoint UX with free jQuery libraries
TulsaTechFest - Maximize SharePoint UX with free jQuery librariesTulsaTechFest - Maximize SharePoint UX with free jQuery libraries
TulsaTechFest - Maximize SharePoint UX with free jQuery libraries
 
SPTechCon 2014 How to develop and debug client side code in SharePoint
SPTechCon 2014 How to develop and debug client side code in SharePointSPTechCon 2014 How to develop and debug client side code in SharePoint
SPTechCon 2014 How to develop and debug client side code in SharePoint
 
SPUnite17 Migrating your Customizations from On-prem to SharePoint Online
SPUnite17 Migrating your Customizations from On-prem to SharePoint OnlineSPUnite17 Migrating your Customizations from On-prem to SharePoint Online
SPUnite17 Migrating your Customizations from On-prem to SharePoint Online
 
HTML Semantic Tags
HTML Semantic TagsHTML Semantic Tags
HTML Semantic Tags
 
SPTechCon DevDays - SharePoint & jQuery
SPTechCon DevDays - SharePoint & jQuerySPTechCon DevDays - SharePoint & jQuery
SPTechCon DevDays - SharePoint & jQuery
 
HTML 5 Fundamental
HTML 5 FundamentalHTML 5 Fundamental
HTML 5 Fundamental
 
Using jQuery to Maximize Form Usability
Using jQuery to Maximize Form UsabilityUsing jQuery to Maximize Form Usability
Using jQuery to Maximize Form Usability
 
From Design to a modern Style Guide
From Design to a modern Style GuideFrom Design to a modern Style Guide
From Design to a modern Style Guide
 
SharePoint & jQuery Guide - SPSTC 5/18/2013
SharePoint & jQuery Guide - SPSTC 5/18/2013 SharePoint & jQuery Guide - SPSTC 5/18/2013
SharePoint & jQuery Guide - SPSTC 5/18/2013
 
Modern SharePoint, the Good, the Bad, and the Ugly
Modern SharePoint, the Good, the Bad, and the UglyModern SharePoint, the Good, the Bad, and the Ugly
Modern SharePoint, the Good, the Bad, and the Ugly
 
Enhance the Usability of Your SharePoint Site with JSLink #Collab365 #C365114...
Enhance the Usability of Your SharePoint Site with JSLink #Collab365 #C365114...Enhance the Usability of Your SharePoint Site with JSLink #Collab365 #C365114...
Enhance the Usability of Your SharePoint Site with JSLink #Collab365 #C365114...
 
Using Client Side Technologies to create a dynamic org chart in SharePoint 20...
Using Client Side Technologies to create a dynamic org chart in SharePoint 20...Using Client Side Technologies to create a dynamic org chart in SharePoint 20...
Using Client Side Technologies to create a dynamic org chart in SharePoint 20...
 
SharePoint - Creating Beautiful Yet Powerful Dashboards Using jQuery
SharePoint - Creating Beautiful Yet Powerful Dashboards Using jQuerySharePoint - Creating Beautiful Yet Powerful Dashboards Using jQuery
SharePoint - Creating Beautiful Yet Powerful Dashboards Using jQuery
 

Semelhante a A Power User's intro to jQuery awesomeness in SharePoint

What is share point sps_denver_final
What is share point sps_denver_finalWhat is share point sps_denver_final
What is share point sps_denver_final
M Allmond
 
Building rich interface components with SharePoint
Building rich interface components with SharePointBuilding rich interface components with SharePoint
Building rich interface components with SharePoint
Louis-Philippe Lavoie
 
Office 365: Is Governance Affected and Where Do We Start? (SPS Charlotte)
Office 365: Is Governance Affected and Where Do We Start? (SPS Charlotte)Office 365: Is Governance Affected and Where Do We Start? (SPS Charlotte)
Office 365: Is Governance Affected and Where Do We Start? (SPS Charlotte)
Stacy Deere
 

Semelhante a A Power User's intro to jQuery awesomeness in SharePoint (20)

CIAOPS Need to Know Office 365 Webinar - February 2018
CIAOPS Need to Know Office 365 Webinar - February 2018CIAOPS Need to Know Office 365 Webinar - February 2018
CIAOPS Need to Know Office 365 Webinar - February 2018
 
Search Driven Solutions
Search Driven SolutionsSearch Driven Solutions
Search Driven Solutions
 
SharePoint 2013 Web Content Management for Developers TSPUG
SharePoint 2013 Web Content Management for Developers TSPUGSharePoint 2013 Web Content Management for Developers TSPUG
SharePoint 2013 Web Content Management for Developers TSPUG
 
SharePoint 2013 Web Content Management for Developers HSPUG
SharePoint 2013 Web Content Management for Developers HSPUGSharePoint 2013 Web Content Management for Developers HSPUG
SharePoint 2013 Web Content Management for Developers HSPUG
 
Coexist or Integrate? How Add-ins Deliver an Integrated Environment to Manage...
Coexist or Integrate? How Add-ins Deliver an Integrated Environment to Manage...Coexist or Integrate? How Add-ins Deliver an Integrated Environment to Manage...
Coexist or Integrate? How Add-ins Deliver an Integrated Environment to Manage...
 
What is share point sps_denver_final
What is share point sps_denver_finalWhat is share point sps_denver_final
What is share point sps_denver_final
 
Writing futuristic workflows in office 365 SharePoint 2013 2016 on premise
Writing futuristic workflows in office 365 SharePoint 2013 2016 on premiseWriting futuristic workflows in office 365 SharePoint 2013 2016 on premise
Writing futuristic workflows in office 365 SharePoint 2013 2016 on premise
 
Cloud Saturday Chicago 2016 - Modern Intranet Development Best Practices on S...
Cloud Saturday Chicago 2016 - Modern Intranet Development Best Practices on S...Cloud Saturday Chicago 2016 - Modern Intranet Development Best Practices on S...
Cloud Saturday Chicago 2016 - Modern Intranet Development Best Practices on S...
 
Getting started developing for share point
Getting started developing for share pointGetting started developing for share point
Getting started developing for share point
 
SharePoint Upgrade or Migration, or is it both? - SPS London 2016
SharePoint Upgrade or Migration, or is it both? - SPS London 2016SharePoint Upgrade or Migration, or is it both? - SPS London 2016
SharePoint Upgrade or Migration, or is it both? - SPS London 2016
 
Branding office 365 with front end tooling
Branding office 365 with front end toolingBranding office 365 with front end tooling
Branding office 365 with front end tooling
 
Building rich interface components with SharePoint
Building rich interface components with SharePointBuilding rich interface components with SharePoint
Building rich interface components with SharePoint
 
SharePoint Modern Support and Assistance
SharePoint Modern Support and AssistanceSharePoint Modern Support and Assistance
SharePoint Modern Support and Assistance
 
SharePoint Saturday Kansas 2015 - Building Killer Office365 Public Sites
SharePoint Saturday Kansas 2015 - Building Killer Office365 Public SitesSharePoint Saturday Kansas 2015 - Building Killer Office365 Public Sites
SharePoint Saturday Kansas 2015 - Building Killer Office365 Public Sites
 
Power apps and flow user group
Power apps and flow user groupPower apps and flow user group
Power apps and flow user group
 
SharePoint 2013 Preview
SharePoint 2013 PreviewSharePoint 2013 Preview
SharePoint 2013 Preview
 
Office 365: Is Governance Affected and Where Do We Start? (SPS Charlotte)
Office 365: Is Governance Affected and Where Do We Start? (SPS Charlotte)Office 365: Is Governance Affected and Where Do We Start? (SPS Charlotte)
Office 365: Is Governance Affected and Where Do We Start? (SPS Charlotte)
 
Html5
Html5Html5
Html5
 
Product Catalog and IT Service Management
Product Catalog and IT Service ManagementProduct Catalog and IT Service Management
Product Catalog and IT Service Management
 
Lifecycle Management with SharePoint Apps and Solutions
Lifecycle Management with SharePoint Apps and SolutionsLifecycle Management with SharePoint Apps and Solutions
Lifecycle Management with SharePoint Apps and Solutions
 

Mais de Mark Rackley

SharePoint Conference North America - Converting your JavaScript to SPFX
SharePoint Conference North America - Converting your JavaScript to SPFXSharePoint Conference North America - Converting your JavaScript to SPFX
SharePoint Conference North America - Converting your JavaScript to SPFX
Mark Rackley
 
What is SharePoint Development??
What is SharePoint Development??What is SharePoint Development??
What is SharePoint Development??
Mark Rackley
 
What IS SharePoint Development?
What IS SharePoint Development?What IS SharePoint Development?
What IS SharePoint Development?
Mark Rackley
 
SharePoint Cincy 2012 - jQuery essentials
SharePoint Cincy 2012 - jQuery essentialsSharePoint Cincy 2012 - jQuery essentials
SharePoint Cincy 2012 - jQuery essentials
Mark Rackley
 

Mais de Mark Rackley (12)

Column Formatter in SharePoint Online
Column Formatter in SharePoint OnlineColumn Formatter in SharePoint Online
Column Formatter in SharePoint Online
 
SharePoint Conference North America - Converting your JavaScript to SPFX
SharePoint Conference North America - Converting your JavaScript to SPFXSharePoint Conference North America - Converting your JavaScript to SPFX
SharePoint Conference North America - Converting your JavaScript to SPFX
 
SPSNH 2014 - The SharePoint & jQueryGuide
SPSNH 2014 - The SharePoint & jQueryGuideSPSNH 2014 - The SharePoint & jQueryGuide
SPSNH 2014 - The SharePoint & jQueryGuide
 
The SharePoint & jQuery Guide - Updated 1/14/14
The SharePoint & jQuery Guide - Updated 1/14/14The SharePoint & jQuery Guide - Updated 1/14/14
The SharePoint & jQuery Guide - Updated 1/14/14
 
SharePoint REST vs CSOM
SharePoint REST vs CSOMSharePoint REST vs CSOM
SharePoint REST vs CSOM
 
Introduction to Client Side Dev in SharePoint Workshop
Introduction to Client Side Dev in SharePoint WorkshopIntroduction to Client Side Dev in SharePoint Workshop
Introduction to Client Side Dev in SharePoint Workshop
 
What is SharePoint Development??
What is SharePoint Development??What is SharePoint Development??
What is SharePoint Development??
 
SharePoint and jQuery Essentials
SharePoint and jQuery EssentialsSharePoint and jQuery Essentials
SharePoint and jQuery Essentials
 
Wrapping your head around the SharePoint Beast (For the rest of us)
Wrapping your head around the SharePoint Beast (For the rest of us)Wrapping your head around the SharePoint Beast (For the rest of us)
Wrapping your head around the SharePoint Beast (For the rest of us)
 
What IS SharePoint Development?
What IS SharePoint Development?What IS SharePoint Development?
What IS SharePoint Development?
 
SPSTC - SharePoint & jQuery Essentials
SPSTC - SharePoint & jQuery EssentialsSPSTC - SharePoint & jQuery Essentials
SPSTC - SharePoint & jQuery Essentials
 
SharePoint Cincy 2012 - jQuery essentials
SharePoint Cincy 2012 - jQuery essentialsSharePoint Cincy 2012 - jQuery essentials
SharePoint Cincy 2012 - jQuery essentials
 

Último

Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
panagenda
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 

Último (20)

AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUnderstanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
 
GenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdfGenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdf
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
 
🐬 The future of MySQL is Postgres 🐘
🐬  The future of MySQL is Postgres   🐘🐬  The future of MySQL is Postgres   🐘
🐬 The future of MySQL is Postgres 🐘
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
 

A Power User's intro to jQuery awesomeness in SharePoint

  • 1. SPS St. Louis Mark Rackley mrackley@paitgroup.com A Power User’s Intro to jQuery Awesomeness in SharePoint
  • 2. © 2016 PAIT Group http://www.paitgroup.com @mrackley Mark Rackley / Partner & CTO • 20+ years software architecture and development experience • Office 365 MVP, SharePoint Junkie since 2007 • Event Organizer (SharePointalooza.org) • Blogger, Writer, Speaker • Bacon aficionado @mrackley www.SharePointHillbilly.com www.PaitGroup.com www.SharePointaLooza.org www.StratusForms.com #SayNoToInfoPath
  • 3. © 2016 PAIT Group http://www.paitgroup.com @mrackley Agenda • What are we talking about? • Why should you care? • How to do it • Best practices and things you should avoid doing • Demos, examples, and where to find them
  • 4. © 2016 PAIT Group http://www.paitgroup.com @mrackley What are we talking about? • Enhancing pages in SharePoint using JavaScript and jQuery (developer stuff) • It’s easy to do (yes, even for you) • The possibilities are pretty endless • Dashboards • Custom Forms • Animations • More organized and visually appealing SharePoint content
  • 5. © 2016 PAIT Group http://www.paitgroup.com @mrackley Why Should You Care? • SharePoint gets you MOST of the way there • It makes SharePoint more visually appealing • It makes SharePoint easier to use • It’s simple (if you are careful) • It’s only going to get more important
  • 6. © 2016 PAIT Group http://www.paitgroup.com @mrackley How (a Power User) Should do it • Upload file(s) to a document library • Users must have read access to library • Create or edit an existing page • Insert a Content Editor Web Part • Link Content Editor Web Part to file you uploaded in document library • Ta and da…
  • 7. DEMO: Add your first jQuery script
  • 8. © 2016 PAIT Group http://www.paitgroup.com @mrackley Best Practices for the Power User • Understand the basics • Functionality is generally made up of multiple files • Some are stored in your document library • Some are stored somewhere else • Some may already to referenced • Don’t reference a script more than once • Don’t throw multiple scripts on a page and expect them to work • Don’t combine scripts and expect them to work • Don’t mess with the script without understanding what you are changing and expect it to work
  • 9. © 2016 PAIT Group http://www.paitgroup.com @mrackley Anatomy of a Script
  • 10. © 2016 PAIT Group http://www.paitgroup.com @mrackley Anatomy of a Script • Script References
  • 11. © 2016 PAIT Group http://www.paitgroup.com @mrackley Anatomy of a Script • Style Sheet References
  • 12. © 2016 PAIT Group http://www.paitgroup.com @mrackley Anatomy of a Script • Additional Styles
  • 13. © 2016 PAIT Group http://www.paitgroup.com @mrackley Anatomy of a Script • HTML
  • 14. © 2016 PAIT Group http://www.paitgroup.com @mrackley Anatomy of a Script • JavaScript
  • 16. © 2016 PAIT Group http://www.paitgroup.com @mrackley Tabbed Web Parts • http://www.paitgroup.com/sharepoint-tabbed-web- partshillbillytabs-3-0/ Place web parts on a page into tabs.
  • 17. © 2016 PAIT Group http://www.paitgroup.com @mrackley Content Slider • http://info.paitgroup.com/blog/the-ultimate-content-slider- for-sharepoint • Everybody loves content sliders
  • 18. © 2016 PAIT Group http://www.paitgroup.com @mrackley Digital Signatures in SharePoint • http://www.paitgroup.com/easy-digital-signatures-in- sharepoint/ • Easy digital signatures for your lists and libraries
  • 19. © 2016 PAIT Group http://www.paitgroup.com @mrackley Office 365 Video Portal • http://www.paitgroup.com/integrate-your-office-365-video- portal-with-sharepoint-online/ • Integrate your Office 365 Video Portal into your SharePoint Online
  • 20. © 2016 PAIT Group http://www.paitgroup.com @mrackley Tabify SharePoint Forms • http://www.markrackley.net/2015/12/03/tabify-your- sharepoint-forms/ Modify your SharePoint form so that the fields are displayed in tabs
  • 21. © 2016 PAIT Group http://www.paitgroup.com @mrackley Responsive Promoted Links • http://info.paitgroup.com/blog/sharepoint-responsive- promoted-links • Add responsive tiles to a page that can be used as links to other pages or sites. Personalize tiles so that users only see links that are relevant
  • 22. © 2016 PAIT Group http://www.paitgroup.com @mrackley Cascading Drop Down Lists • http://www.markrackley.net/2014/05/20/cascading-drop- down-lists-in-sharepoint-office-365-using-rest/ Filter a drop down list based upon the value of another drop down list.
  • 23. © 2016 PAIT Group http://www.paitgroup.com @mrackley Customize SharePoint Forms • http://www.markrackley.net/2013/08/29/easy-custom- layouts-for-default-sharepoint-forms/ Use HTML to transform a default form in SharePoint so that it looks highly stylized
  • 24. © 2016 PAIT Group http://www.paitgroup.com @mrackley What’s next??? • Learn HTML, CSS, JavaScript • http://www.pluralsight.com • Create a page in SharePoint and play around
  • 25. Thank you. © 2015 PAIT Group June 29, 2015