Emps-World Forum

Emps-World => Guides => Topic started by: Tulrak on May 05, 2017, 09:43:35 pm

Title: How to fix forum.
Post by: Tulrak on May 05, 2017, 09:43:35 pm
Introduction
This is a guide for anyone who despises changes.
I'm not an expert at any of this, so these solutions will be really basic and inflexible.


Requirements:
A modern browser that supports uBlock Origin (Chrome (https://chrome.google.com/webstore/detail/ublock-origin/cjpalhdlnbpafiamejdnhcphjbkeiagm), Firefox (https://addons.mozilla.org/en-US/firefox/addon/ublock-origin/), Opera (https://addons.opera.com/en/extensions/details/ublock/), Edge (https://www.microsoft.com/en-us/store/p/app/9nblggh444l4?rtc=1)) and Stylus(Chrome (https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne), Firefox (https://addons.mozilla.org/en-US/firefox/addon/styl-us/), Opera (https://addons.opera.com/en/extensions/details/stylus/)) extensions.
This guide shows how to fix the forum on Chrome, setting everything up may be different in other browsers.


How To Remove New Emotes
Change:
There are some new emotes. That definitely counts as a change and can't be tolerated.

This is what the problem looks like:
(https://i.imgur.com/9niPM7U.png)

What you'll be creating:
(https://i.imgur.com/SJEBdgg.png)

Requirements:
uBlock Origin browser extension (Chrome (https://chrome.google.com/webstore/detail/ublock-origin/cjpalhdlnbpafiamejdnhcphjbkeiagm), Firefox (https://addons.mozilla.org/en-US/firefox/addon/ublock-origin/), Opera (https://addons.opera.com/en/extensions/details/ublock/), Edge (https://www.microsoft.com/en-us/store/p/app/9nblggh444l4?rtc=1))

Step 1:
Click on the uBlock Origin icon.
(https://i.imgur.com/kx5rpJ8.png)
Click on "Open the dashboard".
(https://i.imgur.com/NUfv9u7.png)
Click on "My filters".
(https://i.imgur.com/4MERJnP.png)

Step 2:
Enter this text:
Code: [Select]
||emps-world.net/forum/Smileys/default/*.png(https://i.imgur.com/2qZMO6S.png)

Step 3:
Apply changes.
(https://i.imgur.com/xPJJWJe.png)

Step 4:
Refresh the forum page to apply filter to shoutbox.
(https://i.imgur.com/SJEBdgg.png)

Fixed!


How To Remove Discord
Change:
There's a new thing next to Shoutbox.

This is what the problem looks like:
(https://i.imgur.com/emcNT4N.png)

What you'll be creating:
(https://i.imgur.com/A0aLXJ4.png)

Requirements:
uBlock Origin browser extension (Chrome (https://chrome.google.com/webstore/detail/ublock-origin/cjpalhdlnbpafiamejdnhcphjbkeiagm), Firefox (https://addons.mozilla.org/en-US/firefox/addon/ublock-origin/), Opera (https://addons.opera.com/en/extensions/details/ublock/), Edge (https://www.microsoft.com/en-us/store/p/app/9nblggh444l4?rtc=1))

Step 1:
Click on the uBlock Origin icon.
(https://i.imgur.com/kx5rpJ8.png)
Click on "Enter element picker mode".
(https://i.imgur.com/IJF7Czf.png)

Step 2:
Select the new thing.
(https://i.imgur.com/jvrGUN0.png)
Select "Create" in the window that pops up.
(https://i.imgur.com/glSMb0q.png)

(https://i.imgur.com/A0aLXJ4.png)

Fixed... but it still looks different, so continue with the Shoutbox Width Fix.


How To Increase Shoutbox Width
Change:
Shoutbox width was changed to 75% of what it was before.

This is what the problem looks like:
(https://i.imgur.com/A0aLXJ4.png)

What you'll be creating:
(https://i.imgur.com/HQHmvbL.png)

Requirements:
Discord element has been blocked (follow previous part of the guide).
Stylus browser extension(Chrome (https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne), Firefox (https://addons.mozilla.org/en-US/firefox/addon/styl-us/), Opera (https://addons.opera.com/en/extensions/details/stylus/)).

Step 1:
Click on the Stylus icon in the toolbar.
(https://i.imgur.com/IJecmwB.png)
Choose "Manage".
(https://i.imgur.com/yrbFoUP.png)
Click on "Write New Style"
(https://i.imgur.com/y8hLDlm.png)

Step 2:
Fill the page following these three steps:
1. Copy and paste this into Code 1:
Code: [Select]
#shoutbox {
    width: calc(100%/0.75);
}

2. Make sure that the rule applies to "URLs on the domain" and
Code: [Select]
emps-world.net
3. Give your style a name, make sure that "enabled" is ticked and then click Save.
(https://i.imgur.com/kk2vpBO.png)


(https://i.imgur.com/HQHmvbL.png)

Fixed!


How To Fix Avatars
Change:
Some avatars are huge.

This is what the problem looks like:
(https://i.imgur.com/yxBAuUQ.png)

What you'll be creating:
(https://i.imgur.com/iiiyqAA.png)

Requirements:
Stylus browser extension(Chrome (https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne), Firefox (https://addons.mozilla.org/en-US/firefox/addon/styl-us/), Opera (https://addons.opera.com/en/extensions/details/stylus/)).

Step 1:
Click on the Stylus icon in the toolbar.
(https://i.imgur.com/IJecmwB.png)
Edit the style created in the Shoutbox Width Fix (or create a new style if you'd like).
(https://i.imgur.com/DFi2YzN.png)

Step 2:
Copy and Paste this at the end of Code 1.
Code: [Select]
.avatar {
    max-height: 100px;
    max-width: 100px;
}
(https://i.imgur.com/fI9kQt3.png)
Make sure that the style applies to "URLs on the domain" and
Code: [Select]
emps-world.net(https://i.imgur.com/mesCLsu.png)
Make sure that the style has a name, that Enabled is ticked and press Save.
(https://i.imgur.com/hj2qCT6.png)


(https://i.imgur.com/iiiyqAA.png)

Fixed!


How To Fix Spoiler Color
(for Bright Forest theme)
What spoilers look like:
(https://i.imgur.com/f7clKYQ.png)

Here's how to change the colors into this:
(https://i.imgur.com/FglUfq3.png)

Step 1:
Open the Stylus Theme that you created (or if you haven't then you can find out how to do so in other sections of the guide).

Step 2:
Paste this at the end of Code 1 and then save the theme:
Code: [Select]
div[class^='sp-wrap'] {
background-color: #dbe8b8;
border-left: 1px solid #999;
border-right: 1px solid #999;
-webkit-border-radius: 3;
-moz-border-radius: 3;
border-radius: 3px;
}
div[class^='sp-wrap'] div[class^='sp-body'] {
    background-color: #e9f1d5;
}

(https://i.imgur.com/Rk8KLQE.png)

What spoilers are changed to:
(https://i.imgur.com/FglUfq3.png)

Fixed!


Other Fixes

How To Fix Voting
What's this about?
Would you like to vote but don't like how much effort it takes to open the voting sites one by one? Wouldn't it be nicer if you could just click a bookmark, log in, click the same bookmark again and have it open all the voting sites on which you haven't voted yet?

What you'll be creating:
(https://i.imgur.com/YKb7afq.gif)

Step 1:
Create a new bookmark. In Chrome you can just right-click on the bookmarks bar and select "Add page..."
(https://i.imgur.com/t858v1K.png)
Give it a name, save it to bookmarks bar and change the URL to this:
Code: [Select]
javascript:{if(window.location.href=='https://emps-world.net/vote'){el=document.querySelectorAll("[src='./img/attention.png']");for(var i=0;i<el.length;i++){el[i].click();};}else{window.location.href='https://emps-world.net/vote';}};void(0);(https://i.imgur.com/7AL9Cqa.png)

Step 2:
Click the bookmark, log in (if not already logged in), click it again and then you're on your own.
(https://i.imgur.com/YKb7afq.gif)

Now vote!
Title: Re: How to fix forum.
Post by: Charr on May 05, 2017, 10:20:41 pm
God bless.
Title: Re: How to fix forum.
Post by: Someone12116 on May 05, 2017, 10:28:06 pm
Blasphemy
Title: Re: How to fix forum.
Post by: Thomy on May 06, 2017, 06:25:19 am
Is the Discord window really such a big issue? If so, I'll create a button to hide it.
Title: Re: How to fix forum.
Post by: Mary on May 06, 2017, 08:17:17 am
Is the Discord window really such a big issue? If so, I'll create a button to hide it.
considering many people have a discord already and use their services to switch between servers and chat, why add an element for it. The element would only be useful for those that only have/choose emps as discord server, which there is few of.
Title: Re: How to fix forum.
Post by: Tulrak on May 06, 2017, 08:54:45 am
Is the Discord window really such a big issue? If so, I'll create a button to hide it.

Every change is a big issue.

The button would be nice as long as Discord stays hidden and the width of the shoutbox goes back to 100%.
People were already hiding Discord before I even saw it, so fixing the width is the more important part.
Title: Re: How to fix forum.
Post by: Tulrak on May 15, 2017, 09:50:33 pm
Update:
Shoutbox width was changed from 70% of original to 75% meaning that the old shoutbox width fix increases its width too much, if you followed the guide before May 15th, 2017 then the shoutbox wouldn't line up perfectly with the rest of the forum anymore. Basically if the shoutbox looks like this (https://i.imgur.com/DOMMSch.png) then you're good and don't have to worry about this update but if it goes off the screen like this (https://i.imgur.com/X502LEG.png) then you need to redo the last step in the guide and replace the old code with the new one (the only difference is that you now divide by 0.75 instead of 0.7, so don't skip it simply because it looks similar, most of it is the same, but if the shoutbox goes off the screen then this is where the problem is).
Title: Re: How to fix forum.
Post by: Tulrak on December 09, 2017, 02:46:31 pm
Change: Added a fix for huge avatars.

P.S. Don't mind the triple-post, I wanted to bump the thread due to changes.
Title: Re: How to fix forum.
Post by: Thomy on December 11, 2017, 08:13:38 am
Actually that 'fix' is now obsolete. Avatars wouldn't resize because of a php module missing after a webserver update. Should be fine now. ;)
Title: Re: How to fix forum.
Post by: Tulrak on December 11, 2017, 08:59:46 am
Actually that 'fix' is now obsolete. Avatars wouldn't resize because of a php module missing after a webserver update. Should be fine now. ;)

I figured that it was a bug that would be fixed, but patience is overrated. I'll remove it from the guide now, thanks for proper fix.
Title: Re: How to fix forum.
Post by: Tulrak on December 18, 2017, 12:29:54 am
Actually that 'fix' is now obsolete. Avatars wouldn't resize because of a php module missing after a webserver update. Should be fine now. ;)

https://emps-world.net/forum/index.php?action=profile;u=10966 (https://emps-world.net/forum/index.php?action=profile;u=10966)
His is still so big (https://i.imgur.com/yxBAuUQ.png) :'(
Is that intentional? Sowwy for double post again, needed to ask.

Also re-added it into the guide because it's either intentional which makes it a change or it's a bug and the 'fix' provides a half-assed solution that doesn't require patience.
Title: Re: How to fix forum.
Post by: Bluestorm on January 07, 2018, 10:27:55 pm
Any staff member pin this topic please.
Title: Re: How to fix forum.
Post by: Tulrak on March 16, 2018, 12:21:39 am
We have spoilers, they're gray, even if you're using a green theme... I added a section to the guide that changes the background color of the spoilers to green, so that it looks a bit better in the only forum theme that matters.

Update (June 05, 2018):
Added a fix that makes voting easier.
Voting
[close]

Update (June 16, 2018):
Added a fix that makes comparison in Highscores better.
Highscores Comparison
[close]
Title: Re: How to fix forum.
Post by: Tulrak on July 28, 2018, 05:01:50 am
Stylish was sold to some scumbags that are now using it to track your whole browsing history or something like that, which means that Chrome and Firefox blocked it. So uninstall Stylish, replace it with Stylus(Chrome (https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne), Firefox (https://addons.mozilla.org/en-US/firefox/addon/styl-us/), Opera (https://addons.opera.com/en/extensions/details/stylus/)) and then repeat the steps that used Stylish but now do them in Stylus.

Updated the guide from Stylish to Stylus as well.