Hướng Dẫn Chỉnh Sửa Giao Diện Dspace – P5

[Dspace Tuts – chỉnh sửa cách hiển thị bộ sưu tập trang chủ ]

Bài viết này sẽ hướng dẫn thay đổi cách hiển bộ sưu tập trang chủ, để hiển thị gọn gàng hơn cho trang chủ Dspace thì có thể tắt feed, submissions, carousel mặc định của Dspace (hầu như không thấy ai dùng và cách hiển thị của nó khá chuối !), có nhiều cách để vô hiệu hóa chức năng này như : tắt trong dspace.config,  đặt code cần ẩn trong thẻ  <!– –> hoặc có thể xóa luôn đoạn code này (không khuyến khích và backup source code trước khi xóa).

* Mở home.jsp (đường dẫn C:\dspace\webapps\jspui), tìm đoạn code dưới đây và đặt nó trong thẻ <!–// hidden –> để ẩn vị trí này:

<!–// hidden

<%

if (submissions != null && submissions.count() > 0)

{

%>

<%

}

%>

–>

TIẾP THEO LÀ ĐỊNH DẠNG LẠI CÁCH HIỂN THỊ BỘ SƯU TẬP CHO TRANG CHỦ NHƯ SAU

* Mở home.jsp (đường dẫn C:\dspace\webapps\jspui), đoạn code  hiển thị bộ sưu tập của dspace như sau:

<%

if (communities != null && communities.length != 0)

{

%>

// code hien thị bo suu tap

<%

}

%>

Bây giờ có thể sửa lai như sau

<div class=”row communities-home”>

<%

if (communities != null && communities.length != 0)

{

%>

<div class=”panel panel-primary”>

<div class=”panel-heading”><span class=”glyphicon glyphicon-th-large”></span><fmt:message key=”jsp.home.com1″/></div>

<div class=”panel-body”>

<p><fmt:message key=”jsp.home.com2″/></p>

<div class=”list-group-home”>

<%

boolean showLogos = ConfigurationManager.getBooleanProperty(“jspui.home-page.logos”, true);

for (int i = 0; i < communities.length; i++)

{

%><div class=”list-collection”>

<%

Bitstream logo = communities[i].getLogo();

if (showLogos && logo != null) { %>

<div class=”col-md-3″>

<img alt=”Logo” class=”img-responsive” src=”<%= request.getContextPath() %>/retrieve/<%= logo.getID() %>” />

</div>

<div class=”col-md-12″>

<% } else { %>

<div class=”col-md-3″>

<% } %>

<h4 class=”list-group-item-heading-home”><span class=”glyphicon glyphicon-folder-open”></span>&nbsp;&nbsp;<a href=”<%= request.getContextPath() %>/handle/<%= communities[i].getHandle() %>”><%= communities[i].getMetadata(“name”) %></a>

<%

if (ConfigurationManager.getBooleanProperty(“webui.strengths.show”))

{

%>

<span class=”badge pull-custom”><%= ic.getCount(communities[i]) %></span>

<%

}

%>

</h4>

<p><!–//hidden  <%= communities[i].getMetadata(“short_description”) %> –>

</p>

</div>

</div>

<%

}

%>

</div>

</div>

</div>

</div>

<%

}

%>

</div>

* Mở tiếp file dspace-theme.css thêm đoạn code css để định dạng cho vị trí này:

.panel-primary {

border-color: #e9e9e9 ;

border-radius: 0px;

}

.panel-primary > .panel-heading{

background-image:none;

background-color: #3c6478;

border-radius:0px;

}

.panel-primary > .panel-heading {

color: #fff;

border-color: transparent;

}

.communities-home{

padding-top:15px;

}

.badge.pull-custom{ margin-left:5px;}

.glyphicon{padding-right:5px;}

h4.list-group-item-heading-home {

font-size:14px;

font-weight:600;

text-transform:uppercase;}

span.glyphicon.glyphicon-folder-open{color:#E2C17A; font-size:14px;}

* Mở file dspace.config (đường dẫn C:\dspace\config), tìm và sửa lại đoạn code dưới đây để hiển thị số lượng tài liệu trong mỗi bộ sưu tập (nếu như đã thực hiện thì có thể bỏ qua).

webui.strengths.show = false sửa lại thành  webui.strengths.show = true 

* Khởi động lại dịch vụ của Apache tomcat để thay đổi có hiệu lực.

Giải thích

Có nhiều  cách để chỉnh sửa cho vị trí này nhằm bắt mắt hơn, phụ thuộc vào cách tùy biến của mỗi người, không nhất thiết phải giống như trên. Theo phần hướng dẫn trên thì  short_description sẽ được ẩn đi,   vị trí này sẽ chia làm 4 cột, chèn thêm biểu tượng icon, hiển thị số lượng bài viết của mỗi bộ sưu tập trong thẻ css badge và ghi đè css mặc định của bootsrap . 

Previous Post Next Post