How to make changes to prosilver - background, text, line...

[acheung]

Support Request Template
What version of phpBB are you using? phpBB 3.2.7
What is your board's URL? https://www.amyc.info
Who do you host your board with? webhosting company
How did you install your board? I used the download package from phpBB.com
What is the most recent action performed on your board? Update from a previous version of phpBB3
Is registration required to reproduce this issue? No
Do you have any MODs installed? No
Do you have any extensions installed? No
What version of phpBB3 did you update from? phpBB 3.2.2
What styles do you currently have installed? prosilver
What language(s) is your board currently using? chinese (traditional)
Which database type/version are you using? I Don't Know
What is your level of experience? New to PHP and phpBB
What actions did you take (updating your board; installing a MOD, style or extension; etc.) prior to this problem becoming noticeable? No answer given
Please describe your problem. Please understand that English is not my mother tongue.

I want to make some changes to the outlook of my prosilver forum(www.amyc.info) to simple white background with all the "tables" in green-coloured lines. Although I have been using phpbb for over ten years uploading posts, I am not good at changing the layout and I do not know the proper names for the "tables" or files I need to make changes to.

Please help.
Generated by SRT Generator

[Lumpy Burgertushie]

you will need to create a custom style.

make a copy of the prosilver folder.
rename it. open the folder and then open the file style.cfg in your text editor.
change the prosilver to whatever you named the folder.

now, upload that folder to the styles folder on the server and then go to the admin panel, customize tab and install that new style.


now, you would be editing mostly the css files found in the folder named "theme".
you will make the edits and then upload the file to the server to overwrite the one there.
then purge the cache to see the changes.

your best best would be to check the styles database here to see if you can find one that you like instead of creating a new one and trying to make it the way you want.
https://www.phpbb.com/customise/db/styl ... r/demo/3.2

robert

[vader696]

You can use this tool. Works fine with 3.2.x prosilver style Just set up you style and use Colorize My Files (will be added info to footer)

https://www.colorizeit.com/styles/phpbb ... ilver.html

[acheung]

I used the pointer to point out the areas that I do not know their proper names and how I would like to modify them.
Grateful if you may point me to the right direction. Thank you.

[warmweer]

I used the pointer to point out the areas that I do not know their proper names and how I would like to modify them.
Grateful if you may point me to the right direction. Thank you.

Use the webtools provided by your browser to identify the areas you want to edit. There is also a style editor in most browsers allowing you to test some changes without actually modifying the files.

[Lumpy Burgertushie]

yes, I forgot to mention the browser tools. right click on whatever you want to change on the page.
choose inspect element or whateverr your browser calls its tools.
a popup will show you the html and the css for that particular element of the page.
the css will tell you exactly what css file and what line number to find that on. you can also make changed directly in the tool popup and instantly see if it does what you want. if you are satisfied then you go download that file from the server to your computer, open it in a good text editor and make your changes. then upload back to the server.
you should probably go to your board admin panel and click on the load settings in the left menu. then find "Recompile stale style components:" and set that to yes.
then submit and then refresh your browser.

now, each change will be shown as soom as you upload the edited file and refresh your browser.
you will not have to purge the cache every time you make a change.


robert

[acheung]

I would like to change the blue bar to white and the text inside the bar to green.
As advised, I right clicked the blue bar and the above Inspect screen shown. By reading the highlighted line I circled in red, I do not know which file(s) I should change. Is there something I missed? Please help.

[Lumpy Burgertushie]

on the html page look up a little and you will see this line: div class="forabg">
highlite that line then look in the other box which has the css in it.
you will notice that there are a bunch of check boxes that have blue colors in them.

if you uncheck all those boxes you will notice that all the blue colors and background images are removed.

you are probably going to want a think border around that section so you might try adding that to the same place.

you will also see that that css is on line 99 of colours.css

so, you download that file from the folder named theme to your computer, use your text editor to open it and find line 99
replace it with something like this:
.forabg {
background-color: #fff;
border: 1px green;
}

assuming you want to change all the text on the board to green, in that same colours.css file look at the very top of the file for
html, body {
color: #536482;
background-color: #F5F7FA;
}
change color to whatever the hex code is for the shade of green you want. you can try this shade of green: #40BF00
you can also change the background-color to whatever you want as well.


robert

[acheung]

Robert,
Thank you for your help.
I used the Inspect tools to check the changes and found that the text failed to show after changing all colours in forabg to #FFFFFF. May I know which file and key words to look for to make changes to show the text again?

[Lumpy Burgertushie]

what is the name of your new style so I can go see the files?

did you change all the font color to green as suggested?

if so, try this:
html, body {
color: #536482 !important;
background-color: #F5F7FA;
}

[Lumpy Burgertushie]

ok, I gave you some wrong information there. the green color you need is #618253

you need to change it here:
all of this is in the colours.css file for your new style.

Code: Select all

html, body {
	color: #618253 !important;

and here:

Code: Select all

a { color: #105289; }

and here:

Code: Select all

.forumbg .header a, .forabg .header a, th a {
	color: #618253;
}

and here:

Code: Select all

.forabg {
	
	border: 5px solid #618253;
}

there may be other places as well.
that should get you close.

robert