Joomla Templates Club 406,261 posts

[mzaf Friend mzafJoin date: August 2007Posts: 74Downloads:33Uploads:0 Thanks: 20 Thanked: 1 times in 1 posts]

#133734

After installing the Teline II “Quickstart”, how do I go about changing the color scheme to Red, which is shown in the demo as one of the options for this template. Thanks:)

[felsimedia Friend felsimediaJoin date: April 2008Posts: 84Downloads:0Uploads:0 Thanks: 4 Thanked: 9 times in 1 posts]

#272338

hi mzaf
every menu item has its own color scheme
go to module manager and open the ja-news module
you will categories where colors are assigned. maybe you could put all red to them if you want a total red scheme.

Parameters:
xxx(category number): red(color)

look for that in the ja-news module will open. goodluck

[mzaf Friend mzafJoin date: August 2007Posts: 74Downloads:33Uploads:0 Thanks: 20 Thanked: 1 times in 1 posts]

#272344

Thanks for replying, but I am interested in using the color red as the theme for the front page as a whole. How do I accomplish it. Thanks.

[swissvista Friend swissvistaJoin date: August 2007Posts: 44Downloads:0Uploads:2 Thanked: 2 times in 1 posts]

#272372

hi
I heard this is going do be in version Teline III but i’m not sure, ask support for correct answer

[jocoproductions Friend jocoproductionsJoin date: October 2008Posts: 6Downloads:0Uploads:0 Thanks: 2]

#273905

I too would like to know the answer for this if it is even possible. I want the red theme like you guys have in the World Section of your demo. http://template15.joomlart.com/ja_teline_ii/

But I want it for all pages, not just one section. Is this possible?

[questbg Friend questbgJoin date: May 2008Posts: 1912Downloads:0Uploads:1 Thanks: 146 Thanked: 339 times in 197 posts]

#273931

It’s probably not the correct way … however … the colour descriptions for the demo Telline II installation are stored in:
/templates/telline_ii/css/colors/

In here you’ll find the CSS files for all colours used in the demo for colours, for example:
“theme-cyan.css”

You can open this file and modify the hex code for the existing colour to a new one. For example, in the ‘cyan’ file above, the colour is this:

color: #0E9C9A

and change this to any other colour you wish, for instance, this ‘Red’ colour:

Simply change all instances of
color: #0E9C9A
in the CSS file to
color: #EF2510

As I say, maybe not the ‘correct’ way of doing things, but it worked for me!!

Cheers
Chris

1 user says Thank You to questbg for this useful post

1. jocoproductions

[jocoproductions Friend jocoproductionsJoin date: October 2008Posts: 6Downloads:0Uploads:0 Thanks: 2]

#274112

Alright I completely understand what you mean, I have to go into each of my page’s color schemes and manually change them to red but for my site every page is grey. I have tried going into the .css of the grey scheme and changing every instance of #666666 to #EF2510 but it doesn’t seem to do completely what I want. I want every grey bar (the ones that are about 8 px thick) to be red similar to the way the right side of your demo site is under the World section.

http://template15.joomlart.com/ja_teline_ii/index.php?option=com_content&view=section&layout=blog&id=13&Itemid=197

And also on the tabs module on the right side, the current open one is red and on mouseover for the others they change to red. I have no clue how to go about that, I was just hoping to change the default’s template theme to red, or copy the red’s css code into the default grey’s. But there doesn’t seem to be a grey css theme file so I can’t do that either.

I REALLY appreciate all the help questbg and I love this theme, I just gotta get a couple kinks worked out first apparently. My site is at http://pvhspoint.com so you can see what I have so far. All the content is going to be put in over the next couple hours so it should look more complete soon hopefully 🙂

[questbg Friend questbgJoin date: May 2008Posts: 1912Downloads:0Uploads:1 Thanks: 146 Thanked: 339 times in 197 posts]

#277017

Did anyone ever figure out how to change the ‘grey’ on the front page to a different colour? I could really use this today!!

[jocoproductions Friend jocoproductionsJoin date: October 2008Posts: 6Downloads:0Uploads:0 Thanks: 2]

#277318

I never fully learned how to do it, I changed as much as I could to the red scheme but I still havn’t learned how to change some of the dividers and link background colors. http://www.pvhspoint.com to see what I could change.

[aardcom Friend aardcomJoin date: February 2008Posts: 183Downloads:66Uploads:3 Thanks: 46 Thanked: 30 times in 4 posts]

#307450

You may have already found the answer to this but here is the solution that worked for me.

Go to templates/ja_teline_ii/css/colors folder and rename theme.css to something like theme-original.css. Then rename one of the other themes to theme.css ie theme-cyan.css to theme.css. This changes all the menus and header colors throughout the site to the color you choose.

Not sure how this affects the color overides in the News module but it will work if you want a consistant theme (color) throughout the site.

[cgc0202 Friend cgc0202Join date: August 2007Posts: 2244Downloads:0Uploads:3 Thanks: 206 Thanked: 262 times in 1 posts]

#307454

The way I did it was to go to

templates => ja_teline_ii => css => colors

you will find a key file there, called

theme.css

as well as the other theme color schemes. Select the one theme color scheme you wanted. For example, in the one requested here, the closes would be theme-pink.css

templates => ja_teline_ii => css => colors => theme-pink.css

Copy the content of theme-pink.css and paste the entire css specifications in the theme-pink.css and paste over the css specifications in theme.css

By the way, if you wish some darker color, like deep red or maroon, or any color whatsoever, just replace the default color related to pink with the hexanumeric equivalent for the color you wanted. Chris provided a color chart above, and there are color wheels or charts inthe internet that will automatically provide the corect hexanumeric equivalent of any shade of color.

The above will take care of some of the issues. When you go to the ja-news module:

[From your admin page (backend)]:

Extensions => Modules Manager => JA News => Click to open

it would be a good idea to specify the theme color you have selected.

e.g., (on the right side of the JA News Module)

Group by Category or Section (select Secition)

1: pink
8: pink
13: pink
etc.

Notes: Since the theme colors may be specified in the script, even if you used red, make sure that if it was the theme-pink.css that you used, make sure you replace the pink to red also in the theme-pink.css (as well as the theme.css.

Here is an example of a

Teline II Sanbox 099
http://joomlart.bayanihan-saranay.org/jte15x099/index.php

where I selected deep-blue as the theme color for the site. In fact, it is slightly a different kind of blue.

The complete use of blue however required answering also the question raised by Chris, above. I will answer that in another response post here.

Cornelio

[cgc0202 Friend cgc0202Join date: August 2007Posts: 2244Downloads:0Uploads:3 Thanks: 206 Thanked: 262 times in 1 posts]

#307456

<em>@questbg 88036 wrote:</em><blockquote>Did anyone ever figure out how to change the ‘grey’ on the front page to a different colour? I could really use this today!!</blockquote>

As Chris implied in his question quoted, the previous approached I suggested above takes care mainly of the “Magazine menu navigation scheme”, as well as the colors showing in each section in the actual JA News. If you did not edit the JA News module as I indicated above (same color for all sections), you will still have different rainbow colors appearing in the JA Section, when you click on a section in the Magazine navigation menu.

The question raised by Chris is more complex, because (if I am not mistaken) you have to make the appropriate changes in the template.css and possibly the ja-news.css

(using FTP)
templates => ja_teline_ii => css

Since there are a few CSS tags tags that are affected, it is better to provide a more general approach.

Here is an example of a

Teline II Sanbox 099
http://joomlart.bayanihan-saranay.org/jte15x099/index.php

where I selected deep-blue as the theme color for the site. In fact, it is slightly a different kind of blue.

The complete use of blue however required answering also the question raised by Chris, above. I will answer that in another response post here.

Since there are a few CSS tags that affected, the generic way of doing this is

Perform a Page Source of the Main page

In the example given above, the first Section in the JA News is

Sport

(with first news article)

Total running characters test

Using the above as markers, locate the section “Sport” and article title “Total running characters test” in the Page Source of the Main page. This spatial location is critical because the term “Sport” will be found in so many sites in the Page Source of the Main Page.

If you did it properly, you will find these in the Page Source of the Main Page:

********

<div id=”jazin-wrap”>
<div id=”jazin” class=”clearfix”>

<div class=”jazin-left” style=”width:49.95%”>
<div class=”jazin-boxwrap jazin-theme-deepblue”>

<div class=”jazin-box”>
<div class=”jazin-section clearfix”>
<a href=”/jte15x099/sport.html” title=”Nibh pulvinar rhoncus Curabitur volutpat nibh sed ac Vestibulum laoreet consectetuer. Morbi eu ullamcorper dapibus sagittis a Curabitur laoreet Pellentesque pretium Quisque. Pellentesque Phasellus Cras Sed elit dis eget tincidunt purus lacus pellentesque.”>
<span>Sport</span>
</a>
</div>
<div class=”jazin-content clearfix”>
<h4 class=”jazin-title”><a href=”/jte15x099/sport/cricket/90-total-running-characters-test.html” title=”Total running characters test”>Total running characters test</a></h4>
********
with the relevant CSS tags:

• jazin-wrap
• jazin
• jazin-left
• jazin-boxwrap
• jazin-box
• jazin-section

that surrround the Section “Sport”

jazin refers to CSS tags used in JA News. As I stated above, some of these are either in the template.css or ja.news.css; the said files are found in

(from FTP)
templates => ja_teline_ii => css

you might want to look also at the JA News module in

modules => mod_janews => ja.news => ja.news.css

to modify the CSS tags (do both to play safe), but if I am not mistaken, I only changed the ones in the templates

Next: Inspect the background and the character colors relevant to the aforementioned CSS tags, and make the corresponding changes.

Notes I included character colors also because

A white background usually goes well with dark or black characters for the text.
You may need to change the color of the characters for the text, if you change to a dark background, which is the case with a red background.

The above is a generic answer, but if you try to do the general procedure on your own — by trial and error, you will be able to make almost 80-90% of the questions you will ever encounter about CSS and layouting — sizes, colors, spacing, bold, underlined, uppercase, normal, border, no border, underlined, not underlined, etc. In fact, once you repeat the layouting modifications often enough, you miight be able to perform more advanced issues, like how to solve a messed up layout.

I hope the above helps, but it will work only for those who want to explore. My suggestion is that you create a Sandbox. I have a gazillion Sandboxes, and try them first in the Sandbox before applying them to your actual stable site.

Cornelio

[Author]

Posts