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

Reply
 
Thread Tools
To-the-top button in postbit footer. Details »»
To-the-top button in postbit footer.
Version: 1.01, by trilOByte trilOByte is offline
Developer Last Online: Sep 2013 Show Printable Version Email this Page

Category: Miscellaneous Hacks - Version: 4.0.2 Rating:
Released: 02-09-2010 Last Update: 02-10-2010 Installs: 134
Template Edits
Re-useable Code  
No support by the author.

This simple mod does what is says on the tin, it adds a Top button in the postbit footer using the vBulletin 4.0.2 css convention for mouseover buttons.

Note: This mod is NOT compatible with vBulletin 4.0.1 or earlier.



This is a mod I've always used because, as simple as it may be, a Top button in the bottom right of each postbit, can dramatically speed up the navigation of your site. No more spinning that mouse wheel trying to get back to the menus.

There are...
1x addition to the postbit.css template
1x addition to the posbit (and/or postbit_legacy) template
2x images to upload

INSTRUCTIONS:
1x additions to he posbit.css template
Go to..
Styles & Templates>Stlye Manager>your skin>edit templates>CSS templates>postbit.css
----------------------------------------------------------------------
Find (search for "multiquote"):
HTML Code:
.postbitlegacy .postfoot .textcontrols a.multiquote, .postbit .postfoot .textcontrols a.multiquote  {
	background: url({vb:stylevar imgdir_button}/multiquote-back_40b.png) no-repeat transparent {vb:stylevar left};
	padding-{vb:stylevar left}: 20px;
}
.postbitlegacy .postfoot .textcontrols a.multiquote:hover, .postbit .postfoot .textcontrols a.multiquote:hover  {
	background: url({vb:stylevar imgdir_button}/multiquote_40b-hover.png) no-repeat transparent {vb:stylevar left};
	padding-{vb:stylevar left}: 20px;
}
Under that, put:
HTML Code:
.postbitlegacy .postfoot .textcontrols a.tothetop, .postbit .postfoot .textcontrols a.tothetop  {
	background: url({vb:stylevar imgdir_button}/tothetop_40b.png) no-repeat transparent {vb:stylevar left};
	padding-{vb:stylevar left}: 20px;
}
.postbitlegacy .postfoot .textcontrols a.tothetop:hover, .postbit .postfoot .textcontrols a.tothetop:hover  {
	background: url({vb:stylevar imgdir_button}/tothetop_40b-hover.png) no-repeat transparent {vb:stylevar left};
	padding-{vb:stylevar left}: 20px;
}
----------------------------------------------------------------------
Click "save".

1x addition to the posbit (and/or postbit_legacy) template:
Now navigate to..
Styles & Templates>Stlye Manager>your skin>edit templates>postbit templates>postbit
----------------------------------------------------------------------
Find (search for "multiquote"):
HTML Code:
<vb:if condition="$show['multiquote_post']">
					<a class='multiquote' href="{vb:raw post.replylink}" rel="nofollow" onclick="return false;" 

id="mq_{vb:raw post.postid}"><img id="mq_image_{vb:raw post.postid}" src="{vb:stylevar imgdir_button}/trans_40b.png" 

alt="{vb:rawphrase multi_quote_this_message}" />&nbsp;</a>
				</vb:if>
Under that, put:
HTML Code:
<!-- ////////start To-The-Top button in postbit////// -->
<span class="seperator">&nbsp;</span><a class='tothetop' href="{vb:raw relpath}#top" onclick="self.scrollTo(0, 0); return false;"><img src="{vb:raw vboptions.cleargifurl}" alt="...to the top" />{vb:rawphrase top}</a>
<!-- ////////end To-The-Top button in postbit////// -->
----------------------------------------------------------------------
Click "save".

2x images to upload:
FTP into your forum/images/buttons dir and upload these two attached images:
----------------------------------------------------------------------
tothetop_40b.png
tothetop_40b-hover.png
----------------------------------------------------------------------

That's it.

Download Now

File Type: zip top_button_images.zip (654 Bytes, 480 views)

Show Your Support

  • This modification may not be copied, reproduced or published elsewhere without author's permission.
2 благодарности(ей) от:
zascok

Comments
  #2  
Old 02-10-2010, 07:06 PM
trilOByte's Avatar
trilOByte trilOByte is offline
 
Join Date: Nov 2001
Location: England
Posts: 325
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Arrow Images:
You can use whatever arrow images you like, but make sure they have transparent backgrounds and save them as transparent .png files and ....be very careful about changing the image file names (see below).

Some things about css function:
In vB 4.0.1, all the rollover images in the postbit footer pointed to "/trans_40b.png". The upgrade to 4.0.2 has seen some changes to the css and now all the buttons point to..

HTML Code:
src="{vb:raw vboptions.cleargifurl}"
The clear.gif acts as a hook or transparent "wrapper" usually in the root dir - do not edit, move or delete it or you will break all of the rollover images. The actual image names are defined in the postbit.css template ONLY. Also, whatever images you use, they should follow the naming convention...

*********_40_b.png (the image displayed under normal circumstances)
*********_40b-hover.png (the image displayed on mouseover)

If you use different image names than those I've supplied, or are using this as the basis for other button mods, then make sure your choice of image names is reflected in the postbit.css template. In the postbit itself, all the buttons should point to src="{vb:raw vboptions.cleargifurl}".

This can be used as the basis for any css button mod in the postbit foot and follows the vB4* css conventions. It should make things like adding a "Send PM" button pretty straightforward.
Reply With Quote
  #3  
Old 02-10-2010, 07:12 PM
KEKforce KEKforce is offline
 
Join Date: Feb 2007
Location: Holland
Posts: 91
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Top
Reply With Quote
  #4  
Old 02-10-2010, 07:55 PM
cbiweb cbiweb is offline
 
Join Date: May 2004
Location: Nova Scotia, Canada
Posts: 238
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Ginormous kudos to you for this mod! I tried adding some custom buttons to the postbit myself, and decided to come back to it when I had time to sort it out. Thank the code gods you did all the work for me!
Reply With Quote
  #5  
Old 02-10-2010, 08:11 PM
trilOByte's Avatar
trilOByte trilOByte is offline
 
Join Date: Nov 2001
Location: England
Posts: 325
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by cbiweb View Post
Ginormous kudos to you for this mod! I tried adding some custom buttons to the postbit myself, and decided to come back to it when I had time to sort it out. Thank the code gods you did all the work for me!
Lynne did most of the work in the end, but you're welcome. Half the battle is getting your head round the logic. Once that is known and understood, it's pretty simple.
Reply With Quote
  #6  
Old 02-13-2010, 06:40 PM
Front Range 4x4 Front Range 4x4 is offline
 
Join Date: Jan 2009
Posts: 318
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Thanks you, excellent & installed!
Reply With Quote
  #7  
Old 02-14-2010, 09:53 AM
OturanBoğa OturanBoğa is offline
 
Join Date: Nov 2008
Location: Istanbul
Posts: 24
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Thank you
Reply With Quote
  #8  
Old 02-14-2010, 05:16 PM
trilOByte's Avatar
trilOByte trilOByte is offline
 
Join Date: Nov 2001
Location: England
Posts: 325
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Welcome fellas.
Reply With Quote
  #9  
Old 02-17-2010, 05:06 AM
Jabong82 Jabong82 is offline
 
Join Date: Feb 2010
Posts: 304
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Installed!

I have a question though.

Is this "Top" only supposed to appear next to the multi-quote icon on the lower right hand side of the post?

I'm asking because I only have the word "Top" there with no arrow. Is there supposed to be another symbol in the actual Postbit_Legacy itself?

Thanks in advance.
Reply With Quote
  #10  
Old 02-17-2010, 11:05 AM
trilOByte's Avatar
trilOByte trilOByte is offline
 
Join Date: Nov 2001
Location: England
Posts: 325
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Yes, there is a rollover "arrow" that turns pale blue on mouseover. Did you upload the images from the zip file to your /images/buttons/ directory?
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 01:14 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.06647 seconds
  • Memory Usage 2,329KB
  • 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_html
  • (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
  • (2)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
  • (1)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
  • 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
  • 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
  • pagenav_page
  • pagenav_complete
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • showthread_complete