Create a custom Team web part using SharePoint server object model and bootstrap

In this blog, we will discuss how to create a team web part in SharePoint using the SharePoint Server object model. The motto of this web part is, it will show you the all team sites and subsite which you have the member permission.

Create a custom Team web part using SharePoint server object model and bootstrap

Let’s there is a site name called EnjoySharePoint and it has five subsites (A, B, C, D, and E). Suppose you are the part of EnjoySharePoint with B and E subsites. So when you logged in to the site, You can able to see only three sites which you have access.

Here you can create a visual web part and use the below code.

The below is my HTML code to populate the sites inside a Repeater control.

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
<script src="/_layouts/15/Common/jquery.simplyscroll.js"></script>
<link href="/_layouts/15/Common/jquery.simplyscroll.css" rel="stylesheet" />

<script type="text/javascript">
    (function ($) {
        $(function () {
            $(".timeline").simplyScroll({
                customClass: 'vert',
                orientation: 'vertical',
                auto: false,
                speed: 10
            });
        });
    })(jQuery);
</script>

<div class="col-xs-6">
    <div class="my-team">
        <div class="box box-solid">
            <div class="box-header with-border">
                <h3 class="box-title">My Team</h3>
            </div>
            <div class="nav-tabs-custom">
                <ul class="nav nav-tabs">
                    <li class="active"><a href="#tab_Active" data-toggle="tab" aria-expanded="true">List</a></li>
                </ul>

                <div class="tab-content">
                    <div class="tab-pane active" id="tab_Active">
                        <ul class="timeline">
                            <asp:Repeater ID="getTeamMember" runat="server">
                                <ItemTemplate>
                                    <li>

                                        <asp:HyperLink ID="HyperLink2" Text='<%# Bind("SiteName")%>' NavigateUrl='<%# Bind("SiteURL")%>' runat="server" />
                                    </li>

                                </ItemTemplate>
                            </asp:Repeater>
                        </ul>

                    </div>
                </div>
                <!-- /.tab-content -->
            </div>
        </div>
    </div>
</div>

The below code will retrieve the site name which you have access.

using Microsoft.SharePoint;
using System;
using System.ComponentModel;
using System.Data;
using System.Linq;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;

namespace MyWebpart.Intranet.WebParts.MyTeams
{
    public partial class MyTeamsUserControl : UserControl
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            try
            {
                DataTable dt = new DataTable();
                dt.Columns.Add("SiteName", typeof(string));
                dt.Columns.Add("SiteURL", typeof(string));
                SPSite siteName = new SPSite(SPContext.Current.Web.Url);
                foreach (SPWeb web in siteName.AllWebs)
                {

                    if (web.DoesUserHavePermissions(web.CurrentUser.LoginName, SPBasePermissions.ManageWeb))
                    {
                        DataRow dr = dt.NewRow();
                        if (dt.Rows.Count < 10)
                        {
                            if (!string.IsNullOrEmpty(web.Title.ToString()) && web.Title.ToString()!=null)
                            {
                                dr[0] = web.Title;
                                dr[1] = web.Url;
                                dt.Rows.Add(dr);
                                dt.AcceptChanges();
                            }

                        }

                    }
                    getTeamMember.DataSource = dt;
                    getTeamMember.DataBind();
                }
            }
            catch (Exception)
            {

                throw;
            }
        }

       
    }
}

The below is the output of the code which I have access.

Congratulations!! 🎉👏

We have reached the end of our journey. I hope you enjoyed learning with me and now feel confident to continue on to your next adventure.

You may like following SharePoint server object model tutorials:

• Create a web part page using visual studio 2013 in SharePoint 2013
• Show all list in the dropdown list using visual web part configuration properties in SharePoint 2010
• Create Visual Web Part using Visual Studio 2010 in SharePoint 2010
• Add Custom Web Part Properties in SharePoint 2013 Visual Web Part
• Retrieve all site templates using server object model in SharePoint 2016/2013
• Retrieve all site collections under particular content databases using SharePoint 2016 server object model
• Get all workflows from all site collections using the server object model in SharePoint 2013
• Override List View Threshold using SharePoint server object model Programmatically
• Delete All Attachments from SharePoint 2013 list item by using Server object model code

But it doesn’t have to end here. My next article will focus on helping you get started with the very exciting custom Web Parts in SharePoint 2013/2016/2019 and SharePoint online.

To get a notification when my next article is out, you can follow enjoysharepoint on Facebookand follow us on Twitter.

It was a pleasure to be on this journey with you.