Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Enhance the Usability of Your SharePoint Site with JSLink #Collab365 #C365114 by @SharePointWendy


Published on

Slides from the Collab365 Conference presented on October 7, 2015.

Published in: Technology
  • ➤➤ How Long Does She Want You to Last? Here's the link to the FREE report ♣♣♣
    Are you sure you want to  Yes  No
    Your message goes here
  • ★★ How Long Does She Want You to Last? ★★ A recent study proved that the average man lasts just 2-5 minutes in bed (during intercourse). The study also showed that many women need at least 7-10 minutes of intercourse to reach "The Big O" - and, worse still... 30% of women never get there during intercourse. Clearly, most men are NOT fulfilling there women's needs in bed. Now, as I've said many times - how long you can last is no guarantee of being a GREAT LOVER. But, not being able to last 20, 30 minutes or more, is definitely a sign that you're not going to "set your woman's world on fire" between the sheets. Question is: "What can you do to last longer?" Well, one of the best recommendations I can give you today is to read THIS report. In it, you'll discover a detailed guide to an Ancient Taoist Thrusting Technique that can help any man to last much longer in bed. I can vouch 100% for the technique because my husband has been using it for years :) Here's the link to the report ★★★
    Are you sure you want to  Yes  No
    Your message goes here

Enhance the Usability of Your SharePoint Site with JSLink #Collab365 #C365114 by @SharePointWendy

  1. 1. Online Conference June 17th and 18th 2015 WWW.COLLAB365.EVENTS Enhance the Usability of Your SharePoint Site with JSLink
  2. 2. WWW.COLLAB365.EVENTS Wendy Neal SharePoint Evangelist Email : Twitter : @SharePointWendy Facebook : LinkedIn : Google+ : Cedar Rapids, Iowa, USA Website: • Contributing Author: • CMSWire • ITUnity • Contact Details
  3. 3. WWW.COLLAB365.EVENTS Agenda Brief Usability Overview What is JSLink? Awesome Things You Can Do With JSLink DEMO
  4. 4. WWW.COLLAB365.EVENTS Brief Usability Overview
  5. 5. WWW.COLLAB365.EVENTS Rule #1: Don’t Make Me Think According to Steve Krug, websites should be: • Self-evident • Obvious • Self-explanatory • Should not cause users confusion or to think
  6. 6. WWW.COLLAB365.EVENTS What Makes Users Frustrated? • Inconsistent navigation • Too many primary nav links • Active links not highlighted • Too many mouse clicks • Can’t find what you’re looking for • Cluttered (balance between text, images, whitespace) • Too many words on page • Left/right scrolling • Performance (site is slow) • Not evident whether form was submitted successfully • It isn’t clear what you’re supposed to do/focus on • Unclear error messages
  7. 7. WWW.COLLAB365.EVENTS What is JSLink?
  8. 8. WWW.COLLAB365.EVENTS What is JSLink? • A web part property that allows you to link JavaScript file(s) to a page • Objects that have a JSLink property: – List Views (some exceptions, e.g. Calendar View) – List Forms (New, Edit, View forms) – List View and List Form web parts – Site Column – Content Type
  9. 9. WWW.COLLAB365.EVENTS Setting JSLink Property • Field definition • Custom code • PowerShell • User interface
  10. 10. WWW.COLLAB365.EVENTS Setting JSLink Property in UI • Expand the Miscellaneous section in web part properties • Reference to JS file must begin with URL Token (e.g. ~site) • Can reference multiple JS files (separated by pipe character)
  11. 11. WWW.COLLAB365.EVENTS URL Tokens Token Location ~site Reference to the current SharePoint site ~sitecollection Reference to the current SharePoint site collection ~layouts Reference to the web application Layouts folder (on-premises only) – e.g. /_layouts/15 ~sitecollectionlayouts Reference to the Layouts folder in the current site collection (on premises only) – e.g. /sites/team/_layouts/15 ~sitelayouts Reference to the Layouts folder in the current site (on premises only) – e.g. /sites/teams/subsite/_layouts/15
  12. 12. WWW.COLLAB365.EVENTS Best Practices • Create reusable Site Collection JS file if possible • Avoid polluting the JS global namespace • Call your function explicitly (not self executing)
  13. 13. WWW.COLLAB365.EVENTS Awesome Things You Can Do With JSLink
  14. 14. WWW.COLLAB365.EVENTS Tasks List - View • Color code Reminder Date • Add a Priority icon • Hide Priority column header • Color code Context • Hide Color column
  15. 15. WWW.COLLAB365.EVENTS Context List – Add/Edit • Add color picker to text field -
  16. 16. WWW.COLLAB365.EVENTS Projects List – View • Color code entire row based on status • Percent Complete slider
  17. 17. WWW.COLLAB365.EVENTS Projects List – Edit • Read-only controls in edit mode • Percent Complete input slider
  18. 18. WWW.COLLAB365.EVENTS Projects List – Add • Auto-populate Category field from query string
  19. 19. WWW.COLLAB365.EVENTS Suppliers List – View • Delete icons
  20. 20. WWW.COLLAB365.EVENTS Suppliers List – Add/Edit • Email field validator
  21. 21. WWW.COLLAB365.EVENTS Announcements List – View • Trim long body text and add More link
  22. 22. WWW.COLLAB365.EVENTS Team Sales List – View • Color code negative numbers
  24. 24. WWW.COLLAB365.EVENTS References • • • • • for-list-view • • jslink-templates?next_slideshow=1 • rendering-with-jslink-in-sharepoint-2013/
  25. 25. WWW.COLLAB365.EVENTS Stay tuned for more great sessions … Thanks for watching!