Reordering Full Record Display Sections

The order of tabs/sections on the full details page can be controlled from the Views – Tiles -- Brief Display -- Brief Results tile.  It is here, in the order of tabs section that you can re-order the different sections that appear within the full detail display. 

In this case, Getit Link 1 (View it) appears above the Getit Link 2 area.  This can be re-ordered and deployed to see the change in the front end.  This is not dynamic though, and will not change if multiple formats exist.  

 In addition to being able to adjust the order in the back office, it can also be done via CSS. For example, you could use something along the lines of this to re-order your page using CSS:



#getit_link1_0 { order: 0; }
#getit_link2_0 { order: 1; }

#action_list{ order: 2; }
#details { order: 3; }
#links { order: 4; }
#virtualBrowse { order: 5; }

.full-view-inner-container {
    padding-bottom: 10em;
    display: flex;
    flex-direction: column;
}

[aria-label="Online Access"] { order: 0 !important; }
[aria-label="In the library"] { order: 1 !important; }
[aria-label="Send to"] { order: 2 !important; }
[aria-label="Details"] { order: 3 !important; }
[aria-label="Links"] { order: 4 !important; }
[aria-label="Virtual Browse"] { order: 5 !important; }

The added bonus of using CSS to do this is you can also re-order the Links section, separate from the Details section. 


Posted on Apr 24Screen Shot 2017-04-24 at 8.55.41 PM.png

Label...