Custom colour

The template comes with

Orange/blue/green/brown/orange/pink

Can you create a custom colour, I was wanting the colour to match my logo and my boxing forums colours to tie in more. http://ringnews24.com/boxingforum

Hi,
please read this topic about adding new color style for restaurant template. For news is very similar https://www.gavick.com/forums/restauran ... or#p109754

Thanks for the reply Konrad

and finally - style the #gkColor4 element in the template.css file (of course if you will use this option).

Please remember to create also:

css/typography/typography.iconset.style4.css
css/typography/typography.style4.css

files.

I think I understand until it gets to the part i quoted. Could you explain more please.

Also how do you turn off the colour switcher?

Thanks

About first part. Well if you look at style switcher you will see six dots. And if you want to add one more in style switcher you will need to style new dot for one more style in template.css.
And in second part, @dziudek means that each style has own typography style rules located in

Code: Select all

css/typography/typography.iconset.styleX.css
css/typography/typography.styleX.css


so if you are making new style color you have to define rules for typo too. Best way is copy files from one style and edit them. But in your case if you don't want to use style switcher you can just edit one of style to fit your needs and set it as default one in template settings.
To remove style switcher just go to template settings. You can disable it in 'Features' section.

I turned off the style switcher and edited css/typography/typography.styleX.css.

I changed to Orange colour code to red but nothing changed on the front page.

I checked the options as the default is set to colour code 1 which i changed to red.

Did you set color style where you edit styleX.css file as default in template settings ?

Yeah I did that Konrad.

Please send me Private Message with access to your joomla backend and ftp details. Remember add link to this topic too.

PM sent Konrad

I checked your website and you didn't edit style1.css file or you didn't change all orange values to red one. So this is the reason why on home page you have still orange. For example:

Code: Select all

.nsphover .nspHoverOverlay {
background: #e25b32;
}


please check this file and change all #e25b32 to code of your red color.

I did change them but they didnt change the colour on the front page so I changed them back to the original colour code.

I will try again.

I tried again and replaced all the #e25b32 with #AA1A1A inside file typography.style1

Nothing has changed.

http://ringnews24.com/joomlatest2/

You also need to edit \news\templates\gk_news\css\style1.css file.

You also need to edit \news\templates\gk_news\css\style1.css file.

That worked Konrad thanks, a few bits are shown as orange though.

http://ringnews24.com/joomlatest2/


The 'Top image' is orange.

Under Readers Articles is orange.

When I hover my mouse over words they show as orange.

'Popular image' is blue



Thanks Konrad.

Are you using cache plugin ? If yes remember to clear it after you make changes.

No cache plug in is enabled.

I see that colors from css are correct now. One thing more you have to do is check images located in images/style1/ and change colors to red one like fro example for this one http://ringnews24.com/joomlatest2/templ ... ght_bg.png

I see that colors from css are correct now. One thing more you have to do is check images located in images/style1/ and change colors to red one like fro example for this one http://ringnews24.com/joomlatest2/templ ... ght_bg.png

Thanks I got the image changed http://ringnews24.com/joomlatest2/

---

When I hover over the article headings some are orange and some are red, how do I change them to all be red?

Thanks I got the image changed http://ringnews24.com/joomlatest2/

---

When I hover over the article headings some are orange and some are red, how do I change them to all be red?

---

Also i changed the image colours in the style1 folder but not all of them are replacing the default images. How can I sort this?

Thanks

I tried go to your website but I couldn't.

Yeah the site was down for a few hours, the server guys fixed the problem.

It should be ok now.

Still same issue. Site try loading an nothing more.

We had some problems with the article export and the server it used up all the CPU.

Its sorted now and I moved the test site to www.ringnews24.com.

New admin page with same log in details Konrad http://ringnews24.com/administrator/

Try add to override.css

Code: Select all

.nspArt h4.nspHeader a:active, .nspArt h4.nspHeader a:focus, .nspArt h4.nspHeader a:hover {
color: #eb592a;
}


and set your red color value. Remember to enable override.css option in template settings.

Thanks Konrad that worked great.

Another colour question if you dont mind Konrad.

When you highlight words on this forum it gives you an orange background with white writing. Is this possible to do on my boxing site with the red colour and white writing?

Thanks

For which elements on your site you would like to achieve it ?

For which elements on your site you would like to achieve it ?

I was wanting it to happen when any word/letters on the site gets highlighted.

Please try add to override.css

Code: Select all

a:hover {
background: #AA1A1A;
color:#fff;
}


Its not working with the articles text on the front page.
Its working with some of the article headings on the front page.
Its making some of the articles headings turn completly into a red box.

http://ringnews24.com/#axzz1TPQRdJD1

It wasnt the hover that I was wanting changed it was when you highlight words in order to copy paste text.

When you do it on this site it is orange and white.


But I like the hover idea also.

Please try add to override.css

Code: Select all

a:hover {
background: #AA1A1A;
color:#fff;
}


Code supplied by teitbite

Code: Select all

#gkTopMenu li a:active, #gkTopMenu li a:focus, #gkTopMenu li a:hover {
    color: #fff;
}

I tried your code Teitbite but its not what I was looking for, I was wanting the hover to have background red colour with white writing.

Hi

Just add the below code to css, do not replace the one Konrad told You. My code is a small fix to that:

Code: Select all

#gkTopMenu li a:active, #gkTopMenu li a:focus, #gkTopMenu li a:hover {
    color: #fff !important;
}


I have added your code teitbite, I see what it did it fixed the top menu, brilliant.

There are other headings that are showing up solid red, do you have a fix for that?

Thanks

Hi

Remove this code from override.css:

Code: Select all

a:hover {
background: #AA1A1A;
color:#fff;
}


and change mine to:

Code: Select all

#gkTopMenu li a:active, #gkTopMenu li a:focus, #gkTopMenu li a:hover {
    background-color: #AA1A1A;
    color: #fff !important;
}


Hi Teibite,

Your code fixed/removed the solid red, I was wanting the solid red to stay in the background with the white writing on all of the headings. Like you did with the top menu.

Cheers m8.

Hi

Ok. Just as I thought, but was not sure. Ok lets try with this one. It's a guess, so please leave it even if it will not work properly so I'll see what's missing:

Code: Select all

.h4.nspHeader:hover {
background-color: #AA1A1A;
}

.h4.nspHeader:hover a,
.h4.nspHeader:hover a:hover {
color: #ffffff;
}


I added the code yesterday, but no extra red blocks with white writing are showing up.

Hi

Sorry. A small issue in my code:
should be

Code: Select all

h4.nspHeader:hover {
background-color: #AA1A1A;
}

h4.nspHeader:hover a,
h4.nspHeader:hover a:hover {
color: #ffffff;
}


Hi

Sorry. A small issue in my code:
should be

Code: Select all

h4.nspHeader:hover {
background-color: #AA1A1A;
}

h4.nspHeader:hover a,
h4.nspHeader:hover a:hover {
color: #ffffff;
}


Thanks Teitbite

The code is working on some of the front page not all.

http://ringnews24.com/

Hi

Yes it's working on NSP module headers. Please show me which else should be like that. Sorry but I cannot make it by default to simply links, because it will cause a lot of problems with menus and so on.

Hi

Yes it's working on NSP module headers. Please show me which else should be like that. Sorry but I cannot make it by default to simply links, because it will cause a lot of problems with menus and so on.

If possible I would like the following to change. The Headings are

Top Stories
Most Popular
Fight Reports
most popular 2013
and
Articles by date

Would it be possible to change postion 2 also (Sections-Featured Articles-Popular Tags-Tools-About Us-Connect With Us)

Cheers m8