Hướng dẫn nâng cấp giao diện từ DLE 9.5 lên DLE 9.6

Sao chép tập tin hình ảnh /templates/Default/bbcodes/typograf.gif vào thư mục giao diện hiện tại của bạn.
Sao chép các tập tin hình ảnh button.png, loading.gif, offline.png, online.png, shadow.png, tableft.gif, tabright.gif từ thư mục giao diện mặc định /templates/Default/images/ vào thư mục giao diện của bạn.

Mở tập tin style/engine.css và ở dưới cùng thêm:

/*---прогресс бар заполненности персональных сообщений---*/
.pm_progress_bar {
	border: 1px solid #d8d8d8;
	padding: 1px;
	margin-top: 10px;
	margin-bottom: 10px;
}

.pm_progress_bar span {
	background: #000000;
	font-size: 0em;
	text-indent: -2000em;
	height: 10px;
	display: block;
	overflow: hidden;
}

Mở tập tin style/styles.css và ở dưới cùng thêm:

.pm_status {
	float:left;
	border: 1px solid #d8d8d8;
	padding: 0px;
	background-color: #fff;
	width: 280px;
	height: 100px;
	margin-left: 20px;
	margin-right: 5px;
}

.pm_status_head {
	border-bottom: 1px solid #d8d8d8;
	font-size: 0.9em; 
	background: #fff url("../images/bbcodes.png") repeat-x 0 100%;
	height: 22px;
	padding: 0;
	font-weight: bold;
	text-align: center;
	color: #4e4e4e;
}

.pm_status_content {
	padding: 5px;
}

Mở tập tin frame.css và tìm:

html,body{
	height:100%;
	margin:0px;
	padding: 0px;
	background: none;
}

Thay thế thành

html,body{
	font-size: 11px;
	font-family: verdana;
	height:100%;
	margin:0px;
	padding: 0px;
	background: none;
}

img {
	border:0px;
}

/*--- горизонтальное меню в окне загрузки файлов ---*/
.tabs {
	font: bold 11px/1.5em Verdana;
	float:left;
	width:100%;
	background:change-background;
	line-height:normal;
}
.tabs ul {
	margin:0;
	padding:10px 10px 0 5px;
	list-style:none;
}
.tabs li {
	display:inline;
	margin:0;
	padding:0;
}
.tabs a {
	float:left;
	background:url("images/tableft.gif") no-repeat left top;
	margin:0;
	padding:0 0 0 7px;
	text-decoration:none;
}
.tabs a span {
	float:left;
	display:block;
	background:url("images/tabright.gif") no-repeat right top;
	padding:5px 15px 4px 6px;
	color:#6B78A9;
}

.tabs a span {float:none;}

.tabs a:hover span,
.tabs a.current span {
	color:#6B78A9;
}
.tabs a:hover,
.tabs a.current {
	background-position:0% -42px;
}

.tabs a:hover span,
.tabs a.current span {
	background-position:100% -42px;
}

/*--- блок загрузки файлов и загруженных файлов ---*/

.box {
	height: 300px;
	border:1px solid #B3B3B3;
	-moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;
	background:#fff url(images/shadow.png) repeat-x;
	overflow: auto;
}

.uploadedfile {
	width: 115px;
	height: 130px;
	margin: 10px 5px 5px 5px;
	border:1px solid #B3B3B3;
	box-shadow: 0px 1px 4px rgba(0,0,0,0.3);
	-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
	float: left;
	text-align: center;
	background:#ffffff;

}

.uploadimage {
	margin-top: 5px;
	width: 115px;
	height: 90px;
	display: table-cell;
	text-align: center;
	vertical-align:middle;
}

.info {
	text-align: left;
	white-space: nowrap;
	margin: 0px 5px 0px 5px;
	overflow: hidden;
}

.button {
    padding:4px 10px 4px 10px;
    margin-left:2px;
    margin-top:5px;
    font: bold 11px/1.5em Verdana;color:#000000;
    background:#F9F9F9 url('images/button.png') repeat-x;
	border:1px solid #CACACA;
	cursor:pointer;
}

.properties {

	float: left;
    margin-top:8px;
}

.linkbox {
    margin-top:5px;
    padding:10px;
	border:1px solid #B3B3B3;
	-moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;
	background:#fff url(images/shadow.png) repeat-x;
}

#file-uploader {
	min-height: 50px;
}

#flash-uploader {
	min-height: 50px;
}

#stmode {
	padding:10px;
}

.file-box {
	width: 95%;
	border:1px solid #B3B3B3;
	-moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;
	background-color: #F5F5F5;
	padding: 10px;
	margin-top: 10px;
}

/*--- HTML5 загрузчик файлов ---*/

.qq-uploader { position:relative; width: 100%;}

.qq-upload-button {
    display:block; /* or inline-block */
    width: 310px; 
    padding:4px 10px 4px 10px;
    margin-left:2px;
    margin-top:5px;
    font: bold 11px/1.5em Verdana;color:#000000;
    background:#F9F9F9 url('images/button.png') repeat-x;
	border:1px solid #CACACA;
	cursor:pointer;
}
.qq-upload-button-hover {outline:1px dotted black;}
.qq-upload-button-focus {outline:1px dotted black;}

.qq-upload-drop-area {
    position:absolute; top:0; left:0; width:100%; height:100%; min-height: 50px; z-index:2;
    background:#FF9797; text-align:center; 
}
.qq-upload-drop-area span {
    display:block; position:absolute; top: 50%; width:100%; margin-top:-8px; font-size:16px;
}
.qq-upload-drop-area-active {background:#FF7171;}

.qq-upload-list {margin:0; padding:0; list-style:disc;}
.qq-upload-list li { margin:0; padding:2px;}
.qq-upload-file, .qq-upload-spinner, .qq-upload-size, .qq-upload-cancel, .qq-upload-failed-text {
    margin-right: 7px;
}

.qq-upload-file {}
.qq-upload-spinner {display:inline-block; background: url("images/loading.gif"); width:15px; height:15px; vertical-align:text-bottom;}
.qq-upload-size,.qq-upload-cancel {font-size:11px;}

.qq-upload-failed-text {display:none;}
.qq-upload-fail .qq-upload-failed-text {display:inline;}


/*--- флеш загрузчик файлов ---*/

.progressWrapper {
	width: 99%;
	overflow: hidden;
}

.progressContainer {
	margin: 5px;
	padding: 4px;
	border: solid 1px #B3B3B3;
	background-color: #F5F5F5;
	overflow: hidden;
}
/* Message */
.message {
	margin: 1em 0;
	padding: 10px 20px;
	border: solid 1px #FFDD99;
	background-color: #FFFFCC;
	overflow: hidden;
}
/* Error */
.red {
	border: solid 1px #B50000;
	background-color: #FFEBEB;
}

/* Current */
.green {
	border: solid 1px #B3B3B3;
	background-color: #F5F5F5;
}

/* Complete */
.blue {
	border: solid 1px #B3B3B3;
	background-color: #F5F5F5;
}

.progressName {
	font-size: 8pt;
	font-weight: 700;
	color: #555;
	width: 323px;
	height: 14px;
	text-align: left;
	white-space: nowrap;
	overflow: hidden;
}

.progressBarInProgress,
.progressBarComplete,
.progressBarError {
	font-size: 0;
	width: 0%;
	height: 2px;
	background-color: blue;
	margin-top: 2px;
}

.progressBarComplete {
	width: 100%;
	background-color: green;
	visibility: hidden;
}

.progressBarError {
	width: 100%;
	background-color: red;
	visibility: hidden;
}

.progressBarStatus {
	margin-top: 2px;
	width: 99%;
	font-size: 7pt;
	font-family: Arial;
	text-align: left;
	white-space: nowrap;
}

a.progressCancel {
	font-size: 0;
	display: block;
	height: 14px;
	width: 14px;
	background-image: url(../../engine/classes/uploads/swfupload/cancelbutton.gif);
	background-repeat: no-repeat;
	background-position: -14px 0px;
	float: right;
}

a.progressCancel:hover {
	background-position: 0px 0px;
}

Mở tập tin comments.tpl và tìm:

			<li>Регистрация: {registration}</li>

Bên dưới thêm:

			<li>Статус: [online]<img src="/templates/Default/images/online.png" style="vertical-align: middle;" title="Пользователь Онлайн" alt="Пользователь Онлайн" />[/online][offline]<img src="/templates/Default/images/offline.png" style="vertical-align: middle;" title="Пользователь offline" alt="Пользователь offline" />[/offline]</li>

Mở tập tin fullstory.tpl và tìm:

			<div class="ratebox"><div class="rate">{rating}</div></div>

Thay thế thành

			[rating]<div class="ratebox"><div class="rate">{rating}</div></div>[/rating]

Mở tập tin pm.tpl và tìm:

<div class="dpad">[inbox]Входящие сообщения[/inbox] | [outbox]Отправленные сообщения[/outbox] | [new_pm]Отправить сообщение[/new_pm]</div>

Thay thế thành:

<div class="dpad">
<div class="pm_status">
	<div class="pm_status_head">Состояние папок</div>
	<div class="pm_status_content">Папки персональных сообщений заполнены на:
{pm-progress-bar}
{proc-pm-limit}% от лимита ({pm-limit} сообщений)
	</div>
</div>
<div style="padding-top:10px;">[inbox]Входящие сообщения[/inbox]<br /><br />
[outbox]Отправленные сообщения[/outbox]<br /><br />
[new_pm]Отправить сообщение[/new_pm]</div>
</div><br />
<div class="clr"></div>

Mở tập tin profile_popup.tpl và tìm:

				<li><span class="grey">Дата посещения:</span> <b>{lastdate}</b></li>

Thay thế thành

				<li><span class="grey">Дата посещения:</span> <b>{lastdate}</b>, <span class="grey">cтатус:</span> [online]<img src="/templates/Default/images/online.png" style="vertical-align: middle;" title="Пользователь Онлайн" alt="Пользователь Онлайн" />[/online][offline]<img src="/templates/Default/images/offline.png" style="vertical-align: middle;" title="Пользователь offline" alt="Пользователь offline" />[/offline]</li>

Mở tập tin shortstory.tpl và tìm

			<div class="ratebox"><div class="rate">{rating}</div></div>

Thay thế thành

			[rating]<div class="ratebox"><div class="rate">{rating}</div></div>[/rating]

Mở tập tin userinfo.tpl và tìm

				<li><span class="grey">Последнее посещение:</span> <b>{lastdate}</b></li>

Bên dưới thêm

				<li><span class="grey">Статус:</span> [online]<img src="/templates/Default/images/online.png" style="vertical-align: middle;" title="Пользователь Онлайн" alt="Пользователь Онлайн" />[/online][offline]<img src="/templates/Default/images/offline.png" style="vertical-align: middle;" title="Пользователь offline" alt="Пользователь offline" />[/offline]</li>

FAQ

admin from 22-10-2023, 20:03

Hướng dẫn nâng cấp giao diện từ DLE 9.5 lên DLE 9.6

Related News

Add comment