Rotating Banner in SharePoint with a DataView Webpart
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Rotating Banner in SharePoint with a DataView Webpart

on

  • 6,482 views

Adding customized functionality to SharePoint by using the Dataview Webpart such as a Rotating Banner

Adding customized functionality to SharePoint by using the Dataview Webpart such as a Rotating Banner

Statistics

Views

Total Views
6,482
Views on SlideShare
6,478
Embed Views
4

Actions

Likes
0
Downloads
21
Comments
0

1 Embed 4

http://www.linkedin.com 4

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Rotating Banner in SharePoint with a DataView Webpart Presentation Transcript

  • 1. By Echo Schmidt
  • 2. Extending SharePoint• Adding Code to HIVE• Install Webparts from ThirdParty• Create your own Webparts• Adding Code Library• DataView Webpart
  • 3. Extending the DataView Webpart PowerUser’s Can Do It It’s Backed-up In the Database It’s Easy to Reproduce It’s Easy to Customize It’s Backed-up & can be recovered
  • 4. What Can It Be…• Custom Calendar Query• Rotating Image• Custom Web Report• Graphs• News Widget…..Anything that uses a List or Library
  • 5. Code Samples CodePlex CodeProject Stackoverflow Dreamincode Gethub CodeCanyon http://codecanyon.net/item/translucent-responsive-banner-rotator-slider/801607
  • 6. Step 1. Download your Sample Code &Verify it works outside of SharePoint Upload Code to a Code Library in SharePoint
  • 7. Code Library
  • 8. Step 2. Create a webpage in SharePoint for adding theDataview Webpart to.
  • 9. Step 3. Create a SharePoint Library or List to containinformation. Site Actions > View All Site Content > Create > PictureLibrary Note: The webpage should be in the same SharePointsite as the List or Library
  • 10. Scenario Details Banners Title Image Name Description URL
  • 11. Step 4. Add CSS, jquery or other code reference to Masterpageor Page Template
  • 12. Step 5.• Open your webpage in SharePoint Designer andDetach it from the PageLayout
  • 13. Step 6. Select the location on the webpage you want to insertthe DataView Webpart (DVWP)
  • 14. Step 6. Choose DataView > Insert DataView from Navigation
  • 15. Step 6. You’ll now notice that your Webpart Zone Contains aDVWP that is not configured
  • 16. Step 7. Click on link provide to add a Data Source for theDVWP
  • 17. Step 7. Expand the SharePointLibraries from theData Source Library Pane,and select Banners Dropdown
  • 18. Step 7. Select “Show Data”from the Banners Dropdown
  • 19. Step 7. You should now be on theData Source Details pane. Select the data you want touse to create your banner.
  • 20. Step 7.Now you can choose Insert Selected Fields as… >Multiple Item View
  • 21. Step 8. Change DVWP Layout
  • 22. Step 8. Choose a Layoutwithout a table.
  • 23. Step 9. Now you havecode you cancustomize
  • 24. Banner Code Customization
  • 25. Save List/Library as Template Open List Go to List Settings Choose Library/ListSettings Choose Save Library/Listas Template
  • 26. Finding the List {ListId}• Open List• Go to List Settings• In list URL look for ?List=%7B• Copy Everything after the % 7B• Eliminate %7B & %7D• Replace %2D with -%7BA381305C%2D8D20%2D44E6%2D8037%2DE8F7D689B6B5%7DA381305-8D20-44E6-8037-E8F7D689B6B5
  • 27. Edit your Webpart Choose to Edit/Modify yourWebpart then select“Parameters Editor…”
  • 28. Update Parameter for Webpart Update the ListIDand Save