Elegant 6

Customizing Elegant 6 using just CSS

NOTE: Switch your site to test mode to see all changes immediately

Q: If I have multiple portal sites is there an easy way for me to brand them the same?

A: You can export a site and then import it as many times as you like. This will create exact copies of the site in your current or any other E6 application

Q: Is there an option to highlight added files to basket?

A: Yes, you can add custom CSS script like this:

napc-basket-badge-title {
background-color: red;
border-radius: 6px;
padding: 2px 3px;
color: #fff;
text-shadow: none;
}

---

Q: How can I remove some of the stamps in E6.

A: You need to add custom CSS like this:

/* to remove particular Stamps option, remove line to show option */
#napc-stamp-collection [value="Approved"],
#napc-stamp-collection [value="Confidential"],
#napc-stamp-collection [value="Departmental"],
#napc-stamp-collection [value="Draft"],
#napc-stamp-collection [value="Experimental"],
#napc-stamp-collection [value="Expired"],
#napc-stamp-collection [value="Final"],
#napc-stamp-collection [value="ForComment"],
#napc-stamp-collection [value="ForPublicRelease"],
#napc-stamp-collection [value="NotApproved"],
#napc-stamp-collection [value="NotForPublicRelease"],
#napc-stamp-collection [value="Sold"],
#napc-stamp-collection [value="TopSecret"]
{
display: none;
}
/* to remove Stamps dropdown */
#napc-stamp-collection {
display: none;
}

Q: How to make 3 lines in folder name in short view?

A: You need to add custom CSS like this:

.napc-folder-short {
margin-bottom: 45px;
}
.napc-folder-name-short {
word-break: break-all;
height: 37px;
line-height: 12px;
font-size: 12px;
white-space: initial;
}

Q: How to hide browse tree folder badges (files/folders count, works with WN v18.1.2 and up) ?

A: You need to add custom CSS like this:

.napc-tree-folders-badge, .napc-tree-files-badge {
display: none;
}

---

Q: How to replace site logo using CSS:

A: You need to:

1. Upload logo image to ~elegant6/css folder, usually it is located here /var/www/html/elegant6/css

2. Place this CSS to your site Custom CSS box:

/* Replace brand logo */
.brand img, .napc-action-login .masthead-brand img {
display: none;
}
.brand {
background: url('../css/logo.png') no-repeat center;
background-size: contain;
min-height: 35px;
max-height: 35px;
}
.napc-action-login .masthead-brand {
background: url('../css/aldi_logo.png') no-repeat center;
background-size: contain;
min-height: 100px;
max-height: 100px;
}
/* where is logo.png is your logo image */

3. Apply it and you are done

Q: How to change default sort field and sort order in E6?

A: put this in your Custom JS box per site basis:

This line is for default sort field, ‘mdate’ is for Modified Date, ‘filename’ is for Filename, ‘filesize’ is for File size

setCookie('napc-sortfield', 'mdate’);

This line is for default order direction, -1 desc, 1 asc

 
setCookie('napc-sortorder', 1); 

Q: How to reset E6 connection settings

Assume your E6 is installed in /var/www/html/elegant6

You need to run the following console commands:

rm /var/www/html/elegant6/protected/config/settings/connection_settings.json

rm /var/www/html/elegant6/protected/config/sub_configs/compiled_credentials.php