Go Back   vb.org Archive > vBulletin Modifications > vBulletin 4.x Modifications > vBulletin 4.x Template Modifications

Reply
 
Thread Tools
Top Forum Display Options Details »»
Top Forum Display Options
Version: 1.00, by BRimagination BRimagination is offline
Developer Last Online: Jul 2012 Show Printable Version Email this Page

Category: Forum Display Enhancements - Version: 4.x.x Rating:
Released: 12-05-2010 Last Update: Never Installs: 7
Template Edits
Re-useable Code Code Changes Translations Is in Beta Stage  
No support by the author.

This is my first template mod that I am submitting publicly. Using what little HTML and CSS I know with my programming knowhow, I put this together. This isn't the best coding and looking to improve on it. Let me know how I did!

Tested on Vbulletin 4.0.7

Why was this mod made?

This mod was inspired by kira's Display Options Above Threads - as seen on vbulletin.org. I decide to make this mod since I could not find one for Vbulletin 4.


What does this mod do?

This mod simply places the Forum Display Options dropdowns that were originally placed towards the bottom of the forums and moves them above the forum threads. I find it easier to to have the Forum Display Options at the top so that users can easily sort topics, especially if prefixes are used like VBulletin.org. See attachments for preview.


Instructions

1. Go to the FORUMDISPLAY Template. To get to this, follow directions below:
Admin CP -> Styles & Templates -> Style Manager -> Click << >> on the theme -> Forum Display Templates -> FORUMDISPLAY

2. When inside FORUMDISPLAY, look for the following code:
Code:
<div class="collapse">
		<a class="collapse" id="collapse_forum_options" href="{vb:raw relpath}#top"><img src="{vb:stylevar imgdir_button}/collapse{vb:raw vbcollapse.collapseimg_info_options}_40b.png" alt="" /></a>
		<h4 class="forumoptiontitle"><span class="optiontitle">{vb:rawphrase thread_display_options}</span></h4>
	</div>

3. Delete code beginning at
Code:
<div class="collapse">
		<a class="collapse" id="collapse_forum_options" href="{vb:raw relpath}#top"><img src="{vb:stylevar imgdir_button}/collapse{vb:raw vbcollapse.collapseimg_info_options}_40b.png" alt="" /></a>
		<h4 class="forumoptiontitle"><span class="optiontitle">{vb:rawphrase thread_display_options}</span></h4>
	</div>
...

all the way to

Code:
...
<div class="options_input_wrapper">
				<div class="options_input_block">
					<div class="group">
						<input type="submit" class="button" value="{vb:rawphrase show_threads}" />
					</div>
				</div>
			</div>
		</form>
	</div>

4. After deleting the above code, find the following code:
Code:
<div id="pagetitle" class="pagetitle">
	<h1>{vb:rawphrase forum}: <span class="forumtitle">{vb:raw foruminfo.title}</span></h1>
	<vb:if condition="$foruminfo['description']"><p class="description">{vb:raw foruminfo.description}</p></vb:if>
</div>

5. Next, add the following code above <div id="pagetitle" class="pagetitle"> :
Note: This includes a <style> tag, so if your theme uses one already, just place that part in the code into your <style> tag.
Code:
<!----   Top Forum Display Options  ---->
<style>
#top_display_options {
  width: 550px ;
  margin-left: auto ;
  margin-right: auto ;
}
</style>

<div id="top_display_options">
	<form id="forum_display_options" action="forumdisplay.php" method="get">
		<table>
		<tbody>
		<tr>
		<td><div>
				<input type="hidden" name="s" value="{vb:raw session.sessionhash}" />
				<input type="hidden" name="f" value="{vb:raw forumid}" />
				<input type="hidden" name="page" value="{vb:raw pagenumber}" />
				<input type="hidden" name="pp" value="{vb:raw perpage}" />
				<vb:if condition="$prefix_options">
					<div class="options_input_block">
						<select name="prefixid" class="primary" id="sel_prefixid">
							<option value="" {vb:raw prefix_selected.anythread}>{vb:rawphrase any_thread_meta}</option>
							<!--
							<option value="-2" {vb:raw prefix_selected.anyprefix}>{vb:rawphrase any_prefix_meta}</option>
							<option value="-1" {vb:raw prefix_selected.none}>{vb:rawphrase no_prefix_meta}</option>
							-->
							{vb:raw prefix_options}
						</select>
						</div>
				</vb:if>
			</div></td>
			<td><div>
				<div class="options_input_block">
					<select class="primary" id="sel_daysprune" name="daysprune">
						<option value="1" {vb:raw daysprunesel.1}>{vb:rawphrase last_day}</option>
						<option value="2" {vb:raw daysprunesel.2}>{vb:rawphrase last_2_days}</option>
						<option value="7" {vb:raw daysprunesel.7}>{vb:rawphrase last_week}</option>
						<option value="10" {vb:raw daysprunesel.10}>{vb:rawphrase last_10_days}</option>
						<option value="14" {vb:raw daysprunesel.14}>{vb:rawphrase last_2_weeks}</option>
						<option value="30" {vb:raw daysprunesel.0}>{vb:rawphrase last_month}</option>
						<option value="45" {vb:raw daysprunesel.45}>{vb:rawphrase last_45_days}</option>
						<option value="60" {vb:raw daysprunesel.60}>{vb:rawphrase last_2_months}</option>
						<option value="75" {vb:raw daysprunesel.75}>{vb:rawphrase last_75_days}</option>
						<option value="100" {vb:raw daysprunesel.100}>{vb:rawphrase last_100_days}</option>
						<option value="365" {vb:raw daysprunesel.365}>{vb:rawphrase last_year}</option>
						<option value="-1" {vb:raw daysprunesel.all}>{vb:rawphrase beginning}</option>
					</select>
					</div></td>
				<td><div class="options_input_block">
					<select class="primary" id="sel_sort" name="sort">
						<option value="title" {vb:raw sort.title}>{vb:rawphrase thread_title}</option>
						<option value="lastpost" {vb:raw sort.lastpost}>{vb:rawphrase last_post_time}</option>
						<option value="dateline" {vb:raw sort.dateline}>{vb:rawphrase thread_start_time}</option>
						<option value="replycount" {vb:raw sort.replycount}>{vb:rawphrase number_of_replies}</option>
						<option value="views" {vb:raw sort.views}>{vb:rawphrase number_of_views}</option>
						<option value="postusername" {vb:raw sort.postusername}>{vb:rawphrase thread_starter}</option>
						<vb:if condition="$show['threadratings']"><option value="voteavg" {vb:raw sort.voteavg}>{vb:rawphrase thread_rating}</option></vb:if>
					</select>
					</div></td>
				<!-- Converting Radio to Dropdown -->
				<td><div class="options_input_block">
					<select class="primary" id="sel_order" name="order">
						<option value="ascending" {vb:raw order.asc}>{vb:rawphrase ascending}</option>
						<option value="descending" {vb:raw order.asc}>{vb:rawphrase descending}</option>
						</select>
					</div>
			</div></td>
			<td><div class="options_input_wrapper">
				<div class="options_input_block">
					<div class="group">
						<input type="submit" class="button" value="{vb:rawphrase show_threads}" />
					</div>
				</div>
			</div></td>
			</tr>
			</table>
	</form>
</div>

<!----   End Top Forum Display Options  ---->
6. You are done! Reload the theme and the Forum Display Option dropdowns will now be at the top.


Issues
  • The positioning isn't the greatest. I will try to see if I can make it look better.
  • The spacing between the dropdowns could be a bit further apart. I will try to fix it.

I will support this as best I can. Again, I do not know a lot of CSS or HTML.

Download Now

File Type: txt Code for Top Display Options.txt (3.8 KB, 34 views)

Screenshots

File Type: jpg Before.jpg (72.9 KB, 0 views)
File Type: jpg After.jpg (61.5 KB, 0 views)

Show Your Support

  • This modification may not be copied, reproduced or published elsewhere without author's permission.

Comments
  #2  
Old 12-08-2010, 12:01 AM
tafreeh tafreeh is offline
 
Join Date: May 2008
Location: Canada
Posts: 536
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

good one..
Question: is this gonna effect SEO ?
Reply With Quote
  #3  
Old 12-08-2010, 02:11 PM
BRimagination BRimagination is offline
 
Join Date: Sep 2010
Posts: 4
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

To be perfectly honest, I do not know and I do not have enough experience with VBulletin or SEO to answer for certain. I am still learning all the terminology and functions so please bear with me.
Reply With Quote
  #4  
Old 08-31-2011, 05:50 AM
Drache Drache is offline
 
Join Date: Aug 2004
Posts: 162
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

This code doesn't center. I mean the buttons doesn't move to center in firefox. Is there a way to fix it?
Reply With Quote
  #5  
Old 11-24-2011, 06:37 PM
maupassant maupassant is offline
 
Join Date: Feb 2009
Posts: 59
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by Drache View Post
This code doesn't center. I mean the buttons doesn't move to center in firefox. Is there a way to fix it?
Agreed, and it also doesn't work with Prefixes on.
Reply With Quote
  #6  
Old 05-28-2013, 04:26 PM
fxdigi-cash fxdigi-cash is offline
 
Join Date: Jul 2012
Posts: 674
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Thanks for the code. works great on vb.4.2 and vb.4.2.1

Update: yes, there is an issue with centering the code in FF browser...

will check to find a solution
Reply With Quote
Благодарность от:
Toorak Times
  #7  
Old 06-03-2013, 05:25 PM
hoangserip's Avatar
hoangserip hoangserip is offline
 
Join Date: Jun 2009
Posts: 101
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

thanks, good job
Reply With Quote
  #8  
Old 06-26-2013, 02:20 AM
maupassant maupassant is offline
 
Join Date: Feb 2009
Posts: 59
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Does anyone have a solution to center the code in Firefox ?
Reply With Quote
  #9  
Old 07-04-2013, 08:12 AM
fxdigi-cash fxdigi-cash is offline
 
Join Date: Jul 2012
Posts: 674
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

I made it to different way than the code above and would like to share it with you all. Thanks maupassant for the reminder...

Here is the screenshot (attached to this post) of what you will have on top of your forums...


Ok, start with opening the template forumdisplay

find:

PHP Code:
<div id="forum_options" class="forum_info_form_block"
copy the code below from :
PHP Code:
[B]<div id="forum_options" class="forum_info_form_block">
<
form> .............. 
...........
.......
</
form>
</
div>[/B
You should have this code removed, means cute it "no copy if you want to change its place to the top of the forum"...
PHP Code:
<div id="forum_options" class="forum_info_form_block">
<
form id="forum_display_options" action="{vb:raw $vboptions.vbforum_url}{vb:if "$vboptions['vbforum_url']", '/', ''}forumdisplay.php" method="get" class="forum_info_form blockbody formcontrols floatcontainer">
            <
input type="hidden" name="s" value="{vb:raw session.sessionhash}" />
            <
input type="hidden" name="f" value="{vb:raw forumid}" />
            <
input type="hidden" name="page" value="{vb:raw pagenumber}" />
            <
input type="hidden" name="pp" value="{vb:raw perpage}" />
            <
div>
                <
div class="options_input_block">
                    <
label for="sel_daysprune">{vb:rawphrase show_threads_from_the}</label>
                    <
select class="primary" id="sel_daysprune" name="daysprune">
                        <
option value="1" {vb:raw daysprunesel.1}>{vb:rawphrase last_day}</option>
                        <
option value="2" {vb:raw daysprunesel.2}>{vb:rawphrase last_2_days}</option>
                        <
option value="7" {vb:raw daysprunesel.7}>{vb:rawphrase last_week}</option>
                        <
option value="10" {vb:raw daysprunesel.10}>{vb:rawphrase last_10_days}</option>
                        <
option value="14" {vb:raw daysprunesel.14}>{vb:rawphrase last_2_weeks}</option>
                        <
option value="30" {vb:raw daysprunesel.30}>{vb:rawphrase last_month}</option>
                        <
option value="45" {vb:raw daysprunesel.45}>{vb:rawphrase last_45_days}</option>
                        <
option value="60" {vb:raw daysprunesel.60}>{vb:rawphrase last_2_months}</option>
                        <
option value="75" {vb:raw daysprunesel.75}>{vb:rawphrase last_75_days}</option>
                        <
option value="100" {vb:raw daysprunesel.100}>{vb:rawphrase last_100_days}</option>
                        <
option value="365" {vb:raw daysprunesel.365}>{vb:rawphrase last_year}</option>
                        <
option value="-1" {vb:raw daysprunesel.all}>{vb:rawphrase beginning}</option>
                    </
select>
                    <
class="description">{vb:rawphrase use_control_to_limit_threads}</p>
                </
div>
                <
div class="options_input_block">
                    <
label for="sel_sort">{vb:rawphrase sort_threads_by}</label>
                    <
select class="primary" id="sel_sort" name="sort">
                        <
option value="title" {vb:raw sort.title}>{vb:rawphrase thread_title}</option>
                        <
option value="lastpost" {vb:raw sort.lastpost}>{vb:rawphrase last_post_time}</option>
                        <
option value="dateline" {vb:raw sort.dateline}>{vb:rawphrase thread_start_time}</option>
                        <
option value="replycount" {vb:raw sort.replycount}>{vb:rawphrase number_of_replies}</option>
                        <
option value="views" {vb:raw sort.views}>{vb:rawphrase number_of_views}</option>
                        <
option value="postusername" {vb:raw sort.postusername}>{vb:rawphrase thread_starter}</option>
                        <
vb:if condition="$show['threadratings']"><option value="voteavg" {vb:raw sort.voteavg}>{vb:rawphrase thread_rating}</option></vb:if>
                    </
select>
                    <
class="description">{vb:rawphrase sort_threads_by_description}</p>
                </
div>
                <
vb:if condition="$prefix_options">
                <
div class="options_input_block">
                    <
label for="sel_prefixid">{vb:rawphrase prefix}</label>
                    <
select name="prefixid" class="primary" id="sel_prefixid">
                        <
option value="" {vb:raw prefix_selected.anythread}>{vb:rawphrase any_thread_meta}</option>
                        <
option value="-2" {vb:raw prefix_selected.anyprefix}>{vb:rawphrase any_prefix_meta}</option>
                        <
option value="-1" {vb:raw prefix_selected.none}>{vb:rawphrase no_prefix_meta}</option>
                        {
vb:raw prefix_options}
                    </
select>
                    <
class="description">{vb:rawphrase select_threads_with_prefix_description}</p>
                </
div>
                </
vb:if>
                <!-- 
Group of Radio Buttons -->
                <
div class="options_input_block">
                    <
class="label">{vb:rawphrase order_threads_in}</p>
                    <
ul class="checkradio group">
                        <
li><label for="radio_asc"><input type="radio" name="order" id="radio_asc" value="asc" {vb:raw order.asc} /> {vb:rawphrase ascending}</label></li>
                        <
li><label for="radio_dsc"><input type="radio" name="order" id="radio_dsc" value="desc" {vb:raw order.desc} /> {vb:rawphrase descending}</label></li>
                    </
ul>
                    <
class="description">{vb:rawphrase order_threads_note}</p>
                </
div>
                {
vb:raw template_hook.forumdisplay_filters}
            </
div>
            <
div class="options_input_wrapper">
                <
div class="options_input_block">
                    <
div class="group">
                        <
input type="submit" class="button" value="{vb:rawphrase show_threads}" />
                    </
div>
                </
div>
            </
div>
        </
form>
</
div
Then paste the code below this code directly here:

PHP Code:
<div id="threadpagestats" class="threadpagestats">{vb:rawphrase showing_threads_x_to_y_of_z, {vb:raw limitlower}, {vb:raw limitupper}, {vb:raw totalthreads}}</div>
    </
div>
    </
vb:if>
</
div
Save your work and you are done...

As you know that it is possible to change the radio button options to be drop menu, but I'm a little busy now so I might drop by later and do it if no one did it...

Good luck

fxdigi-cash
Attached Images
File Type: jpg search_opt.jpg (21.4 KB, 0 views)
Reply With Quote
  #10  
Old 07-04-2013, 05:21 PM
maupassant maupassant is offline
 
Join Date: Feb 2009
Posts: 59
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

O.K. You lost me right from the start. I don't have
PHP Code:
<div id="forum_options" class="forum_info_form_block"
I have
PHP Code:
<div id="forum_info_options" class="forum_info block"
Reply With Quote
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 09:52 AM.


Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2024, vBulletin Solutions Inc.
X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.05368 seconds
  • Memory Usage 2,422KB
  • Queries Executed 24 (?)
More Information
Template Usage:
  • (1)SHOWTHREAD
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (1)ad_showthread_beforeqr
  • (5)bbcode_code
  • (6)bbcode_php
  • (1)bbcode_quote
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)modsystem_post
  • (1)navbar
  • (4)navbar_link
  • (120)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (1)pagenav_pagelink
  • (10)post_thanks_box
  • (1)post_thanks_box_bit
  • (10)post_thanks_button
  • (1)post_thanks_javascript
  • (1)post_thanks_navbar_search
  • (1)post_thanks_postbit
  • (10)post_thanks_postbit_info
  • (9)postbit
  • (4)postbit_attachment
  • (10)postbit_onlinestatus
  • (10)postbit_wrapper
  • (1)spacer_close
  • (1)spacer_open
  • (1)tagbit_wrapper 

Phrase Groups Available:
  • global
  • inlinemod
  • postbit
  • posting
  • reputationlevel
  • showthread
Included Files:
  • ./showthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/functions_bigthree.php
  • ./includes/class_postbit.php
  • ./includes/class_bbcode.php
  • ./includes/functions_reputation.php
  • ./includes/functions_post_thanks.php 

Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • showthread_start
  • showthread_getinfo
  • forumjump
  • showthread_post_start
  • showthread_query_postids
  • showthread_query
  • bbcode_fetch_tags
  • bbcode_create
  • showthread_postbit_create
  • postbit_factory
  • postbit_display_start
  • post_thanks_function_post_thanks_off_start
  • post_thanks_function_post_thanks_off_end
  • post_thanks_function_fetch_thanks_start
  • fetch_musername
  • post_thanks_function_fetch_thanks_end
  • post_thanks_function_thanked_already_start
  • post_thanks_function_thanked_already_end
  • postbit_imicons
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • postbit_attachment
  • postbit_display_complete
  • post_thanks_function_can_thank_this_post_start
  • post_thanks_function_fetch_thanks_bit_start
  • post_thanks_function_show_thanks_date_start
  • post_thanks_function_show_thanks_date_end
  • post_thanks_function_fetch_thanks_bit_end
  • post_thanks_function_fetch_post_thanks_template_start
  • post_thanks_function_fetch_post_thanks_template_end
  • pagenav_page
  • pagenav_complete
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • showthread_complete