Konu: Sp Tab menu ekleme  (Okunma sayısı 1736 defa)

0 Üye ve 1 Ziyaretçi konuyu incelemekte.

08 Aralık 2013, 14:13
  • *
    • İleti: 331
    • Karma: 17
    • haksever,huutheme
    • haksever
    • Profili Görüntüle

İyi Günler.Sp tab menu eklemeyi anlatıcaz.
Öncelikle enletideki js temanızın ana dizinine atın.(tema/js)
Daha sonra css kodlarını index.css ekleyin (veya yeniden bir css kurarak index.template.php çekerek de kullanabilirsiniz.)
Kod: [Seç]
.ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; }
.ui-helper-clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.ui-helper-clearfix { display:block; }
.ui-widget { font-family: Trebuchet MS, Tahoma, Verdana, Arial, sans-serif; font-size: 1.1em; }
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Trebuchet MS, Tahoma, Verdana, Arial, sans-serif; font-size: 1em; }
.ui-widget-content { color:#333333; }
.ui-widget-content a { color: #333333; }
.ui-tabs { padding:0; }
.ui-tabs .ui-tabs-nav { list-style: none; position: relative; padding: 0; }
.ui-tabs .ui-tabs-nav li {
    position: relative;
    float: left;
    border-bottom-width: 0 !important;
    margin: 0 .2em -1px 0;
    padding: 0;
    border-radius: 5px 5px 0 0;
}
.ui-tabs .ui-tabs-nav li a { float: left; text-decoration: none; padding: .5em 1em; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected { padding-bottom: 1px; border-bottom-width: 0; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; }
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
.ui-tabs .ui-tabs-panel {
    padding: 1em 1.4em;
    display: block;
    border-width: 0;
    background: none repeat scroll 0 0 #fff;
    border:1px solid #E0E0E0;
    padding:15px;
    border-radius: 0 6px 6px 6px; }
.ui-tabs .ui-tabs-hide { display: none !important; }

/* Interaction states
----------------------------------*/
.ui-state-default, .ui-widget-content .ui-state-default { border: 1px solid #cccccc; background: #f6f6f6 url(images/ui-bg_glass_100_f6f6f6_1x400.png) 50% 50% repeat-x; font-weight: bold; color: #1c94c4; outline: none; }
.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #1c94c4; text-decoration: none; outline: none; }
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus { border: 1px solid #ddd; background: #fff; font-weight: bold; color: #519BDA; outline: none; }
.ui-state-hover a, .ui-state-hover a:hover { color: #c77405; text-decoration: none; outline: none; }
.ui-state-active, .ui-widget-content .ui-state-active { border: 1px solid #ddd; background: #ffffff url(images/ui-bg_glass_65_ffffff_1x400.png) 50% 50% repeat-x; font-weight: bold; color: #519BDA; outline: none; }
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #eb8f00; outline: none; text-decoration: none; }

Daha sonra temanızda index.template.php açın.

Bul
Kod: [Seç]
<script type="text/javascript" src="', $settings['default_theme_url'], '/scripts/script.js?fin20"></script>Altına ekle
Kod: [Seç]
<script type="text/javascript" src="', $settings['theme_url'], '/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="', $settings['theme_url'], '/js/jquery-ui-1.7.2.custom.min.js"></script>
    <script type="text/javascript">
$(function(){

// Tabs
$(\'#tabs\').tabs();

});
</script>

ve son kısım Sp de HTML blok oluşturun ve ekleyin.
Kod: [Seç]
<div id="tabs">
<ul>
<li><a href="#tabs-1">First</a></li>
<li><a href="#tabs-2">Second</a></li>
<li><a href="#tabs-3">Third</a></li>
</ul>
<div id="tabs-1">Page 1</div>
<div id="tabs-2">Page 2</div>
<div id="tabs-3">Page 3</div>
</div>

Son.
CSS biraz değişiklikle güzel bir görünüm elde edildi.
Biz Ayet-hadis-dua olarak kullanıyoruz.Birde temanızın font ayarına göre iç yazılar işler siz kendinize görede eklemeler yapabilirsiniz.K.Gelsin.

Resimli Demo:



08 Aralık 2013, 15:37
Yanıtla #1
  • *
    • İleti: 2018
    • Karma: 41
    • Spina Bifida
    • Profili Görüntüle

teşekkürler.


08 Aralık 2013, 15:48
Yanıtla #2
  • *
    • İleti: 331
    • Karma: 17
    • haksever,huutheme
    • haksever
    • Profili Görüntüle

Ben Teşşekür ederim.Yararlı olması niyetiyle.   ;D


25 Nisan 2014, 18:37
Yanıtla #3
  • *
    • İleti: 141
    • Karma: 1
    • Forumigo8navigation
    • Profili Görüntüle

Portalda denedim html olarakta php olarakta yarlamaya çalıştım ama tablar oluşmadı.Teşekkürler.


25 Nisan 2014, 18:44
Yanıtla #4
  • *
    • İleti: 2018
    • Karma: 41
    • Spina Bifida
    • Profili Görüntüle

Ben bu konu ile hiç ilgilenmedim. cemo arkadaş gelince bakar inş.


25 Nisan 2014, 18:56
Yanıtla #5
  • *
    • İleti: 141
    • Karma: 1
    • Forumigo8navigation
    • Profili Görüntüle

Ben bu konu ile hiç ilgilenmedim. cemo arkadaş gelince bakar inş.

İlk günden beri forumda tabs sistemini kullanıyorum.Bu konuda epey uğraştım.Şu anda da portalda da forumda da tabs sistemini kullanıyorum.
Bu sistemi de deneyip hız konusunda bir sıkıntı yaratırmı bakmak istedim.Kullandığım tabs sistemi ile karşılaştırıp ona göre seçim yapacaktım.Ama neden ise bunu çalıştıramadım.Teşekkürler.


25 Nisan 2014, 23:25
Yanıtla #6
  • *
    • İleti: 331
    • Karma: 17
    • haksever,huutheme
    • haksever
    • Profili Görüntüle

script kodunu direk bloke açarken alta atarak denermisiniz belki index.template.php ile iletişim kuramıyordur.Teşekkürler


25 Nisan 2014, 23:36
Yanıtla #7
  • *
    • İleti: 141
    • Karma: 1
    • Forumigo8navigation
    • Profili Görüntüle

script kodunu direk bloke açarken alta atarak denermisiniz belki index.template.php ile iletişim kuramıyordur.Teşekkürler

Yok söylediğiniz gibi script devreye girmiyor.Ama nedeni bulamadım.Söylediğiniz gibi alta da attım ama sonuç vermedi.Teşekkürler.


25 Nisan 2014, 23:59
Yanıtla #8
  • *
    • İleti: 2018
    • Karma: 41
    • Spina Bifida
    • Profili Görüntüle

Ben denedim çalışıyor.
Bi sıkıntı görünmüyor: Benim Topluluğum


26 Nisan 2014, 00:07
Yanıtla #9
  • *
    • İleti: 141
    • Karma: 1
    • Forumigo8navigation
    • Profili Görüntüle

Ben denedim çalışıyor.
Bi sıkıntı görünmüyor: Benim Topluluğum


O zaman benim kullandığım diğer scriptlerle bir çakışma olabilir.Deneyip bakarım.Teşekkürler.