Joomla Templates Club 406,261 posts

[railer Friend railerJoin date: October 2007Posts: 236Downloads:102Uploads:9 Thanks: 17 Thanked: 24 times in 1 posts]

#158505

I’ve noticed that even though I’ve selected the “White” template color for my JA Norite desktop site, when viewing the site in an iPhone, it is being shown with a dark template background.

How do I get it to use the “White” color theme in iPhone and other handheld devices?

I know there are different php files for various devices in the layouts/blocks directory, and different css files in the css/handheld directory, but I wanted to check to see if there was some simple way to switch the style so that I don’t have to go in and hack those files. Can I just change a parameter somewhere?

Please advise.

Thanks,
railer

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#371089

dear railer,

currently the default style option will not affect the iphone view, which is now fixed with black theme. I will contact our devs for advice on your case.

Thank you.

1 user says Thank You to Ninja Lead for this useful post

1. railer

[railer Friend railerJoin date: October 2007Posts: 236Downloads:102Uploads:9 Thanks: 17 Thanked: 24 times in 1 posts]

#371707

Hi Hungnd,

Thanks for your reply. I found a forum post [url=http://www.joomlart.com/forums/topic/i-would-like-the-mobile-version-template-with-light-colors-for-example-ja-telineiii/

<link href="<?php echo $this->templateurl(); ?>/css/colors/<?php echo strtolower ($this->getParam(JA_TOOL_COLOR)); ?>.css" rel="stylesheet" type="text/css" />

It seems to have worked, changing the background to white. I’m now trying to find out how to increase the size of the logo that is too small, but that is another issue.

Let me know what you guys come up with, if it is a better way than what I posted above.

Thanks,
railer

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#371848

hi railer,
open templates/ja_norite/css/template.css, locate this:

h1.logo a {
background: url("../images/logo2.png") no-repeat scroll left center transparent;
display: block;
height: 42px;
width: 163px;
}
you need to change background property, point the bg image to your new logo(currently its logo2.png located in templates/ja_norite/images/logo2.png), along with width and height.
another code you have to modify is :

h1.logo {
height: 42px;
width: 163px;
}
change the width and height to properly cover the bg image.

have a nice day 🙂

1 user says Thank You to Ninja Lead for this useful post

1. railer

[railer Friend railerJoin date: October 2007Posts: 236Downloads:102Uploads:9 Thanks: 17 Thanked: 24 times in 1 posts]

#374863

Thanks hungnd! That worked to solve the logo size issue. Configuring the template for handheld devices within the T3 system seems to be complicated. I’ll sniff around the forums.

Best,
railer

[railer Friend railerJoin date: October 2007Posts: 236Downloads:102Uploads:9 Thanks: 17 Thanked: 24 times in 1 posts]

#374865

Regarding the color fix quoted below, even though I’m using the “White” color theme, there seems to be a thin green rule under the logo header. How would I change that?

In fact, I want to create a logo header masthead with the following traits:

1. Background color of the masthead would be #3399FF (blue).
2. Logo would align to the left and be the full height of the header div with no margin/padding.

Where would I go to edit these items?

Thanks,
railer

PS: I’ll look around myself and will post here if I find the answers before any replies to this thread.

<em>@railer 214815 wrote:</em><blockquote>Hi Hungnd,

Thanks for your reply. I found a forum post [url=http://www.joomlart.com/forums/topic/i-would-like-the-mobile-version-template-with-light-colors-for-example-ja-telineiii/

<link href="<?php echo $this->templateurl(); ?>/css/colors/<?php echo strtolower ($this->getParam(JA_TOOL_COLOR)); ?>.css" rel="stylesheet" type="text/css" />

It seems to have worked, changing the background to white. I’m now trying to find out how to increase the size of the logo that is too small, but that is another issue.

Let me know what you guys come up with, if it is a better way than what I posted above.

Thanks,
railer</blockquote>

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#375732

open template.css again
1. change:

.ja-home h1.logo {
height: 80px;
width: 318px;
}
to:
.ja-home h1.logo {
height: 80px;
width: 318px;
background: #3399FF;
}

2. change:

.ja-home h1.logo {
float: none;
margin: 0 auto;
}
to:

.ja-home h1.logo {
float: none;
}

[Author]

Posts