• Login
  • Register
  • Login Register
    Login
    Username:
    Password:
  • Home
  • Members
  • Team
  • Help
  • More
    • YouTube
    • Facebook
User Links
  • Login
  • Register
  • Login Register
    Login
    Username:
    Password:

    Quick Links Home Members Team Help
    More Subscribe YouTube Facebook
    D&D Forums - MyBB Plugins & Themes MyBB General Discussions Tricks & Tutorials [Tutorial] jQuery collapsible sidebar

     
    • 0 Vote(s) - 0 Average
    [Tutorial] jQuery collapsible sidebar
    AmazOuz
    Offline

    Administrator

    Posts: 272
    Threads: 34
    Joined: Oct 2017
    Reputation: 11
    #1
    09-27-2022, 01:10 AM (This post was last modified: 09-27-2022, 01:11 AM by AmazOuz.)
    Hello everyone Smile

    First off, you need to download the attached files and upload them to your forum. The two image go in your forum's images folder. The two javascript files go in your jscripts folder.

    After you have downloaded and uploaded those files, you must go to your Admin CP, click the Templates & Style tab, then on the left click Templates, select your theme, expand the Index Templates, and finally, open up index. Replace it all with this.
    Code:
    <html>
    <head>
    <title>{$mybb->settings['bbname']}</title>
    {$headerinclude}
    <script type="text/javascript">
    <!--
        lang.no_new_posts = "{$lang->no_new_posts}";
        lang.click_mark_read = "{$lang->click_mark_read}";
    // -->
    </script>
    <style type="text/css">
    .buttons {
        background: url(images/arrowright.png) no-repeat;
        width: 16px;
        height: 16px;
        display: block;
        cursor: pointer;
    }

    .clickedbuttons {
        background: url(images/arrowleft.png) no-repeat;
        width: 16px;
        height: 16px;
        display: block;
        cursor: pointer;
    }
    </style>
    </head>
    <body>
    {$header}
    <a class="buttons" style="float: right;"></a>
    <a class="clickedbuttons" style="float: right;"></a>
    <br class="clear" />
    <div class="sidebar" style="float: right;width: 19%;">
    <table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder">
    <tr>
    <td class="thead"><strong>
    Latest News
    </strong></td>
    </tr>
    <tr>
    <td class="trow1">
    You can put some news stuff here
    </td>
    </tr>
    </table>
    </div>
    <div class="forums" style="float: left;width: 80%;">
    {$forums}
    </div>
    <br class="clear" />
    {$boardstats}

    <dl class="forum_legend smalltext">
        <dt><img src="{$theme['imgdir']}/on.gif" alt="{$lang->new_posts}" title="{$lang->new_posts}" style="vertical-align: middle; padding-bottom: 4px;" /></dt>
        <dd>{$lang->new_posts}</dd>

        <dt><img src="{$theme['imgdir']}/off.gif" alt="{$lang->no_new_posts}" title="{$lang->no_new_posts}" style="vertical-align: middle; padding-bottom: 4px;" /></dt>
        <dd>{$lang->no_new_posts}</dd>

        <dt><img src="{$theme['imgdir']}/offlock.gif" alt="{$lang->forum_locked}" title="{$lang->forum_locked}" style="vertical-align: middle;" /></dt>
        <dd>{$lang->forum_locked}</dd>
    </dl>
    <br style="clear: both" />
    {$footer}
    </body>
    </html>

    Save and close.

    Now expand the Ungrouped Templates, and open headerinclude.

    Find:
    Code:
    {$stylesheets}

    Add before:
    Code:
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js"></script>
    <script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/jquery.cookie.js"></script>
    <script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/sidebar.js"></script>

    I'm pretty sure that's all you will need. If you have any problems let me know!

    Source : https://community.mybb.com/thread-73062.html

    Enjoy Big Grin


    Attached Files
    .zip   Files to upload.zip (Size: 2.06 KB / Downloads: 0)
    « Next Oldest | Next Newest »

    Users browsing this thread: 1 Guest(s)



    • View a Printable Version
    • Subscribe to this thread
    Forum Jump:

    D&D Company

    Home · Members · Team · Help · Contact

    © D&D - Powered by MyBB

    Paris, France

    07 53 04 58 86

    business@developement.design

    About the company We are a growing company of web developers & designers, specialized in MyBB plugins & themes. Our work is our propaganda.

    Linear Mode
    Threaded Mode