Citizen Developers Intro to jQuery Customizations in SharePoint

Apr 22, 2017Download as pptx, pdf2 likes439 views

Now Power Users and Citizen Developers can add awesome functionality to their SharePoint Sites without having to write any JavaScript.

SPS Omaha Mark Rackley
mrackley@paitgroup.com
A Power User’s Intro to jQuery Awesomeness in SharePoint

© 2017 PAIT Group http://www.paitgroup.com @mrackley
Mark Rackley / Partner & CSO
• 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.MarkRackley.net
www.PAITGroup.com
www.SharePointaLooza.org
www.StratusForms.com
#SayNoToInfoPath

MARCH 9,10 2018
MEMPHIS, TN
WWW.SHAREPOINTALOOZA.ORG

© 2017 PAIT Group http://www.paitgroup.com @mrackley
Agenda
• What is this “Stuff”?
• Why should you care?
• How to do it
• Best practices and things you should avoid doing
• Demos, examples, and where to find them

© 2017 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

© 2017 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

© 2017 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…

© 2017 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

© 2017 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.

© 2017 PAIT Group http://www.paitgroup.com @mrackley
Content Slider
• http://info.paitgroup.com/blog/the-ultimate-content-slider-
for-sharepoint
• Everybody loves content sliders

© 2017 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

© 2017 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

© 2017 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

© 2017 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

© 2017 PAIT Group http://www.paitgroup.com @mrackley
Cascading Drop Down Lists
• http://info.paitgroup.com/blog/new-and-improved-
cascading-dropdowns-for-sharepoint-classic-forms
• Multi-Level Cascading Drop Downs for your Classic
SharePoint Forms

© 2017 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

© 2017 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
http://www.paitgroup.com
http://www.markrackley.net
mrackley@paitgroup.com
@mrackley
© 2017 PAIT Group http://www.PAITGroup.com

The document discusses using jQuery in SharePoint to improve user interfaces and interactions. It begins with an introduction to jQuery and why it is useful for SharePoint. It then covers jQuery basics like selecting elements, showing/hiding content, and getting/setting values. Additional topics include best practices, using third-party jQuery libraries, and a demonstration of jQuery UI tabs. The presentation aims to explain how jQuery can be used to enhance SharePoint with interactive elements and animated transitions.

A Power User's intro to jQuery awesomeness in SharePointMark Rackley

This document summarizes a presentation about enhancing SharePoint pages using JavaScript and jQuery. It discusses why power users should care about using these technologies, how to add basic jQuery scripts to SharePoint pages through content editor web parts, best practices, and provides examples of common scripts including tabbed web parts, content sliders, digital signatures, and filtering drop down lists.

A Power User's Introduction to jQuery Awesomeness in SharePointMark Rackley

This document discusses using jQuery to enhance pages in SharePoint. It begins with an introduction to jQuery and why a power user should care. It then explains how a power user can start using jQuery by uploading files to a document library and linking them to a content editor web part. The document provides best practices for power users and concludes with several demos of jQuery features like tabbed web parts, content sliders, digital signatures, and custom forms.

#SPSTC Maximizing the SharePoint User Experience with Free 3rd Party jQuery L...Mark Rackley

A Power User's Intro to jQuery Awesomeness in SharePointMark Rackley

SPUnite17 Transforming your Organisation into a Digital WorkplaceNCCOMMS

The document discusses the digital transformation of a global organization using Office 365. It describes how a champion educated stakeholders about digital possibilities, identified quick wins like mobile forms, and implemented solutions in phases over 18 months. This ignited momentum for additional projects and improved collaboration across the organization. The process took two years and key lessons included prioritizing training, understanding executive priorities, and not underestimating cultural change.

SPUnite17 Migrating your Customizations from On-prem to SharePoint OnlineNCCOMMS

This document provides an overview of challenges and strategies for migrating customizations from an on-premises SharePoint deployment to SharePoint Online. It discusses remediation approaches for various types of custom code and solutions, including full trust code, custom web parts and controls, user profile properties, timer jobs, event receivers, connected applications, and content customizations like custom fields, site definitions, and list definitions. The presentation outlines how to identify these customizations, replace unsupported solutions like full trust code and event receivers with remote alternatives, handle authentication and throttling for connected applications, and migrate customized content structures and data.

Using Client Side Technologies to create a dynamic org chart in SharePoint 20...Jennifer Kenderdine

Philly Code Camp Oct SharePoint/Office 365 Developer Best PracticesJennifer Kenderdine

The document outlines an agenda for a SharePoint/Office 365 developer best practices event featuring a keynote from Scott Guthrie. It provides details on the technical sessions and hands-on labs to be presented, covering topics like security, networking, development tools, APIs, custom solutions, performance, and references. The document also includes guidance for SharePoint developers on best practices for configuration vs customization, terminology, planning, pages, branding and design, error logging, and more.

(Updated) SharePoint & jQuery GuideMark Rackley

This document provides a summary of a presentation on using jQuery with SharePoint. It discusses: 1) Why jQuery is useful for SharePoint - it allows dynamic updates without custom code, improves visuals and usability, and can work around limitations like the list view threshold. 2) The basics of using jQuery with SharePoint, including common methods to interact with elements, attributes, and SharePoint list data via APIs. 3) Best practices for jQuery development, such as putting code in document ready functions, debugging techniques, and chaining methods to concisely select and update elements.

SPTechCon Boston 2015 - Utilizing jQuery in SharePointMark Rackley

Introduction to StratusForms #SayNoToInfoPathMark Rackley

This document introduces StratusForms, a lightweight alternative to InfoPath that allows building forms using HTML, CSS and JavaScript. Key points include: - StratusForms uses client-side code to build forms that can be customized and styled easily. - It works with SharePoint 2007-2013 and Office 365 to store form data in lists and promote fields. - Additional features include repeating sections, parent-child relationships, reporting, and field encryption. - Support and customization services are available, and a premium version with automated configuration is coming soon to the SharePoint Store. - The document demonstrates how to initialize a form, submit data, validate fields, and generate reports on form data.

Intro to SharePoint Web ServicesMark Rackley

This document provides an introduction and overview of SharePoint web services: - It describes what web services are and how they enable machine-to-machine communication over a network using standards like SOAP and XML. - Common SharePoint web services are introduced that provide programmatic access to functionality like retrieving list data, managing lists and sites, and searching. - Programming fundamentals for working with SharePoint web services are covered, including using CAML for queries and handling errors. - An example is shown of making a call to the Lists.GetListItems web service and parsing the XML response.

Extensión de office con adal.js y office ui fabricMario Cortés Flores

NOW I Get it!! What SharePoint IS and why I need itMark Rackley

This document discusses SharePoint and why it can be difficult to understand. It begins by explaining that there is a lot of information available about SharePoint but it is conflicting and noisy, making it hard to know where to start. It also notes that SharePoint requires changing how people work. The document then defines SharePoint as a collaboration and organization platform that can be customized. It provides tips to avoid SharePoint pain, such as not expecting clear error messages. Finally, it emphasizes the importance of joining the SharePoint community to learn from others.

The SharePoint & jQuery GuideMark Rackley

This document provides a 3 sentence summary of the SharePoint and jQuery Guide document: The document outlines how to use jQuery with SharePoint by discussing jQuery basics, deployment options, development practices, interacting with SharePoint forms and lists using jQuery, and includes demos of reading list items with SPServices and interacting with forms. It provides guidance on when jQuery is appropriate to use with SharePoint and best practices for jQuery development and deployment in the SharePoint environment. The document is intended as a guide for those looking to leverage jQuery client-side capabilities with SharePoint.

Spsnyc 2016 JSLink PrimerMichael Oryszak

SPTechCon Boston 2015 - Overcoming SharePoint LimitationsMark Rackley

This document discusses creating list views for large SharePoint lists. It begins with an introduction of the speaker and an overview of the agenda. It then covers the problems with large lists, such as losing functionality at the list view threshold of 5,000 items. It recommends preparing for large lists by using retention policies and indexing columns. It demonstrates using jQuery and REST to query large lists. Finally, it demonstrates creating interactive list views for large data sets using DataTables, bringing REST and DataTables together to build powerful views.

O365Con18 - Security and Compliance - Liz SundetNCCOMMS

The document discusses training administrators and users to properly handle electronic protected health information (ePHI) to comply with business associate agreements and regulations. It recommends establishing policies, standards, and guidelines to outline specific requirements around acceptable use, and demonstrates how to use tools like Azure Information Protection and compliance scores to monitor usage.

Changing the way you work with Modern SharePoint Team Sites and Office 365 Gr...Chirag Patel

Session presented online at a 24 hour Collab365 Global Conference on 19-20 October 2016. Microsoft SharePoint has evolved across many folds such as contextual reporting, navigation, library, lists and more importantly integration with Office 365 Groups from a user perspective. This session will demonstrate all the capabilities and along the way how to get things done in a different and smarter way to succeed in your multidisciplinary teams. You Will Learn : - Overview of modern SharePoint team site experiences - Finding and searching your way to the content you and the team are working on - Sharing and accessing content in a number of ways Suitable For : Administrator, Architect, Business Analyst Track : Business/End User

ESPC 2016 - From SharePoint to Office 365 Development - The path to your new ...Sébastien Levert

The world around the Office Developer is changing and for someone with a heavy SharePoint background, it can be somewhat scary to make the move to the cloud. But don’t be scared SharePoint Developer – From SharePoint to Office Development, become an added-value Office Developer and contribute to maximise the productivity of your enterprise. In this session, we will cover every aspect of the new Office Developer paradigm and we will ensure that you can make yourself at home in such a new world. The topics covered will be : – SharePoint Add-In – Office 365 Apps – Office Add-In – Microsoft Graph Benefits of Attending this Session: Learn what an Office Developer is See code in action representing the Office Developer day-to-day Leverage the most active community around productivity development

SharePoint Saturday Brussels 2018 - Modern Collaboration in Teams & Projects ...Jasper Oosterveld

How to Make the Most of Google Analytics on Your Evoq SiteDNN

Bruce Chapman is a product manager at DNN who created their first analytics module and has presented on analytics at conferences. Web analytics provides information on visitor numbers, where visitors come from, and what they do on a site, allowing adjustments to content based on data. While Google Analytics is powerful and free, it can be difficult for editors to access and understand. Integrating analytics into a content management system like Evoq improves access and understanding by providing the data in context within the authoring experience.

SPTechCon Dev Days - Third Party jQuery LibrariesMark Rackley

This document discusses maximizing the SharePoint user experience through the use of free third-party jQuery libraries. It provides an overview of several popular jQuery libraries - jQueryUI, DataTables, FullCalendar, Chart.js, and Stratus Forms - and includes demos of building tabs, lists, calendars, charts, and forms with them. The document emphasizes that client-side development can enhance SharePoint without the need for expensive tools or deep coding skills.

Enhance the Usability of Your SharePoint Site with JSLink #Collab365 #C365114...Wendy Neal

This document summarizes an online conference session about enhancing the usability of SharePoint sites using JSLink. The session will include a brief overview of usability principles, an introduction to what JSLink is and how it can be used, demonstrations of ways to customize and enhance lists and forms using JSLink, and references for further information. The demo portion will feature examples of using JSLink to add things like color coding, icons, and formatting to tasks, projects, and other lists in SharePoint.

Bringing Zest to SharePoint Sites Using Out-of-the-Box Technologyjoelsef

The document discusses various ways to enhance SharePoint sites using out-of-the-box technologies, ranging from simple to more advanced options. It provides examples in four "Tiers" - Tier 1 options require no code and include changing themes, re-enabling quick launch navigation, and using choice columns. Tier 2 utilizes tools like the content editor web part and SharePoint Designer for widgets, scripts, and gadgets. Tier 3 involves advanced SharePoint Designer configurations and some code. Tier 4 includes enterprise applications and custom web parts requiring programming. Specific scenarios around page design, forms, and metrics are also presented.

Modern SharePoint, the Good, the Bad, and the UglyBob German

Bob German is a Principal Architect at BlueMetal who leads Office 365 and SharePoint development. In his presentation, he discusses Microsoft's modernization of the SharePoint user experience to be more mobile-friendly. This includes modern document libraries, lists, and team sites. He demonstrates the modern experiences and notes both improvements like a better mobile and editing experience, as well as limitations like missing web parts and limited customization options. He also discusses how administrators can control the modern experiences at the tenant, site collection, and list level.

User Interface Tips and Tricks for the Power User - Penelope CoventrySPC Adriatics

Often information workers are asked to make their SharePoint site look pretty. This session will look at what a power user should and should not do to enhance the User Interface of sites. It will include explanations of page types, master pages and Page Layouts as well as what is responsive web design. Then using no-code, Penny will amend the look and feel of page, including composed looks, adding buttons to the Ribbon and the List Item Menu. This is not a developer session and will cover both SharePoint in Office 365, and on-premises installations of SharePoint 2013.

Coexist or Integrate? How Add-ins Deliver an Integrated Environment to Manage...Concept Searching, Inc

Concept Searching provides add-ins that allow for the integration of their automatic metadata generation technology with SharePoint to improve search and management of unstructured content. Their add-ins deliver semantic metadata without requiring custom code on SharePoint servers. Add-ins provide benefits like improved performance, stability, scalability, and easier deployment compared to traditional SharePoint customizations. Concept Searching's add-ins extract conceptual metadata and classify content to enable better search, compliance, and governance of enterprise information.

What is share point sps_denver_finalM Allmond

Nedra Allmond presented an overview of SharePoint, discussing its official definition, key features known as the six pillars, different versions and pricing, common uses cases, and career opportunities working with SharePoint. She provided examples of public SharePoint sites and a case study of how a CFO used SharePoint to consolidate lease documents. Allmond emphasized that SharePoint enables improved collaboration, document management, and business processes across organizations.

More Related Content

What's hot (20)