vb.org Archive - Miscellaneous Hacks - To-the-top button in postbit footer.

vb.org Archive (https://vborg.vbsupport.ru/index.php)

- vBulletin 4.x Template Modifications (https://vborg.vbsupport.ru/forumdisplay.php?f=246)

- - Miscellaneous Hacks - To-the-top button in postbit footer. (https://vborg.vbsupport.ru/showthread.php?t=235530)

To-the-top button in postbit footer.

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.

https://vborg.vbsupport.ru/external/2010/02/39.jpg

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.

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.

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! :p

Quote:

Originally Posted by cbiweb (Post 1979429)

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.

Thanks you, excellent & installed!

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.

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?

X vBulletin 3.8.12 by vBS Debug Information
Template Usage: (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (5)bbcode_html_printable (1)bbcode_quote_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)pagenav (1)pagenav_curpage (2)pagenav_pagelink (1)post_thanks_navbar_search (1)printthread (10)printthreadbit (1)spacer_close (1)spacer_open Phrase Groups Available: global postbit showthread	Included Files: ./printthread.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/class_bbcode_alt.php ./includes/class_bbcode.php ./includes/functions_bigthree.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 printthread_start pagenav_page pagenav_complete bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages:

Phrase Groups Available:

X vBulletin 3.8.12 by vBS Debug Information
Page Generation 0.01167 seconds Memory Usage 1,751KB Queries Executed 10 (?)
More Information
Template Usage: (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (5)bbcode_html_printable (1)bbcode_quote_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)pagenav (1)pagenav_curpage (2)pagenav_pagelink (1)post_thanks_navbar_search (1)printthread (10)printthreadbit (1)spacer_close (1)spacer_open Phrase Groups Available: global postbit showthread	Included Files: ./printthread.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/class_bbcode_alt.php ./includes/class_bbcode.php ./includes/functions_bigthree.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 printthread_start pagenav_page pagenav_complete bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages: