Hide Sharepoint Web Parts using Javascript

 I have placed List webpart to filter some value then pass to other Webpart to display filtered Content.

The following code will hide the List webpart then users will not see those Hidden Value.

you just find that webpart ID and add in the following code.

Add this to Script Editor Webpart. Publish the page then the web part will be hidden.

Work Around Code:

<script type="text/javascript">

document.getElementById('MSOZoneCell_WebPartWPQ6').style.display='none';

</script>

Impact of deactivating the Limited-access user permission lockdown mode feature

Rquirement:

To provide granular & Folder level permissions to individual folders in a document library. I attempt to do this by clicking the Share function on the folder but get a message that I cannot because of the Limited-access user permission lockdown mode feature. What is this feature used for? Are there features that are dependent on this feature? What is the impact of disabling it?

1. if you want to use the sharepoint server publishing infrastructure feature, you will lose the feature of sharing a folder. you can share files in the folder with other users instead.
   

2. if you don’t use the sharepoint server publishing infrastructure feature, you can disable the limited-access user permission lockdown mode feature to restore the feature of sharing a folder.

Access denied to Style library on SharePoint Online while create new folder or uploading files

 

Issue Details

we faced an issue when trying to create fodler and Files

Cause

when futher investigating, The Modern Sites and scripting not allowing updating Site property bag.

Resolution

Run this scrip then you can create folder and upload files

1. Connect to the Site using SharePoint Management PowerShell as shown in the below command line.

Connect-SPOService -Url https://<tenantname>-admin.sharepoint.com

2. Run the below script to turn off NoScript on the modern site. After sucess, try to upload images to Style library and it should work fine.

Set-SPOSite -Identity https://<SiteUrl> -DenyAddAndCustomizePages 0

Sharepoint Online - Quick Edit supports JS Link and Client Side Rendering

The sharepoint online list quick edit (Data Sheet View) would support Client Side Rendering Code (CSR).

when I renamed a file to become “kar.txt” it turns the background green &  text white colour tag.   This could be leveraged to give end users real-time feedback on the values entered.   Unlike a JQuery page load event which only triggers once, this triggers per row as values are changed.

 Upload JS file to Site Asset library and Provide in the following

~site/SiteAssets/CSSQEdit.js

Sharepoint 2013 or Online Enter date picker in the data sheet view scrolls form to the top of the Page

When you create data sheet view with Date field and put in the Sharepoint Dash board page.

Users are trying to enter or change Date from Data Sheet view in the Chrome Browser.

Once User Clicked on the Date field, it will jump into the top of the page.

Users always facing difficult to enter Date field.

This is happening when using not -IE browsers.

If you use IE browser then there is no issue.

Find in the following work around code.

1. Open the Sharepoint Page.

2.Edit Page.

3.Add Script Editor web part and script tag begin and end.

4.Add the following code in the Script Editor.

5. Publish the page.

ExecuteOrDelayUntilScriptLoaded(
    function() {
        if (typeof(window.original_OnIframeLoadFinish) !== 'function') {
            window.original_OnIframeLoadFinish = window.OnIframeLoadFinish;
            window.OnIframeLoadFinish = function() {
                original_OnIframeLoadFinish.apply(this, arguments);
                window.Picker.contentWindow.original_setFocusDatepicker = window.Picker.contentWindow.setFocusDatepicker;

                window.Picker.contentWindow.setFocusDatepicker = function() {
                    workspaceTop = document.getElementById('s4-workspace').scrollTop;
                    window.Picker.contentWindow.original_setFocusDatepicker.apply(this, arguments);
                    document.getElementById('s4-workspace').scrollTop = workspaceTop;
                }
            }
        }
    }, "datepicker.js");

Save site as template in SharePoint Online or Sharepoint Site

To Save the site as a template you can follow this steps.

1. Open your the site with SharePoint Designer
2. In the ribbon go to Site Options
3. Locate the option SaveSiteAsTemplateEnabled and modify the value to true
4. Since the site template is disabled in the Publishing sites the option Save Site as Template is not available in the Site Settings you will need to navigate to the page directly: http://yourdomain.sharepoint.com/_layouts/savetmpl.aspx Provide all the details and click OK after a couple of minutes you will have the WSP site template generated

Note: If you have apps downloaded from the store they could prevent you to save the site as a template if you are facing this scenario you will need to uninstall the apps first.

Create a site based on the template will require a similar environment this means that you will need to have the same features installed and activated in the site collection where you want to install the template.

In this article you can find more information about how to activate the features. Save Publishing Site as template

If you have custom page layouts applied to your site site you might loose the access to the pages with them applied after creating the site based on the template.

If you face this issue you can follow this article to fix it Fix publishing pages with custom page layouts created from template

Apply Custom CSS to Sharepoint List View Webpart Pages

Apply in the below code to Script Editor web part or Content Editor Webpart in your list view sharepoint pages.

Add Style Tag begin and end in the following code:

Method 1:


 /* ---------- Table Rows ----------*/
    /* Set background for every row */
    .ms-listviewtable > tbody > tr {
        background: white;
    }

    /* Set border for every row */
    .ms-listviewtable > tbody > tr td{
        border-bottom: 1px solid #AFAFAF !important; /* !important needed over override SharePoint inline style */
        border-left: 1px solid #AFAFAF !important;
        border-right: 1px solid #AFAFAF !important;
    }

    /* Set background for every alternating row */
    .ms-listviewtable > tbody > tr.ms-alternating {
        background: #E2E3E5;
    }

    /* ---------- Table Header Row ----------*/
    /* Remove background set in SharePoint's general data table style */
    .ms-listviewtable tr.ms-viewheadertr {
        background: transparent;
    }

    /* Modify background color */
    tr.ms-viewheadertr > th.ms-vh-icon, /* Input box and attachment icon */
    tr.ms-viewheadertr > th.ms-vh, /* Text */
    tr.ms-viewheadertr > th.ms-vh2,
    tr.ms-viewheadertr > th /* Text */ {
        background: #2E4C70;
    }

    /* Modify background color on hover */
    tr.ms-viewheadertr > th.ms-vh:hover,
    tr.ms-viewheadertr > th.ms-vh2:hover,
    tr.ms-viewheadertr > th  {
        background-color: #273C51;
        border-color: #273C51;
    }

    /* Modify font color */
    .ms-viewheadertr a,
    .ms-viewheadertr div {
        color: white;
    }

    /* Modify font color on hover */
    .ms-viewheadertr a:hover,
    .ms-viewheadertr div:hover {
        color: white;
    }
    tr.ms-viewheadertr > th.ms-vh-icon:last-child {
        display:none;
    }



Method 2:

/* Modify font color */
    .ms-viewheadertr a {
color:White;
    }
    .ms-viewheadertr div {
        color: Blue;
    }

    /* Modify font color on hover */
    .ms-viewheadertr a:hover{
color: White;
}
    .ms-viewheadertr div:hover {
        color: #F36F21;
    }
tr.ms-viewheadertr > th /* Text */ {
        background: #034EA2;
    }
 tr.ms-viewheadertr > th  {
        background-color: #034EA2;
        border-color: #034EA2;
    }

li[text="Alert me"] {display:none;}

Screens:

Office 365 Site

Processing