Blogger Akordiyon Arşiv Eklentisi – Arşiv Sayfası

Blogger Akordiyon Arşiv Eklentisi – Arşiv Sayfası
Bu haber 03 Şubat 2017 - 10:42 'de eklendi ve 78 kez görüntülendi.

Bu yazımızda  Blogger bloglarda arşiv sayfası nasıl hazırlanır onu anlatmaya çalışacağız. Öncelikle  blogger panelimize giriş yapıyoruz. Buradan  sayfalar  kısmına tıklayarak yeni bir sayfa oluşturuyoruz. Bu sayfanın adını kendinize göre düzenleyebilirsiniz. Arsiv, Arsiv Sayfasi gibi  Türkçe karakter kullanmadan  bir sayfa oluşturabilir siniz.

Sayfamızı oluşturduktan sonra  blogger için tasarlanan etikete duyarlı arşiv eklentisini  blog sayfamıza uyarlama adımına geçiyoruz.  Aşağıdaki  kodu  oluşturduğumuz arşiv sayfasına  HTML  bölümüne yapıştırıyoruz.

 

[code]<div dir="ltr" style="text-align:left;" trbidi="on">
<style scoped="" type="text/css">
.table-of-content{background-color:#fff;color:#444;font-family:Verdana,Geneva,Tahoma,Arial,Sans-serif;font-size:13px;font-weight:400;overflow:hidden;border-radius:4px;box-shadow:0 0 10px rgba(0,0,0,.2)}
.table-of-content .toc-header{color:#444;font-family:inherit;font-weight:400;font-size:14px;background-color:#fff;margin:0;padding:15px;overflow:hidden;cursor:pointer;border-bottom:1px solid #ccc;transition:initial}
.table-of-content .toc-header:hover{background-color:#fdfdfd}
.table-of-content .toc-header:before{content:”;width:0;height:0;position:absolute;top:22px;right:15px;border:5px solid transparent;border-color:#aaa transparent transparent;transition:all .3s ease}
.table-of-content .toc-header.active{color:#fc4f3f}
.table-of-content .toc-header.active:before{border-color:#666 transparent transparent;top:16px;-webkit-transform:rotate(-180deg);-moz-transform:rotate(-180deg);-ms-transform:rotate(-180deg);-o-transform:rotate(-180deg);transform:rotate(-180deg)}
.table-of-content .loading{display:block;padding:15px;text-decoration:blink}
.table-of-content ol{margin:0;padding:0;list-style:none;transition:initial}
.table-of-content li{line-height:normal!important;margin:0!important;padding:8px 8px 8px 15px!important;white-space:nowrap;text-align:left;overflow:hidden;background:#444359!important;transition:initial}
.table-of-content a{color:#d9d9d9;text-decoration:none;font-size:86%;transition:initial}
.table-of-content a:visited{color:#a2a2a9;transition:initial}
.table-of-content a:hover,.table-of-content a:visited:hover{color:#ffc937;text-decoration:none;transition:initial}
.post ol li:before{display:none}
</style>
<div class="table-of-content" id="table-of-content">
<span class="loading">Memuat konten…</span></div>
<script>
var toc_config = {
url: ‘http://viennatheme.blogspot.com/’,
containerId: ‘table-of-content’,
showNew: 15,
newText: ‘ <strong style="font-weight:normal;font-style:normal;color:#fff;font-size:11px;background:#5c5a78;padding:1px 6px 3px 6px;line-height:normal;float:right;border-radius:3px;">baru</strong>’,
sortAlphabetically: {
thePanel: true,
theList: true
},
maxResults: 9999,
activePanel: 1,
slideSpeed: {
down: 400,
up: 400
},
slideEasing: {
down: null,
up: null
},
slideCallback: {
down: function() {},
up: function() {}
},
clickCallback: function() {},
jsonCallback: ‘_toc’,
delayLoading: 0
};
</script>
<script src="https://cdn.rawgit.com/Arlina-Design/redvision/master/daftar-isi-tea.js"></script>
</div>[/code]

Kodu yapıştırdıktan sonra direk kaydediyoruz. Arşiv sayfası kullanılmaya hazır oldu. Örnek görünümü için aşağıdaki demo’ yu inceleye bilirisiniz.

Demo

 

HABER HAKKINDA GÖRÜŞ BELİRT

YASAL UYARI! Suç teşkil edecek, yasadışı, tehditkar, rahatsız edici, hakaret ve küfür içeren, aşağılayıcı, küçük düşürücü, kaba, pornografik, ahlaka aykırı, kişilik haklarına zarar verici ya da benzeri niteliklerde içeriklerden doğan her türlü mali, hukuki, cezai, idari sorumluluk içeriği gönderen kişiye aittir.
POPÜLER FOTO GALERİLER
SON DAKİKA HABERLERİ
İLGİLİ HABERLER