vBulletin Mods

The Official vBulletin Modifications Site
https://www.vbulletin.org/forum/showthread.php?t=312325

pace.js - smooth page loading indicator
by Dave
21 Jun 2014 19:56

1 Attachment(s)
Hi,

This mod will show a nice loading indicator on top of your forum until all elements and resources are loaded and rendered on your forum. It's also very easy to install.

1) Download the attached file and unzip it.
2) Upload the pace.min.js file to the clientscript/ folder of your forum.
3) Now go to your style manager and open the template headinclude.
4) Add the following:

Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

5) Save.
6) Go to the CSS/additional.css template and add the following:

Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

7) Save and you're done!

Tip: for more loading indicators and an easy way to set your color, go to http://github.hubspot.com/pace/docs/welcome/

All credits go to pace.js.

john7911 21 Jun 2014 22:13

Thank you very much :)

hoangserip 22 Jun 2014 04:39

Can this also be used with 3.8.X?

Dave 22 Jun 2014 11:32

Quote:

Originally Posted by hoangserip (Post 2502986)
Can this also be used with 3.8.X?

This will and should work on any version, any software, any website.

Nirjonadda 05 Jul 2014 16:51

Please can you try to make without Changing a template manually?

Dave 05 Jul 2014 17:07

Quote:

Originally Posted by Nirjonadda (Post 2505336)
Please can you try to make without Changing a template manually?

I'm not sure what you mean, the only way to add this is by modifying a template.

thetechgenius 10 Jul 2014 00:10

This works perfect! Thank you! Installed and Tagged.

You can see it working on my site: https://thetechgenius.net


Edit: You can also change the theme of the Progress Bar using CSS. Check out the themes here: http://github.hubspot.com/pace/docs/welcome/

I haven't tried to change the theme yet, but I think you just copy the css and replace it in your additional css. But like I said, im not sure since I haven't tried it yet.

Edit 2: I have just tried to change the theme, and it does work. I changed my progress bar to the Barber Theme.

Here is the CSS:


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

Change the code in RED to match the color of your Style and to your liking.

You can go to my site for a preview of the Barber Progress Bar Theme, I changed the color and the Height of my progress bar, to best match my custom style. https://thetechgenius.net

All credit goes to the OP Dave, Thank you for this simple, yet very good mod!!

thetechgenius 10 Jul 2014 00:39

Quote:

Originally Posted by Nirjonadda (Post 2505336)
Please can you try to make without Changing a template manually?

Its not hard to edit a template, and with this you don't have to "replace" any code, your just adding code. Its really just one template your editing, the other is just adding CSS to your additional.css. It takes maybe 30secs.

Dave 10 Jul 2014 09:55

I'm glad you like it. :D

Nirjonadda 13 Aug 2014 08:38

Quote:

Originally Posted by thetechgenius (Post 2506160)
Its not hard to edit a template, and with this you don't have to "replace" any code, your just adding code. Its really just one template your editing, the other is just adding CSS to your additional.css. It takes maybe 30secs.


Template/files edits are a bad, bad thing. Every time you upgrade vB you need to edit every template/files you've done edits in. That's no fun. I hate doing any manual edits to my forum because of this.

Zachery 13 Aug 2014 10:42

No, template edits are not bad.

Template edits don't get changed/removed between versions unless you go out of your way to do the,.

hazem_aliraqi 28 Apr 2015 16:03

Thank you :)


All times are GMT. The time now is 19:50.

Powered by vBulletin® Version 3.8.13
Copyright © 2019, MH Sub I, LLC dba vBulletin. All Rights Reserved. vBulletin® is a registered trademark of MH Sub I, LLC
Copyright ©2001 - , vbulletin.org. All rights reserved.