尝试在 SharePoint Online 中包装提升的磁贴时代码未保存

Code not saving when trying to wrap promoted tiles in SharePoint Online

对于另一个关于此的问题,我深表歉意,但我已经非常努力地使它正常工作(我是 SharePoint 的新手,没有广泛的编码知识,但知道 HTML 并且大体上没问题正在排除故障)。

我们正在使用 SharePoint online 并且我们有 SharePoint Tiles。我们最近又添加了一些磁贴,但显然没有包裹这些磁贴,因此必须向右滚动才能访问一些。

我找到了包装图块的代码 here 并且在编辑页面源代码时,它似乎可以正常工作...直到我保存它。当我下次进入内容编辑器时,我输入的代码被删除了。

我已经阅读了几页内容并尝试了诸如内容编辑器 Web 部件之类的东西,但我终究无法让它工作。

如果有人知道是否有一步一步的指南来确保包装的瓷砖被保存,我也许能够让它发挥作用。

非常感谢任何帮助。

如果它有任何改变,我们将使用 Office 365 帐户中的 SharePoint online。

将以下代码添加到页面中的脚本编辑器 Web 部件中。

<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {  
    // Update this value to the number of links you want to show per row
    var numberOfLinksPerRow = 6;

    // local variables
    var pre = "<tr><td><div class='ms-promlink-body' id='promlink_row_";
    var post = "'></div></td></tr>";
    var numberOfLinksInCurrentRow = numberOfLinksPerRow;
    var currentRow = 1
    // find the number of promoted links we're displaying
    var numberOfPromotedLinks = $('.ms-promlink-body > .ms-tileview-tile-root').length;
    // if we have more links then we want in a row, let's continue
    if (numberOfPromotedLinks > numberOfLinksPerRow) {
        // we don't need the header anymore, no cycling through links
        $('.ms-promlink-root > .ms-promlink-header').empty();
        // let's iterate through all the links after the maximum displayed link
        for (i = numberOfLinksPerRow + 1; i <= numberOfPromotedLinks; i++) {
            // if we're reached the maximum number of links to show per row, add a new row
            // this happens the first time, with the values set initially
            if (numberOfLinksInCurrentRow == numberOfLinksPerRow) {
                // i just want the 2nd row to
                currentRow++;
                // create a new row of links
                $('.ms-promlink-root > table > tbody:last').append(pre + currentRow + post);
                // reset the number of links for the current row
                numberOfLinksInCurrentRow = 0;   
            }    
            // move the Nth (numberOfLinksPerRow + 1) div to the current table row    
            $('#promlink_row_' + currentRow).append($('.ms-promlink-body > .ms-tileview-tile-root:eq(' + (numberOfLinksPerRow) + ')'));    
            // increment the number of links in the current row
            numberOfLinksInCurrentRow++;  
        }
    }
});
</script>

我们也可以在页面的script editor web part中使用下面的CSS样式来实现。

<style>
.ms-promlink-body {
    width: 960px;
}      
</style>