Thread Rating:
  • 4 Votes - 5 Average
  • 1
  • 2
  • 3
  • 4
  • 5
 Postbit Tabs
WhiteEagle Offline
Member
***
Posts: 62
Joined: Sep 2011
Post: #51
RE: Postbit Tabs
I'm certain I can find a good use for this on at least one of my sites! Biggrin

Thanks RateU for another interesting application here! Biggrin

I fold for team 52482. Do you fold?
MyBB powered sites: Leet Link FoodRatings
08-24-2012 12:10 PM
Find all posts by this user Quote this message in a reply
Gstone Offline
Member
***
Posts: 55
Joined: May 2012
Post: #52
RE: Postbit Tabs
Not sure if anyone saw my post because I bumped this topic and another reply came right after. i'll requote:

(08-23-2012 11:57 PM)Gstone Wrote:  Hello,

in the demo in the first post, the New Thread template has tabs. Is there a tutorial for doing that? I searched a little but haven't found one.

also, this is a great tutorial, thank you!
08-27-2012 04:55 AM
Find all posts by this user Quote this message in a reply
RateU Offline
Administrator
*******
Posts: 2,350
Joined: Mar 2010
Post: #53
RE: Postbit Tabs
This is the newthread and editpost_first template. Modify it as your needs:
newthread

HTML Code
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
<html>
<head>
<title>{$lang->newthread_in}</title>
{$headerinclude}
<script type="text/javascript" src="jscripts/post.js?ver=1400"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
	$.noConflict();
</script>
<script type="text/javascript">
	jQuery(document).ready(function($){
		$('.tab').click(function(){
			$('.at').removeClass('at');
			$(this).addClass('at');
			$('.content').slideUp();
			var catshow = $(this).attr('abbr');
			$('#'+ catshow).slideDown();
		});
	});
</script>
<style type="text/css">
#tc2, #tc3, #nt2, #nt3, #nt4 {
	display: none;
}
.at {
	background: #026CB1 url(images/thead_bg.gif) top left repeat-x;
	color: #ffffff;
}
</style>
</head>
<body>
{$header}
<div class="tc largetext"><a href="http://www.14.mynie.co.cc/forumdisplay.php?fid=33">Miscellaneous</a></div>
<br />
{$preview}
{$thread_errors}
{$attacherror}
<form action="newthread.php?fid={$fid}&amp;processed=1" method="post" enctype="multipart/form-data" name="input">
<input type="hidden" name="my_post_key" value="{$mybb->post_code}" />
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder" style="border-bottom-width: 0;">
<tr>
<td class="thead" colspan="4"><strong>{$lang->post_new_thread}</strong></td>
</tr>
<tr>
<td class="tcat at tab" style="cursor: pointer; text-align: center; width: 25%;" abbr="nt1"><strong>Contents In Tabs 1</strong></td>
<td class="tcat tab" style="cursor: pointer; text-align: center; width: 25%;" abbr="nt2"><strong>Contents In Tabs 2</strong></td>
<td class="tcat tab" style="cursor: pointer; text-align: center; width: 25%;" abbr="nt3"><strong>Contents In Tabs 3</strong></td>
<td class="tcat tab" style="cursor: pointer; text-align: center; width: 25%;" abbr="nt4"><strong>Additional Settings</strong></td>
</tr>
</table>
<div id="nt1" class="content">
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder" style="border-top-width: 0;">
<tr>
<td class="trow2" width="20%"><strong>{$lang->thread_subject}</strong></td>
<td class="trow2"><input type="text" class="textbox" name="subject" size="40" maxlength="85" value="{$subject}" tabindex="1" /></td>
</tr>
{$extra_threadfields}
<tr>
<td class="trow2" valign="top"><strong>{$lang->your_message}</strong>{$smilieinserter}</td>
<td class="trow2">
<textarea name="message" id="message" rows="20" cols="70" tabindex="2">{$message}</textarea>
{$codebuttons}
{$multiquote_external}
</td>
</tr>
</table>
</div>
<div id="nt2" class="content">
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder" style="border-top-width: 0;">
{$tfinputrow['tc2']}
{$tfinputrow['tc2c']}
</table>
</div>
<div id="nt3" class="content">
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder" style="border-top-width: 0;">
{$tfinputrow['tc3']}
{$tfinputrow['tc3c']}
</table>
</div>
<div id="nt4" class="content">
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder" style="border-top-width: 0;">
{$loginbox}
{$posticons}
{$tfinputrow['prefix']}
{$tfinputrow['xtforcepostlayout']}
<tr>
<td class="trow1" valign="top" width="20%"><strong>{$lang->post_options}</strong></td>
<td class="trow1"><span class="smalltext">
<label><input type="checkbox" class="checkbox" name="postoptions[signature]" value="1" tabindex="7"{$postoptionschecked['signature']} /> {$lang->options_sig}</label>
{$disablesmilies}</span></td>
</tr>
{$modoptions}
{$subscriptionmethod}
{$pollbox}
</table>
</div>
<br />
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder">
<tr>
<td class="thead" colspan="3"><strong>Image Verification</strong></td>
</tr>
{$captcha}
</table>
{$attachbox}
<br />
<div style="text-align:center"><input type="submit" class="button" name="submit" value="{$lang->post_thread}" tabindex="4" accesskey="s" />  <input type="submit" class="button" name="previewpost" value="{$lang->preview_post}" tabindex="5" />{$savedraftbutton}</div>
<input type="hidden" name="action" value="do_newthread" />
<input type="hidden" name="posthash" value="{$posthash}" />
<input type="hidden" name="attachmentaid" value="" />
<input type="hidden" name="attachmentact" value="" />
<input type="hidden" name="quoted_ids" value="{$quoted_ids}" />
<input type="hidden" name="tid" value="{$tid}" />
{$editdraftpid}
</form>
{$forumrules}
{$footer}
</body>
</html>


editpost_first

HTML Code
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
<html>
<head>
<title>{$mybb->settings['bbname']} - {$lang->edit_post}</title>
{$headerinclude}
<script type="text/javascript" src="jscripts/post.js?ver=1400"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
	$.noConflict();
</script>
<script type="text/javascript">
	jQuery(document).ready(function($){
		$('.tab').click(function(){
			$('.at').removeClass('at');
			$(this).addClass('at');
			$('.content').slideUp();
			var catshow = $(this).attr('abbr');
			$('#'+ catshow).slideDown();
		});
	});
</script>
<style type="text/css">
#tc2, #tc3, #nt2, #nt3, #nt4 {
	display: none;
}
.at {
	background: #026CB1 url(images/thead_bg.gif) top left repeat-x;
	color: #ffffff;
}
</style>
</head>
<body>
{$header}
{$preview}
{$post_errors}
{$attacherror}
<form action="editpost.php" method="post" name="editpost">
<input type="hidden" name="my_post_key" value="{$mybb->post_code}" />
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder">
<tr>
<td class="thead" colspan="3"><strong>{$lang->delete_post}</strong></td>
</tr>
<tr>
<td class="trow1" style="white-space: nowrap"><input type="checkbox" class="checkbox" name="delete" value="1" tabindex="9" /> <strong>{$lang->delete_q}</strong></td>
<td class="trow1" width="100%">{$lang->delete_1}<br /><span class="smalltext">{$lang->delete_2}</span></td>
<td class="trow1"><input type="submit" class="button" name="submit" value="{$lang->delete_now}" tabindex="10" /></td>
</tr>
</table>
<input type="hidden" name="action" value="deletepost" />
<input type="hidden" name="pid" value="{$pid}" />
</form>
<br />
<form action="editpost.php?pid={$pid}&amp;processed=1" method="post" enctype="multipart/form-data" name="input">
<input type="hidden" name="my_post_key" value="{$mybb->post_code}" />
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder" style="border-bottom-width: 0;">
<tr>
<td class="thead" colspan="4"><strong>{$lang->edit_post}</strong></td>
</tr>
<tr>
<td class="tcat at tab" style="cursor: pointer; text-align: center; width: 25%;" abbr="nt1"><strong>Contents In Tabs 1</strong></td>
<td class="tcat tab" style="cursor: pointer; text-align: center; width: 25%;" abbr="nt2"><strong>Contents In Tabs 2</strong></td>
<td class="tcat tab" style="cursor: pointer; text-align: center; width: 25%;" abbr="nt3"><strong>Contents In Tabs 3</strong></td>
<td class="tcat tab" style="cursor: pointer; text-align: center; width: 25%;" abbr="nt4"><strong>Additional Settings</strong></td>
</tr>
</table>

<div id="nt1" class="content">
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder" style="border-top-width: 0;">
<tr>
<td class="trow2"><strong>{$lang->subject}</strong></td>
<td class="trow2"><input type="text" class="textbox" name="subject" size="40" maxlength="85" value="{$subject}" tabindex="1" /></td>
</tr>
{$extra_threadfields}
<tr>
<td class="trow2" valign="top"><strong>{$lang->your_message}</strong>{$smilieinserter}</td>
<td class="trow2">
<textarea name="message" id="message" rows="20" cols="70" tabindex="3">{$message}</textarea>
{$codebuttons}
</td>
</tr>
</table>
</div>

<div id="nt2" class="content">
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder" style="border-top-width: 0;">
{$tfinputrow['tc2']}
{$tfinputrow['tc2c']}
</table>
</div>
<div id="nt3" class="content">
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder" style="border-top-width: 0;">
{$tfinputrow['tc3']}
{$tfinputrow['tc3c']}
</table>
</div>

<div id="nt4" class="content">
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder" style="border-top-width: 0;">
{$loginbox}
{$posticons}
{$tfinputrow['prefix']}
{$tfinputrow['xtforcepostlayout']}
<tr>
<td class="trow1" valign="top" width="20%"><strong>{$lang->post_options}</strong></td>
<td class="trow1"><span class="smalltext">
<label><input type="checkbox" class="checkbox" name="postoptions[signature]" value="1" tabindex="6"{$postoptionschecked['signature']} /> {$lang->options_sig}</label>
{$disablesmilies}</span></td>
</tr>
{$subscriptionmethod}
{$pollbox}
</table>
</div>
<br />
<div align="center"><input type="submit" class="button" name="submit" value="{$lang->update_post}" tabindex="3" />  <input type="submit" class="button" name="previewpost" value="{$lang->preview_post}" tabindex="4" /></div>
<input type="hidden" name="action" value="do_editpost" />
<input type="hidden" name="posthash" value="{$posthash}" />
<input type="hidden" name="attachmentaid" value="" />
<input type="hidden" name="attachmentact" value="" />
</form>
{$footer}
</body>
</html>


08-27-2012 05:05 AM
Find all posts by this user Quote this message in a reply
Gstone Offline
Member
***
Posts: 55
Joined: May 2012
Post: #54
RE: Postbit Tabs
awesome RateU, thanks!
08-27-2012 09:24 AM
Find all posts by this user Quote this message in a reply
Gstone Offline
Member
***
Posts: 55
Joined: May 2012
Post: #55
RE: Postbit Tabs
is there any way to add {$codebuttons} to the new textareas in the tabs?
09-24-2012 09:24 PM
Find all posts by this user Quote this message in a reply
RateU Offline
Administrator
*******
Posts: 2,350
Joined: Mar 2010
Post: #56
RE: Postbit Tabs
Unfortunately not. MyBB's default editor can't be used more than once on the same page.

09-25-2012 12:52 AM
Find all posts by this user Quote this message in a reply
admin2u Offline
Junior Member
**
Posts: 14
Joined: Oct 2012
Post: #57
RE: Postbit Tabs
Quote:postbit_first or template_prefix_postbit_first template.
An example how to apply the tabs title and tabs contents in this template.

i canot see it where the location???

please guide me ????

ErfErf
12-18-2012 03:15 AM
Find all posts by this user Quote this message in a reply
ZiNgA BuRgA Online
Fag
*******
Posts: 3,357
Joined: Jan 2008
Post: #58
RE: Postbit Tabs
Create them if they don't exist.

My Blog
12-18-2012 09:16 AM
Find all posts by this user Quote this message in a reply
xensor Offline
Junior Member
**
Posts: 22
Joined: Jan 2014
Post: #59
RE: Postbit Tabs
how can i get this to work on 1.8?

using the jquery that mybb 1.8.6 uses.
09-22-2016 08:54 AM
Find all posts by this user Quote this message in a reply
Grumpykitty Offline
Junior Member
**
Posts: 2
Joined: Jan 2016
Post: #60
RE: Postbit Tabs
Hi,

RateU I love to use this on my forum I posted a Private message to you. Is there anyway you can work with me on this, to make it easier to understand? I'm slightly confused at the top part of where those codes go and such.  Frown
08-26-2017 07:58 AM
Find all posts by this user Quote this message in a reply

« Next Oldest | Next Newest »

 Standard Tools
Forum Jump: