Application

The listed code snippets are additions and bugfixes (related to third party plugins) for the Linchpin Theme Plugin.

In order to use these functions/bugfixes, copy and paste the according code snippets into the custom CSS and custom JS fields of the Linchpin Theme Plugin.

 

Disclaimer

Use these code snippets at your own risk!

//SEIBERT/MEDIA does not assume any liability for the correctness / operational capability of the offered code snippets.


Documentation's navigation


On this page



Function

Valid for Confluence

Content Navigation / Toolbar

Display content navigation / toolbar icons without description 

JS
// Display content navigation / toolbar icons without description
(function($) {  
  var metroTile = {    
    dom: function() {      
      this.spans = $(".content-navigation .aui-button > span");      
      this.underlines = $(".content-navigation .aui-button > span > u");    
    },
        modify: function() {      
      this.dom();      
      this.spans.contents().filter(function() {        
        return this.nodeType == 3;      
      }).remove();      
      this.underlines.remove();    
    }  
  }  
  $(document).ready(function() {    
    metroTile.modify();  
  });  
  $("body").on("DOMSubtreeModified", ".content-navigation", function() {    
    metroTile.modify();  
  });
})(AJS.$)

Fix for wrong-positioned "share"-popup in content navigation / toolbar when using the Comala Workflows (Comala Document Management) plugin

CSS
/* Fix for wrong-positioned "share"-popup in content navigation / toolbar when using Comala Workflows-plugin */
div#inline-dialog-shareContentPopup > .aui-inline-dialog-contents {
    margin-left: -50px;
}
FROM 5.10

Navigation Menu Editor

Set column count and width for submenus of the "Navigation Menu Editor" plugin

JS
// Set column count and width for submenus of "Navigation Menu Editor"-plugin
SeibertMedia = (typeof SeibertMedia === "undefined") ? {} : SeibertMedia;
SeibertMedia.MenuEditor = SeibertMedia.MenuEditor || {};
SeibertMedia.MenuEditor.FlyoutColumnWidth = 450;
SeibertMedia.MenuEditor.FlyoutMaxColumns = 2;


FROM 5.10

Login

Set background color / image on login screen via Linchpin Theme customCSS

Examples

YOUR BASE64 IMAGE PATH: data:image/jpeg;base64,/9j/4AAQSkZJRgAB...
YOUR HEX CODE IMAGE COLOR: #000000 for black background
CSS
/* Set background color / image on login screen via Linchpin Theme customCSS */
html body.login {
 background: url("YOUR BASE64 IMAGE PATH") no-repeat center center fixed; /* for example "data:image/jpeg;base64,/9j/4AAQSkZJRgAB..." */
 background-color: YOUR HEX CODE IMAGE COLOR; /* for example #000000 for black background */
 background-size: cover!important;
}

FROM 5.10

Dashboard

Hide unintentional scrollbars from dashboard items when using sections (e.g for the Cover Stories macro)

CSS
/* Hide unintentional scrollbars from dashboard items when using sections */
body.dashboard .confluence-dashboard .wiki-content .innerCell { 
	overflow: visible; 
}

Hide third party web panels in welcome message (dashboard)

/* Remove unintentional web panels below welcome message on dashboard */
.confluence-dashboard ul#web-panels {
    display: none;
}

Hide the task macro on the dashboard (Comala Document Management plugin)

< Version 4.16.0

CSS
body.dashboard #welcome-message > .section-title.welcome-message + table.awpdashboard {
    display: none;
}

body.dashboard #welcome-message > .section-title.welcome-message {
    display: none;
}

> Version 4.16.0

CSS
body.dashboard .awpdashboard{
 display: none; 
} 

Hide "Invite user" & "Create space" buttons on the dashboard

CSS
body.dashboard .confluence-dashboard aside.content-sidebar .dashboard-buttons {
	display: none;
}

 FROM 5.10

Linchpin Sidebar

Function: A click outside of the Linchpin Sidebar will close it

JS
"use strict";
var SeibertMedia;
(function (SeibertMedia) {
    var misc;
    (function (misc) {
        var SidebarAutoClose = (function () {
            function SidebarAutoClose() {
                this.$sidebar = $("#linchpin-sidebar-container");
            }
            SidebarAutoClose.prototype.registerHandler = function () {
                var _this = this;
                $(document).click(function (e) {
                    _this.closeIfNecessary(e);
                });
            };
            SidebarAutoClose.prototype.closeIfNecessary = function (e) {
                AJS.debug("isClickOutsideOfLPSidebar " + this.isClickOutsideOfLPSidebar(e));
                AJS.debug("isOverlayVisible " + SidebarAutoClose.isOverlayVisible());
                AJS.debug("isSidebarOpened " + SidebarAutoClose.isSidebarOpened());
                AJS.debug("isClickInAuiDialog " + SidebarAutoClose.isClickInAuiDialog(e));
                if (this.isClickOutsideOfLPSidebar(e) && !SidebarAutoClose.isOverlayVisible() && SidebarAutoClose.isSidebarOpened() && !SidebarAutoClose.isClickInAuiDialog(e)) {
                    this.$sidebar.find(".menu-item.active-tab").click();
                }
            };
            SidebarAutoClose.prototype.isClickOutsideOfLPSidebar = function (e) {
                return !$.contains(this.$sidebar.get(0), e.target);
            };
            SidebarAutoClose.isOverlayVisible = function () {
                var attrAriaHidden = $("body > .aui-blanket").attr("aria-hidden");
                var overlayVisibility = $("body > .aui-blanket").is(":visible");
                return !(typeof attrAriaHidden === "undefined" || attrAriaHidden == "true" || !overlayVisibility);
            };
            SidebarAutoClose.isSidebarOpened = function () {
                return $("#linchpin-sidebar .slidebar.sidebar-opened").length > 0;
            };
            SidebarAutoClose.isClickInAuiDialog = function (e) {
                return ($(e.target).parents(".aui-layer.aui-dialog2").length > 0);
            };
            return SidebarAutoClose;
        }());
        misc.SidebarAutoClose = SidebarAutoClose;
    })(misc = SeibertMedia.misc || (SeibertMedia.misc = {}));
})(SeibertMedia || (SeibertMedia = {}));
// initialize
AJS.toInit(function () {
    new SeibertMedia.misc.SidebarAutoClose().registerHandler();
});

Hide left sidebar and set content to full width

CSS
/* hide sidebar */
.ia-splitter-left {
    display: none !important;
}
#splitter-content {
    left: 0 !important;
    width: 100% !important;
}
body:not(.login) div#main {
    margin-left: 0 !important;
    max-width: none !important;
    width: 100% !important;
}
div#footer {
    margin-left: 0 !important;
}
 

FROM 5.10

Profile

Hide the "Activity" macro in a profile

CSS
/* hide "activity-stream" on profile page */
body.profile #profile-status-list {
  display: none;
}

Hide Confluence standard category "personal" in a profile 


CSS
/* hide "personal-stream" on profile page */
body.profile #cup-profile #confluence-data {
  display: none;
}

Indention of "text combinations" and "text choice" in "profile" when Comala Workflows (Comala Document Management) is installed.

CSS
.page-item.profile-main > form.aui .group {
	padding: 4px 0 4px 145px;
 }

Fixes missing profile edit button on profile page for CUP 2.0

CSS
/* CUP2.0 Profil-Button Fix */
body.profile #main #main-header { 
   display: block !important;
}

body.profile .pagetitle { 
   display: none;
}
 

FROM 5.10

Bugfixes for third party plugins

Show Comala Workflow (Comala Document Management) tabs (bug: will not be shown with sidebar on)

< Version 4.17.1 (with Comala Workflows (Comala Document Management) 4.17.1 this bug is fixed!)

JS
// Bugfix for missing Comala Workflow tabs when Linchpin Sidebar is activated
// Set class "active-pane" to first Comala workflow tab-pane
(function () {
var ComalaWorkflowHelper = function () {
/**
* slug helper
**/
var findGetParameter = function (parameterName) {
var result = null,
tmp = [];
location.search
.substr(1)
.split("&")
.forEach(function (item) {
tmp = item.split("=");
if (tmp[0] === parameterName) result = decodeURIComponent(tmp[1]);
});
return result;
}
this.currentTab = findGetParameter('tab');
this.tabAssignments = {
states: '#tabSTATES',
triggers: '#tabTRIGGERS',
markup: '#tabMARKUP'
}
this.repair = function () {
var param = findGetParameter('tab');
var paneSel = this.tabAssignments[param];
var $pane = $('.cw-designer__tabs ' + paneSel);
$pane.addClass('active-pane');
console.log($pane);
}
};
AJS.toInit(function () {
if ($('.cw-designer__tabs').length > 0) {
var helper = new ComalaWorkflowHelper();
helper.repair();
}
})
}())

Sharepoint Connector (1.9.8, changes quick search drastically)

CSS
#linchpin-header-inner #header #header-right-panel {
	width: 683px;
}

#linchpin-header-inner #header-right-panel #quick-search-sharepoint-option {
	margin-left: 20px;
}

#linchpin-header-inner #header #sharepoint-search-query {
    float: left;
    height: 35px;
    border: 1px solid #cccccc;
    border-radius: 3px;
    font-size: 18px;
    width: 278px;
    padding: 0;
    padding-left: 5px;
    padding-right: 37px;
  	background-color: white;
  	background-position: 260px 10px;
}

#linchpin-header-inner #header #quick-search .quick-nav-drop-down.aui-dd-parent {
margin-top: 26px;
}
#linchpin-header-inner #header #quick-search :-ms-input-placeholder {
	color: #000;
}

Fixed Linchpin Sidebar when using Content Formatting for Confluence Plugins (v5.1); 

This snippet protects aui classes of the Linchpin Sidebar from changes by "Content Formatting for Confluence" plugin.

JS
// protects aui classes in Linchpin Sidebar from beeing changed by "Content Formatting for Confluence" plugin.
(function() {
         AJS.toInit(function () { 
             new preventStylesFromModule('com.adaptavist.confluence.contentFormattingMacros:aui-tabs-resources', ['#sidebar-tabs', '#tabs-app-center', '#tabs-favorites']).run(); 
})

    var preventStylesFromModule = function (moduleKey, preserveSelectors) {
        var $badCss = $("link[href*='" + moduleKey + "']");
        var concatedPreserveSelector = ":not(" + preserveSelectors.join("):not(") + ")";

        var useSaveStyles = function () {
            var newStylesheet = "";
            var oldLength = document.styleSheets.length;
            for (i = 0; i < oldLength; i++) {
                var sheet = document.styleSheets[i];
                if (!sheet.href) {
                    continue;
                }
                if (sheet.href.indexOf(moduleKey) > -1) {
                    var oldLength2 = sheet.cssRules.length;
                    for (j = 0; j < oldLength2; j++) {
                        var rule = sheet.cssRules[j];
                        var newRule = nopeify(rule.cssText, rule.selectorText, concatedPreserveSelector);
                        newStylesheet += newRule;
                        $badCss.remove();
                    }
                    $("body").append("<style>/*Protected Styles from " + moduleKey + "*/" + newStylesheet + "</style>");
                }
            }
        };
        var nopeify = function (cssText, selectorText, preserveSelector) {
            var strippedCss = cssText.replace(selectorText, "");
            var selectors = selectorText.split(",");
            for (i = 0; i < selectors.length; i++) {
                selectors[i] = selectors[i] + preserveSelector;
            }
            return selectors.join(',') + strippedCss
        };
        return {
            run: function () {
                useSaveStyles();
            }
        }
    };
})();

Correction of gaps, concision and color in the Team Calendar plugin

CSS
/* Optical improvement of team calendar plugin running within Linchpin Theme Plugin*/ 
div.plugin-calendar .sub-calendar-panel .subcalendar-item .subcalendar-name .ellipsis_text {
  width: 100px!important;
}

div.plugin-calendar .sub-calendar-panel .subcalendar-dropdown-menu {
  right: 50px!important;
}

div#navigation.content-navigation.calendar-navigation-buttons {
  margin-right: 0px;
}
 
div.plugin-calendar .sub-calendar-panel .subcalendar-item .subcalendar-name.header-color {
    color: __globalLinkColor__!important;
}
 

FROM 5.10

Added footer links (for example for "Polls" plugin)

JS
/* insert a custom link in the second footer column */
(function(ajs) {
    var footerAppend = {
        init: function() {
            this.dom();
            this.render();
        },
        dom: function() {
            this.$list = $("#footer #footer-navigation-inner table td:nth(2) ul");
            this.$item = '<li><a id="polls-link" href="/polls/listpolls.action" class=" aui-nav-imagelink" title="View your polls"> <span>Polls</span> </a></li>';
        },
        render: function() {
            this.$list.append(this.$item);
        }
    };
    ajs.toInit(function() {
        footerAppend.init();
    })
})(AJS)
 

FROM 5.10

Include a Confluence page to a footer column

Assigns a Confluence page to a footer column (column 0-3).
Configurable at the marked place "this.assignments". The pages have to exist (no bug-fixing at this point).

JS
/* Page-Include for Footer
   configure with change of this.assignments
   you can do multiple assignments.
   in this example we assign the first footer column (colId: 0) the page with the Id 1015814. 
*/
(function(ajs, $, Confluence) {
    "use strict";
    var footerPageAssign = {
        config: function() {
                /**
                * CONFIGURE HERE!
                * colId (0-3)
                * pageId (valid pageId)
                */
            this.assignments = [
                {colId: 0, pageId: 1015814}
            ];
        },
        init: function() {
            this.config();
            this.vars();
            this.getPageContents();
        },
        vars: function() {
            this.baseUrl = Confluence.getBaseUrl();
            this.$footer = $("#com-atlassian-confluence #footer");
            this.$footerColumns = this.$footer.find("td");
            this.pageContents = {};
            this.pageParsedContents = {};
        },
        getPageContents: function() {
            var self = this;
            var promises = [];
            for (var i = 0; i < this.assignments.length; i++) {
                (function($, self, i) {
                    var pageID = self.assignments[i].pageId;
                    $.get(self.baseUrl + "/rest/prototype/1/content/" + pageID, function(data) {
                        var pageBody = $(data).find("body")[0].textContent;
                        var pageId = $(data).find("content")[0].getAttribute("id");
                        self.parsePageContents(pageBody, pageId, i);
                    })
                })($, this, i);
            }
        },
        parsePageContents: function(pageBody, pageId, callNo) {
            var self = this;
            $.ajax({
                url: self.baseUrl + '/rest/api/contentbody/convert/view',
                type: 'POST',
                data: JSON.stringify({
                    "value": pageBody,
                    "representation": "storage",
                    "content": {
                        "id": pageId
                    }
                }),
                dataType: 'json',
                contentType: "application/json; charset=utf-8",
                success: function(res) {
                    self.pageParsedContents[pageId] = res.value;
                    if (callNo == self.assignments.length-1) {
                        self.modifyColumns();
                    }
                },
                error: function(res) {
                    ajs.debug("Bad thing happend! " + res.statusText);
                }
            });
        },
        modifyColumns: function() {
            for (var i = 0; i < this.assignments.length; i++) {
                var colId = this.assignments[i].colId;
                var pageId = this.assignments[i].pageId;
                var $col  = this.$footerColumns.eq(colId);
                var html  = this.pageParsedContents[pageId];
                $col.html(html);
            }
        }
    };
    AJS.toInit(function(){
      footerPageAssign.init();  
    })
})(AJS, AJS.$, Confluence);
CSS
#footer #footer-navigation td {position: relative; }

 

FROM 5.10







☁️ Looking for a Cloud-based Intranet?

Check out Mantra, your go-to alternative to Linchpin in the Atlassian Cloud!

Mantra is your a comprehensive solution for connecting teams, making collaboration a breeze, and keeping your company's internal communication strong and streamlined - all in the cloud.

Test the intranet for Confluence Cloud now for free: 


Discover Mantra


This page was last edited on 11/13/2024.