Header Ads

  • Breaking News

    Multi Tabbed Widget za Bloger


    Ovo je widget sa 3 kolumne i vrlo je prikladan za većimu blogova, imate demo pa ako vam se svidi vi iskoristite. 

    Ovaj widget već ima FollowersPopular PostsBlog Archive ali vi napravite po vašem ukusu i kako vama odgovara

    Screenshot


    Kliknite Ctrl+F i nadjite ]]></b:skin>

    Odmah iznad toga dodajte sledeći kod:

    .tabs-widget{list-style:none;list-style-type:none;margin:0 0 10px 0;padding:0;height:26px}
    .tabs-widget li{list-style:none;list-style-type:none;margin:0 0 0 4px;padding:0;float:left}
    .tabs-widget li:first-child{margin:0}
    .tabs-widget li a{color:#4E4840;background:#EBEBE5;padding:5px 16px;display:block;text-decoration:none;font:bold 12px Arial,Helvetica,Sans-serif}
    .tabs-widget li a:hover,.tabs-widget li a.tabs-widget-current{background:#756857;color:#FFF;text-decoration:none}
    .tabs-widget-content{}

    .tabviewsection{margin-top:10px;margin-bottom:10px;}

    Ako koristite difolt template, to su vam "fabrički" tj. blogger original a ne custom onda pronadjite neke od ovih kodova:

    <div class='column-right-inner'>

    <div id='sidebar-wrapper'>

    <div id='rsidebar-wrapper'>



    Kada nadjete neki od njih, odmah iznad dodajte sledeći kod:


    <div class='tabviewsection'>
    <script type='text/javascript'>
                jQuery(document).ready(function($){
                    $(&quot;.tabs-widget-content-widget-themater_tabs-1432447472-id&quot;).hide();
                    $(&quot;ul.tabs-widget-widget-themater_tabs-1432447472-id li:first a&quot;).addClass(&quot;tabs-widget-current&quot;).show();
                    $(&quot;.tabs-widget-content-widget-themater_tabs-1432447472-id:first&quot;).show();
           
                    $(&quot;ul.tabs-widget-widget-themater_tabs-1432447472-id li a&quot;).click(function() {
                        $(&quot;ul.tabs-widget-widget-themater_tabs-1432447472-id li a&quot;).removeClass(&quot;tabs-widget-current a&quot;); 
                        $(this).addClass(&quot;tabs-widget-current&quot;); 
                        $(&quot;.tabs-widget-content-widget-themater_tabs-1432447472-id&quot;).hide(); 
                        var activeTab = $(this).attr(&quot;href&quot;); 
                        $(activeTab).fadeIn();
                        return false;
                    });
                });
            </script>
    <ul class='tabs-widget tabs-widget-widget-themater_tabs-1432447472-id'>
    <li><a href='#widget-themater_tabs-1432447472-id1'>Followers</a></li>
    <li><a href='#widget-themater_tabs-1432447472-id2'>Popular</a></li>
    <li><a href='#widget-themater_tabs-1432447472-id3'>Blog Archives</a></li>
    </ul>
    <div class='tabs-widget-content tabs-widget-content-widget-themater_tabs-1432447472-id' id='widget-themater_tabs-1432447472-id1'>
    <b:section class='sidebar' id='sidebartab1' preferred='yes'>
    <b:widget id='CustomSearch1' locked='false' title='' type='CustomSearch'/>
    <b:widget id='Followers1' locked='false' title='Followers' type='Followers'/>
    </b:section>                                       
    </div>                            
                                    
    <div class='tabs-widget-content tabs-widget-content-widget-themater_tabs-1432447472-id' id='widget-themater_tabs-1432447472-id2'>
    <b:section class='sidebar' id='sidebartab2' preferred='yes'>
    <b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'/>
    </b:section>                                         
    </div>                            
                                    
    <div class='tabs-widget-content tabs-widget-content-widget-themater_tabs-1432447472-id' id='widget-themater_tabs-1432447472-id3'>
    <b:section class='sidebar' id='sidebartab3' preferred='yes'>
    <b:widget id='BlogArchive2' locked='false' title='Blog Archive' type='BlogArchive'/>
    </b:section>                                     
    </div>
    </div>


    Kliknite "Save"  i pogledajte vaš blog, Srećan bloging blogeri :)

    No comments

    Post Top Ad

    Post Bottom Ad