Closed PHC Site Mods & Plugins

[nogats07]

Make PHC your own!
This tutorial will teach you to modify phc's theme and apply your own style and mods using css or javascript!

Setup Guide:
1. The first thing you need to do is download this chrome extension: You do not have permission to view the full content of this post. Log in or register now.
2. Now while on phcorner site, click the extension button then click the phcorner styles and scripts tab, apply the options below:

3. Now you are ready to apply custom mods & plugins using css or javascript!

Basic css and javascript knowledge required!

Demo (Akatsuki Clouds Mod):

User Contributed Mods & Plugins (Click the link to view):

1. Akatsuki Clouds Mod (Instructions)
2. Thin Scrollbars Mod (Instructions)
3. Hide Ads Mod (Instructions)

Submit mods & plugins:
Please follow the format below, and reply your tutorial in this thread. It will be added to the official list once verified.

Sample format

Name: [Mod Name Here]
Description: [Mod Description Here]
Author: [Mod Author Here]
Screenshot: [Preview Image Here]
Steps:
  1. Step one here
   Code:
   [Code here]
  2. Step two here
   Code:
   [Code here]

 

[nogats07]

Name: Akatsuki Moving Clouds Mod
Description: Floating akatsuki clouds mod
Author: nogats07
Screenshot:

Steps:
1. Add the following javascript code in the left code editor:
Code:

$("body").prepend("<div id='akatsuki'><div class='akatsuki cloud1' /><div class='akatsuki cloud2' /> <div class='akatsuki cloud3' /><div class='akatsuki cloud4' /><div class='akatsuki cloud5' /></ div>");

2. Add the following css code in the right code editor at the bottom of it:
Code:

#akatsuki{
position: absolute;
width:100%;
margin-top: 0px;
height: 0px;
z-index: 100;
}
.akatsuki {
width: 200px;
height: 138px;
background: url("https://i.ibb.co/F7m3k4r/Untitled-1.png") no-repeat top center;
position: relative;
}
.cloud1 {
-webkit-animation: moveclouds2 15s linear infinite;
-moz-animation: moveclouds2 15s linear infinite;
-o-animation: moveclouds2 15s linear infinite;
}
.cloud2 {
left: 200px;
-webkit-transform: scale(0.6);
-moz-transform: scale(0.6);
transform: scale(0.6);
opacity: 0.6;
-webkit-animation: moveclouds2 25s linear infinite;
-moz-animation: moveclouds2 25s linear infinite;
-o-animation: moveclouds2 25s linear infinite;
}
.cloud3 {
left: -250px;
top: -200px;
-webkit-transform: scale(0.8);
-moz-transform: scale(0.8);
transform: scale(0.8);
opacity: 0.8;
-webkit-animation: moveclouds2 20s linear infinite;
-moz-animation: moveclouds2 20s linear infinite;
-o-animation: moveclouds2 20s linear infinite;
}
.cloud4 {
left: 470px;
top: -250px;
-webkit-transform: scale(0.75);
-moz-transform: scale(0.75);
transform: scale(0.75);
opacity: 0.75;
-webkit-animation: moveclouds2 18s linear infinite;
-moz-animation: moveclouds2 18s linear infinite;
-o-animation: moveclouds2 18s linear infinite;
}
.cloud5 {
left: -150px;
top: -150px;
-webkit-transform: scale(0.8);
-moz-transform: scale(0.8);
transform: scale(0.8);
opacity: 0.8;
-webkit-animation: moveclouds2 20s linear infinite;
-moz-animation: moveclouds2 20s linear infinite;
-o-animation: moveclouds2 20s linear infinite;
}
@-webkit-keyframes moveclouds2 {
0% {
margin-left: 2000px;
}
100% {
margin-left: -1000px;
}
}
@-moz-keyframes moveclouds2 {
0% {
margin-left: 2000px;
}
100% {
margin-left: -1000px;
}
}
@-o-keyframes moveclouds2 {
0% {
margin-left: 2000px;
}
100% {
margin-left: -1000px;
}
}

3. Click save and refresh mobilarian page!

 

[Licht Bach]

Nice paps,pero mas nice kung merong sariling app ang Phc

 

[nogats07]

Nice paps,pero mas nice kung merong sariling app ang Phc

Modding thread lang to at hindi tungkol sa app. Pampaganda lang ng site.

 

[nogats07]

Name: Thin Scrollbars Mod
Description: Make the scrollbars thin
Author: nogats07
Screenshot: None

Steps:
1. Add the following css code in the right code editor at the bottom of it:
Code:

::-webkit-scrollbar {
width: 2px;
height: 2px;
}
::-webkit-scrollbar-button {
width: 0px;
height: 0px;
}
::-webkit-scrollbar-thumb {
background: #e1e1e1;
border: 0px none #ffffff;
border-radius: 50px;
}
::-webkit-scrollbar-thumb:hover {
background: #ffffff;
}
::-webkit-scrollbar-thumb:active {
background: #000000;
}
::-webkit-scrollbar-track {
background: #666666;
border: 0px none #ffffff;
border-radius: 50px;
}
::-webkit-scrollbar-track:hover {
background: #666666;
}
::-webkit-scrollbar-track:active {
background: #333333;
}
::-webkit-scrollbar-corner {
background: transparent;
}

2. Click save and refresh mobilarian page!

 

[Eyes Cream]

Galing galing TS salamat ieexplore ko to

 

[nogats07]

Akatsuki clouds mod updated!

 

[nogats07]

Name: Hide Ads Mod
Description: Hide PHC Banner Ads while allowing the site to still earn from it
Author: nogats07
Screenshot: None

Steps:
1. Add the following css code in the right code editor at the bottom of it:
Code:

.ads-container-hf {
    display: none;
}

2. Click save and refresh mobilarian page!

 

[The_killer 01]

nice thread ts.

 

[Jmrie_]

p

Name: Hide Ads Mod
Description: Hide PHC Banner Ads while allowing the site to still earn from it
Author: nogats07
Screenshot: None

Steps:
1. Add the following css code in the right code editor at the bottom of it:
Code:

.ads-container-hf {
    display: none;
}

2. Click save and refresh phcorner page!

ang p.c lang ba ito?

 

[nogats07]

p

ang p.c lang ba ito?

Sa ngayon di pa gumagana chrome extensions sa android version ng chrome kaya oo pang pc lang ito for now.

 

[Jmrie_]

Sa ngayon di pa gumagana chrome extensions sa android version ng chrome kaya oo pang pc lang ito for now.

sana magkaroon ng mobile soon

 

[Nontikweed]

Mobile app please

 

[nogats07]

Mobile app please

Di na kailangan ng mobile app ng phc, fully responsive naman yung buong site.

 

[Nontikweed]

Di na kailangan ng mobile app ng phc, fully responsive naman yung buong site.

Nagfreeze kasi sakin kahet 4gb ram cp ko

 

[nogats07]

Nagfreeze kasi sakin kahet 4gb ram cp ko

Kapag browsing, hindi yun nakadepend sa ram, sa processor yun.

 

[unoemillo]

Tama si kuys nogats07 di na need ng mobile app si phc btw web developer ka?

 

[Arcturus]

Nagfreeze kasi sakin kahet 4gb ram cp ko

try mong gumamit ng light browser mam/sir

 

[Arcturus]

Kapag browsing, hindi yun nakadepend sa ram, sa processor yun.

paps, marami pa bang ibang design?
di ko kasi trip ang akatsuki hehe
anyways, Thanks sa magandang tutorial