1. underwatercolours
  2. Sherlock Holmes
  3. Commercial Templates
  4. Thursday, 22 January 2015
  5.  Subscribe via email
Is it possible to callout a different logo file for the mobile template?

My client's logo is long and skinny and works perfect for the regular version of the site, but the mobile version does not reduce the size of the logo and most of it is cut off.



http://spislandtravel.com/

Also, when I assign the hornav menu to a module, it messes up the mobile version





I can live without the module menu, but I really gotta fix the logo. Any suggestions?

Thanks in advance for your always prompt reply.
Accepted Answer Pending Moderation
0
Votes
Undo
Hello

Regarding your logo could you try adding the following to the Custom CSS field of your templates parameters...


.logo img {
max-width: 100%;
}


May I suggest sending temporary administration access to your Joomla installation to info@joomla51.com and we will examine the menu issue further. For our reference please paste a link to this post in your email.

Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 1
Accepted Answer Pending Moderation
0
Votes
Undo
Just set it up. I think I have the right combination of css from your tutorial and suggestion here to fix it but I have several sites with the same problem and they don't seem to be responding the same way.


@media only screen and (max-width: 440px) {
h1.logo a {
background-size: 300px auto;
}}

@media only screen and ( max-width: 767px ) {
h1.logo a {
background-size: 400px auto;
}}

.logo img {
max-width: 100%;
}
  1. more than a month ago
  2. Commercial Templates
  3. # 2
Accepted Answer Pending Moderation
0
Votes
Undo
Hello

Would you have a URLs to sites with this issue and we will examine them further?

Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 3
Accepted Answer Pending Moderation
0
Votes
Undo
The other one I'm having problems with is the Piano Forte template. The site is at http://www.scubaclubcozumel.com. The logo is fine in the iphone when horizontal, cuts off when vertical, fine on the ipad when horizontal, cuts off on vertical. It would be really great if we could substitute the logo with a different version, rather than trying to squish the long, skinny one in a small horizontal space. Thanks again for your help!
  1. more than a month ago
  2. Commercial Templates
  3. # 4
Accepted Answer Pending Moderation
0
Votes
Undo
Hello

Could you try adding the following to the Custom CSS field of your templates parameters editing to your own taste where 767 is the max screen size and topbanner4.png is the replacement image.


@media only screen and (max-width: 767px) {
h1.logo a {
background-image: url("/images/topbanner4.png");
}}


Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 5
  • Page :
  • 1


There are no replies made for this post yet.
Be one of the first to reply to this post!

Join Our Newsletter

* indicates required
We respect your privacy and do not tolerate spam and will never sell, rent, lease or give away your information (name, email, number, etc.) to any third party. Nor will we send you unsolicited email.
Joomla51 - Mullaghmore, Co. Sligo, Ireland
Joomla51.com is not affiliated with or endorsed by the Joomla! Project or Open Source Matters.
The Joomla! name and logo is used under a limited license granted by
Open Source Matters
the trademark holder in the United States and other countries.