MyBB Community Forums

I am currently am using a My BB website which is done that is for a DRP server but to make the rules look good and a bit better I would like to make the Rules page look like the one on the website below.

https://celeriumgaming.com/darkrp/rules/

Try any jQuery accordion plugin, thats the basic suggestion.
Something like this: Toungue

https://github.com/effone/jquery.ruk

Nino123, apologies on late reply, I ended up too tired yesterday evening to get something going for you here. If not by tonight then tomorrow if no one else has by then. Smile

First we need to create a new PHP file, which will create a new page called Rules.

Open your FTP client OR File Manager area of your cPanel, create a new file within your MyBB directory (most likely public_html directory), name the file rules.php and add in the following bit of code:

<?php

define("IN_MYBB", 1);
define('THIS_SCRIPT', 'rules.php');

$templatelist = "rules";

require "./global.php";

add_breadcrumb("Rules", "rules.php");

eval("\$rules = \"".$templates->get("rules")."\";");
output_page($rules);
?>

Now let us navigate to the site http://mamosnetworks.com/ login to your Admin CP. Go to Templates & Style --> Templates --> Global Templates --> Add Template. Name the new template rules and add in the following bit of code.

<html>
<head>
<title>{$mybb->settings['bbname']} - Rules</title>
{$headerinclude}
<style>
.hide {
display: none;
}
.show {
display: block !important;
}
</style>
</head>
<body>
{$header}



<div class="tborder"><div class="thead" onclick="myFunction('SECTION1')" style="cursor: pointer;">Section One</div>
<div id="SECTION1" class="hide"><div class="trow1">
Lorem ipsum dolor Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<br /><br />
Lorem ipsum dolor Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div></div></div>

<div class="tborder"><div class="thead" onclick="myFunction('SECTION2')" style="cursor: pointer;">Section Two</div>
<div id="SECTION2" class="hide"><div class="trow1">
Lorem ipsum dolor Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<br /><br />
Lorem ipsum dolor Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div></div></div>


{$footer}
<script>
function myFunction(id){var x=document.getElementById(id);if(x.className.indexOf("show")==-1){x.className+=" show";}else{x.className=x.className.replace(" show","");}}
</script>
</body>
</html>

You'll need to play with it to get it to your likings!

Nino123

effone

isoldehn

isoldehn