DleHub

Tema Değişiklik Günlüğü

Sürüm geçişlerinde yapmanız gereken tüm şablon ve CSS değişiklikleri.

v18.1'den v19.0'a

1. Temanızın CSS dosyasına aşağıdaki kodları ekleyin:

.clipboard-copy-link svg {
    color: #6c838e;
    vertical-align: middle;
    margin-top: -3px;
}

2. Eğer addnews.tpl (haber ekleme), userinfo.tpl (profil) veya registration.tpl dosyalarında {xfields} etiketi kullanılıyorsa, bu etiketin çıktısı artık tablo yapısı kullanmadığı için CSS stillerini yeni yapıya göre düzenleyin.

v18.0'dan v18.1'e

1. CSS dosyanıza ekleyin:

.quote_link {
    float: right;
}
.quote_link svg {
    color: #6c838e;
    vertical-align: middle;
}

2. templates/rss.tpl dosyasını açın ve aşağıdaki bölümü tamamen silin:

[turbo]...[/turbo]

(Bu etiketlerin arasındaki her şey dahil silinmelidir.)

v17.3'ten v18.0'a

1. CSS dosyanıza ekleyin (PM Sistemi Stilleri):

.pm th{
    text-align: left; font-weight: 500; white-space: nowrap;
}
.pm th.pm_checkbox { text-align: center; }
.pm_list.pm_subj, .pm_list.pm_icon, .pm_list.pm_last_user { cursor: pointer; }
.pm_list.pm_icon svg { width: 1.4rem; height: 1.4rem; vertical-align: middle; }
.pm_list.pm_icon.pm-unread-image { color: #3394e6; }
.pm td.pm_list.pm_icon, .userstop td, th.pm_head.pm_icon { border-bottom: none; }
.pm_list.pm_icon.pm-reply-image { color: #087e02c4; }
.pm_list.pm_icon.pm-read-image { color: #afafaf; }
.pm_list .pm_last_message, .pm_list .pm_last_date, .pm_list .pm_with_user { color: #64748b; font-size: .8rem; }
.pm tbody > tr:hover { background-color: #e2e8f099; }
.pm_navigation { margin-top: 1rem; }
.pm_navigation .navigation { display: inline-block; color: #333333; background-color: #f5f5f5; border-radius: 0.188rem; padding: .4rem; }
.pm_navigation .navigation a, .pm_navigation .navigation span { padding: 0.5rem; min-width: 2.25rem; }
.pm_navigation .navigation span { background-color: #4581d0; color: #fff; }
.pm_navigation .navigation a { text-decoration: none; color: #000; }
.pm_navigation .navigation a:hover { background-color: #e2e8f0; }

2. pm.tpl şablonunu yeni özel mesaj sistemine uyarlayın. Artık mesajlar [readpm]...[/readpm] bloğu içinde [messages]...[/messages] etiketi ile listeleniyor.

Örnek pm.tpl yapısı:

<article class="box story">
    <div class="box_in">
        <h1 class="title h1">Özel Mesajlar</h1>
        <div class="pm-box">
            <nav id="pm-menu">
                [inbox]<span>Gelen Kutusu</span>[/inbox]
                [new_pm]<span>Yeni Mesaj</span>[/new_pm]
            </nav>
            <div class="pm_status">
                {pm-progress-bar}
                {proc-pm-limit} % / ({pm-limit} mesaj)
            </div>
        </div>

[pmlist]
<div class="pmlist">{pmlist}</div>
[/pmlist]

[newpm]
<h4 class="heading">Yeni Mesaj</h4>
<div class="addform addpm">
    <ul class="ui-form">
        <li class="form-group combo">
            <div class="combo_field"><input placeholder="Alıcı" type="text" name="name" value="{author}" class="wide" required></div>
            <div class="combo_field"><input placeholder="Konu" type="text" name="subj" value="{subj}" class="wide" required></div>
        </li>
        <li id="comment-editor">{editor}</li> 
        [recaptcha]<li>{recaptcha}</li>[/recaptcha]
    </ul>
    <div class="form_submit">
        <button class="btn btn-big" type="submit" name="add"><b>Gönder</b></button>
        <button class="btn-border btn-big" type="button" onclick="dlePMPreview()">Önizle</button>
    </div>
</div>
[/newpm]

[readpm]
<div class="comments">
    <div class="box">
        <h4 class="heading">{subj}</h4>
        <div class="com_list">
            [messages]
            <div class="comment">
                <div class="com_info">
                    <b class="name">{author}</b>
                    <span class="grey">14-12-2025, 23:20</span>
                </div>
                <div class="com_content">
                    <div class="text">{text}</div>
                </div>
            </div>
            [/messages]
        </div>
        <div class="box_in form-sep">
            <h3>Cevap Yaz</h3>
            {editor}
            <br><button class="btn btn-big" type="submit" name="submit"><b>Cevapla</b></button>
        </div>
    </div>
</div>
[/readpm]
    </div>
</article>

3. addnews.tpl dosyasından BBCODES editörü etiketlerini kaldırın ve yerine görsel editör etiketlerini ekleyin.

v17.2'den v17.3'e

1. CSS dosyanıza ekleyin (Silme Butonları ve Formlar):

.ui-dialog-buttonset button.ui-button-delete {
    background-color: #f44336; border-color: #f44336; color: #fff;
    text-shadow: 1px 1px 2px rgba(51, 51, 51, .5);
}
.ui-dialog-buttonset button.ui-button-delete:hover {
    background-color: #db3a2f; border-color: #db3a2f; color: #fff;
    text-shadow: 1px 1px 2px rgba(51, 51, 51, .5);
}
.form-check-label { cursor: pointer; }
.form-check-input {
    color: #0c5f7eed; flex-shrink: 0; width: 1.12rem; height: 1.12rem;
    margin: -0.188rem 0.625rem 0 0; appearance: none;
    background-color: transparent; border: 1px solid #0c5f7eed;
    vertical-align: middle;
}
.form-check-input:checked[type=checkbox] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%230c5f7eed' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}
.form-check-input:checked[type=radio] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%230c5f7eed'/%3e%3c/svg%3e");
}
.form-check-input[type=checkbox] { border-radius: .25rem; }
.form-check-input[type=radio] { border-radius: 50%; }
v17.0'dan v17.1'e

1. CSS dosyanıza ekleyin (Push Bildirimleri):

.DLEPush {
    z-index: 2001; position: fixed; right: 20px; top: 20px
}
@keyframes DLEPush-show {
    0% { transform: translateY(100%); opacity: 0; }
    100% { transform: translateY(0); opacity: 1; }
}
.DLEPush-notification.wrapper {
    animation-name: DLEPush-show; animation-duration: 1s; position: relative;
    display: grid; grid-template-columns: auto 1fr; align-items: center;
    color: #333; margin-bottom: 10px; width: 100%; max-width: 400px;
    box-shadow: 0 10px 15px rgb(0 0 0 / 20%); background-color: #fff;
    border-radius: 10px
}
.DLEPush-notification .DLEPush-icon {
    grid-column: 1; grid-row: 1 / span 2; display: flex;
    align-items: center; justify-content: center; color: #fff;
    width: 45px; height: 100%; border-top-left-radius: 10px;
    border-bottom-left-radius: 10px; text-align: center;
}
.DLEPush-notification .DLEPush-icon svg { scale: .8; }
.DLEPush-notification .DLEPush-header {
    font-weight: 500; grid-column: 2; grid-row: 1; font-size: 1rem;
    margin-left: 1rem; margin-top: .5rem;
}
.DLEPush-notification .DLEPush-message {
    grid-column: 2; grid-row: 2; font-size: .875rem; margin: 1rem;
}
.DLEPush-notification .DLEPush-close {
    position: absolute; top: 8px; right: 10px; background: none; border: 0; cursor: pointer;
}
.DLEPush-notification.wrapper.push-success { background-color: #e0f2f1; }
.DLEPush-notification.wrapper.push-success .DLEPush-icon { background-color: #00897b; }
.DLEPush-notification.wrapper.push-warning { background-color: #FFF3E0; }
.DLEPush-notification.wrapper.push-warning .DLEPush-icon { background-color: #FF9800; }
.DLEPush-notification.wrapper.push-error { background-color: #FBE9E7; }
.DLEPush-notification.wrapper.push-error .DLEPush-icon { background-color: #FF5722; }

input[type="text"].comments_author_field { width: 100%; margin-bottom: 10px; }
v16.1'den v17.0'a

1. CSS dosyanıza ekleyin:

.mce-accordion summary { cursor: pointer; }
.self_delete_link {
    border: 0 none; display: inline-block; vertical-align: middle;
    cursor: pointer; padding: 12px 27px; border-radius: 10px;
    background-color: #f44336; color: #fff;
}

2. userinfo.tpl dosyasını açın ve profil düzenleme bölümünde uygun bir yere şu etiketi ekleyin:

[delete]Hesabı Sil[/delete]
v16.0'dan v16.1'e

1. CSS ekleyin:

.title_spoiler svg{
    vertical-align: middle; margin-top: -4px;
    margin-right: 7px; height: 16px; width: 16px;
}

2. Temanızda fastsearchresult.tpl adında bir dosya oluşturun ve içine şunu ekleyin:

<a href="https://dlehub.com.tr/changelog.html">
    <span class="searchheading">{title}</span>
    <span>{short-story limit="150"}</span>
</a>

3. userinfo.tpl içinde {twofactor-auth} etiketini kontrol edin.

v15.3'ten v16.0'a

1. CSS ekleyin:

.image-bordered { border: 1px solid #ddd; }
.image-shadows {
    box-shadow: rgb(9 30 66 / 25%) 0px 4px 8px -2px, rgb(9 30 66 / 8%) 0px 0px 0px 1px;
}
.image-padded { padding: 0.5rem; }
.comments-user-profile { font-weight: bold; cursor: pointer; color: #3394e6; }

2. addnews.tpl dosyasında "Haber Ekle" yazısını {header-title} ile değiştirin.

3. templates/rss.tpl dosyasının içeriğini tamamen şununla değiştirin:

[rss]<item>
<title>{title}</title>
<guid isPermaLink="true">{rsslink}</guid>
<link>{rsslink}</link>
<dc:creator>{rssauthor}</dc:creator>
<pubDate>{rssdate}</pubDate>
<category>{category}</category>
<description><![CDATA[{short-story}]]></description>
</item>[/rss]

[turbo]<item turbo="true">
<turbo:extendedHtml>true</turbo:extendedHtml>
<link>{rsslink}</link>
<author>{rssauthor}</author>
<category>{category}</category>
<pubDate>{rssdate}</pubDate>
<turbo:content><![CDATA[<header><h1>{title}</h1></header>{full-story}]]></turbo:content>
</item>[/turbo]

[dzen]<item>
<title>{title}</title>
<link>{rsslink}</link>
<pdalink>{rsslink}</pdalink>
<guid>{news-id}</guid>
<pubDate>{rssdate}</pubDate>
<category>native-yes</category>
{images}
<content:encoded><![CDATA[{full-story}]]></content:encoded>
</item>[/dzen]
v15.2'den v15.3'e

1. CSS ekleyin (Galeri ve TOC):

.comments-image-gallery { margin: 0; padding: 0; list-style: none; clear: both; }
.comments-image-gallery li img {
  float: left; margin-right: 5px; border: 5px solid #fff;
  width: 100px; height: 100px; transition: box-shadow 0.5s ease;
}
.mce-toc { border: 1px solid #dbdada; margin: 0 0 .7rem 0; }
.mce-toc h2 { margin: 4px; }
.mce-toc ul { padding-left: 20px; list-style: none; margin: 1em 0; }

2. addcomments.tpl içine <li id="comment-editor">...</li> altına ekleyin:


[allow-comments-subscribe]
    <li>{comments-subscribe}</li>
[/allow-comments-subscribe]

3. comments.tpl içine {comment} sonrasına ekleyin:

[images]<div class="signature">--------------------</div><div class="clrfix">{images}</div>[/images]
v15.0'dan v15.1'e

1. Resim hizalama CSS'lerini ekleyin:

figure { margin: 0; }
figure.align-left { float: left; }
figure.align-right { float: right; }
figure.image.align-center {
    display: table; margin-left: auto; margin-right: auto;
}
figure.image figcaption {
    padding: 1rem; background-color: #fafafa;
    text-align: center; font-size: .8rem;
}
v14.2'den v14.3'e

1. Kod renklendirme (Highlight.js) stillerini ekleyin:

.hljs-comment, .hljs-quote { color: #a0a1a7; font-style: italic; }
.hljs-doctag, .hljs-keyword, .hljs-formula { color: #a626a4; }
.hljs-section, .hljs-name, .hljs-selector-tag, .hljs-deletion, .hljs-subst { color: #e45649; }
.hljs-literal { color: #0184bb; }
.hljs-string, .hljs-regexp, .hljs-addition, .hljs-attribute, .hljs-meta-string { color: #50a14f; }
.hljs-built_in, .hljs-class .hljs-title { color: #c18401; }
.hljs-attr, .hljs-variable, .hljs-template-variable { color: #986801; }
.hljs-symbol, .hljs-bullet, .hljs-link { color: #4078f2; }
.hljs-emphasis { font-style: italic; }
.hljs-strong { font-weight: bold; }
.hljs-link { text-decoration: underline; }
v13.3'ten v14.0'a

1. CSS dosyanıza ekleyin (Emoji):

.emoji_box { width:100%; max-width: 390px; }
.emoji_category { padding:7px; clear:both; }
.emoji_list {
  margin-top:5px; margin-bottom:5px; width:100%;
  font-family:'Apple Color Emoji', 'Segoe UI Emoji', 'NotoColorEmoji', 'Segoe UI Symbol', 'Android Emoji', 'EmojiSymbols';
  font-size:2em;
}
.emoji_symbol { float:left; margin-bottom: 10px; width:12.5%; text-align:center; }
.emoji_symbol a { cursor: pointer; text-decoration:none; }
.native-emoji { font-size: 1.3em; }
Daha eski sürümler için (13.3 ve öncesi) güncellemeler arşivlenmiştir.