Upgrade theme from 9.4 to 9.5

DLE Upgrade
Tutorial ID.	DLE-1099-24
Created	September 1, 2012
IS THIS TUTORIAL HELPFUL?
0 1 2 3 4 5

Since Datalife Engine 9.5 was released, there are some tags and styles are changed and we see many websites have posted the tutorials how to upgrade theme from 9.4 to 9.5 but we don't see any of them explain what exactly those tags are and what for, in this tutorial we will show you the tags you need to know and tell you what they are so that if you are not using Default theme you can modify and upgrade your theme easily...

Add files

Copy Files

Copy files [b]print.tpl[/b] and [b]static_print.tpl[/b] from folder [b]/templates/[/b] folder of your actual template folder ("[b]templates/your_theme[/b]"), for example [b]/templates/Default/[/b], [b]/templates/WStarter/[/b], in the older version the print page use share theme files

Files:

/templates/print.tpl  ==> For article print page
/templates/static_print.tpl  ==> For static print page

Now in 9.5, the print page will use individual theme print style, for example if you are using theme "WStarter", your print page will use the files

Files:

/templates/WStarter/print.tpl  ==> For article print page
/templates/WStarter/static_print.tpl  ==> For static print page

Open the file /style/engine.css and preview.css

Add the following code at the end:

/*--- Code tag highlight [ code ]---*/
pre code {
  display: block; padding: 0.5em;
  background: #f9fafa; 
  border: 1px solid #dce7e7;
  overflow:auto;
  white-space: pre;
}
pre .comment,
pre .template_comment,
pre .diff .header,
pre .doctype,
pre .lisp .string,
pre .javadoc {
  color: #93a1a1;
  font-style: italic;
}
pre .keyword,
pre .css .rule .keyword,
pre .winutils,
pre .javascript .title,
pre .method,
pre .addition,
pre .css .tag,
pre .lisp .title {
  color: #859900;
}
pre .number,
pre .command,
pre .string,
pre .tag .value,
pre .phpdoc,
pre .tex .formula,
pre .regexp,
pre .hexcolor {
  color: #2aa198;
}
pre .title,
pre .localvars,
pre .function .title,
pre .chunk,
pre .decorator,
pre .builtin,
pre .built_in,
pre .lisp .title,
pre .identifier,
pre .title .keymethods,
pre .id {
  color: #268bd2;
}
pre .tag .title,
pre .rules .property,
pre .django .tag .keyword {
  font-weight: bold;
}
pre .attribute,
pre .variable,
pre .instancevar,
pre .lisp .body,
pre .smalltalk .number,
pre .constant,
pre .class .title,
pre .parent,
pre .haskell .label {
  color: #b58900;
}
pre .preprocessor,
pre .pi,
pre .shebang,
pre .symbol,
pre .diff .change,
pre .special,
pre .keymethods,
pre .attr_selector,
pre .important,
pre .subst,
pre .cdata {
  color: #cb4b16;
}
pre .deletion {
  color: #dc322f;
}
pre .tex .formula {
  background: #eee8d5;
}

Different theme designs are different, some of theme use /style/engine.css, some use /styles/engine.css, some use /css/engine.css, some don't use engine.css file but use different name or file, but the point is to add this tag within the theme anywhere in css file

Open the {THEME}/.htaccess

The .htaccess file in your "[b]templates/your_theme[/b]" folder and replace all the code inside the file with the following contents:

htaccess

Order allow,deny
Deny from all
<FilesMatch ".(css)$|^$">
   Order deny,allow
   Allow from all
</FilesMatch>

For example if you are using theme "WStarter" then the file /templates/WStarter/.htaccess must contain the code above

Create a file [b

frame.css[/b]] Place it in "[b]templates/your_theme[/b]" folder with the following contents:

CSS Style Code

html,body{
    height:100%;
    margin:0px;
    padding: 0px;
    background: none;
}
hr {
    color: #999;
    border: 0px none;
    border-top: dashed 1px #999;
    height: 1px;
}
input,
select,
textarea {
    outline:none;
}
form {
    margin:0px;
    padding: 0px;
}
table{
    border:0px;
}
table td{
    padding:0px;
    font-size: 11px;
    font-family: verdana;
}
a:active,
a:visited,
a:link {
    color: #4b719e;
    text-decoration:none;
    }
a:hover {
    color: #4b719e;
    text-decoration: underline;
    }
.navigation {
    color: #999898;
    font-size: 11px;
    font-family: tahoma;
}
.edit {
    border:1px solid #9E9E9E;
    color: #000000;
    font-size: 11px;
    font-family: Verdana; BACKGROUND-COLOR: #ffffff 
}
select {
    color: #000000;
    font-size: 11px;
    font-family: Verdana; 
    border:1px solid #9E9E9E;
}
textarea {
    border: #9E9E9E 1px solid;
    color: #000000;
    font-size: 11px;
    font-family: Verdana; 
    background-color: #ffffff 
}
#hintbox{ /*CSS for pop up hint box */
    position:absolute;
    top: 0;
    background-color: lightyellow;
    width: 150px; /*Default width of hint.*/ 
    padding: 3px;
    border:1px solid #787878;
    font:normal 11px Verdana;
    line-height:18px;
    z-index:100;
    border-right: 2px solid #787878;
    border-bottom: 2px solid #787878;
    visibility: hidden;
}
.hintanchor{ 
    padding-left: 8px;
}
.xprofile textarea {
    width: 100%; height:90px; font-family:verdana; font-size:11px; border:1px solid #9E9E9E;
}
.xprofile input {
    width:250px; height:18px; font-family:verdana; font-size:11px; border:1px solid #9E9E9E;
}
.bk {
    background:#fff url(images/fields.png) repeat-x;
}

Open profile_popup.tpl

Find

{news_num}

Replace with

{news_num}

Find

{comm_num}

Replace with

{comm-num}

Open addnews.tpl

Add the following code on the beginning of the file:

<link rel="stylesheet" type="text/css" href="engine/skins/chosen/chosen.css"/>
<script type="text/javascript" src="engine/skins/chosen/chosen.js"></script>
<script type="text/javascript">
$(function(){
	$('#category').chosen({allow_single_deselect:true, no_results_text: 'No category found or not selected'});
});
</script>

Open userinfo.tpl

Find:

{news_num}

Replace with:

{news-num}

Find:

{comm_num}

Replace with:

{comm-num}

Additional Tags for DLE 9.5 in user profile:

There are a few tags added in 9.5 but we don't seem to find the information anywhere, even the themes come with the DLE 9.5 package don't even add these tags in the themes so this information you can only find in DLEStarter.com!...

The following tags are applied to template files [b]userinfo.tpl[/b] and [b]comments.tpl[/b]

[b][fullname][/b]xxx[b][/fullname][/b] is used for open and close tag if full name field [b]{fullname}[/b] was input, for example, in templates/Default/userinfo.tpl, find:
Find:
```
<li>Full name: {fullname}</li>
```
Replace with:
```
[fullname]<li>Full name: {fullname}</li>[/fullname]
```
If the user input the information in Full name filed then it will show, if not then nothing will show, this tag is intended for remove empty fields in user profile and comments
[b][icq][/b]xxx[b][/icq][/b] is used for open and close tag if icq field [b]{icq}[/b] was input, for example, in templates/Default/userinfo.tpl,
Find:
```
<li>ICQ: {icq}</li>
```
Replace with:
```
[icq]<li>ICQ: {icq}</li>[/icq]
```
If the user input the information in icq filed then it will show, if not then nothing will show, this tag is intended for remove empty fields in user profile and comments
[b][land][/b]xxx[b][/land][/b] is used for open and close tag if location field [b]{land}[/b] was input, for example, in templates/Default/userinfo.tpl,
Find:
```
<li>Location: {land}</li>
```
Replace with:
```
[land]<li>Location: {land}</li>[/land]
```
If the user input the information in location filed then it will show, if not then nothing will show, this tag is intended for remove empty fields in user profile and comments
[b][info][/b]xxx[b][/info][/b] is used for open and close tag if short information field [b]{info}[/b] was input, for example, in templates/Default/userinfo.tpl,
Find:
```
<li>Information: {info}</li>
```
Replace with:
```
[info]<li>Information: {info}</li>[/info]
```
If the user input the information in short information filed then it will show, if not then nothing will show, this tag is intended for remove empty fields in user profile and comments
[b][signature][/b]xxx[b][/signature][/b] is used for open and close tag if signature field [b]{signature}[/b] was filled,
For example:
```
[signature]<hr /> {signature}[/signature]
```
If the user filled the information in signature filed then it will show, if not then nothing will show, this tag is intended for remove empty fields in user profile and comments
[b][news-num][/b]xxx[b][/news-num][/b] is used for open and close tag if the user have posted article in your website,
For example:
```
[news-num]<li style="margin-top:10px;">Posts: {news-num} {news} 
[rss]<img alt="" src="{THEME}/images/ico/ico_rss.png" border="0" style="vertical-align:middle; margin-bottom: 3px;" title="Feed - Bookmark Posts" />[/rss]</li>[/news-num]
```
If the user had posted at least 1 article in your website then it will show, if not then nothing will show, this tag is intended for remove empty fields in user profile and comments
[b][comm-num][/b]xxx[b][/comm-num][/b] is used for open and close tag if the user have posted comment in your website,
For example:
```
[comm-num]<li style="margin-top:10px;">Comments: {comm-num} {comments}</li>[/comm-num]
```
If the user had posted at least 1 comment in your website then it will show, if not then nothing will show, this tag is intended for remove empty fields in user profile and comments

[b]Reference User Manual[/b]:
- http://dle-news.ru/extras/diffs/95/

Files:

Files:

Add the following code at the end:

htaccess

CSS Style Code

Find

Replace with

Find

Replace with

Add the following code on the beginning of the file:

Find:

Replace with:

Find:

Replace with:

Additional Tags for DLE 9.5 in user profile:

Find:

Replace with:

Find:

Replace with:

Find:

Replace with:

Find:

Replace with:

For example:

For example:

For example: