[SOLVED] Cherrydesign logo questions

Hi

I'm just starting to remodel the cherrydesign template for my new website but I'm already stuck with the logo!

I've found how to replace the default image with text but can you tell me please how to alter:

1. The text size
2. The logo position

I've tried altering the gkLogo and gkLogoText font sizes in override.css having enabled CSS override in the aqdvanced settings tab in the template.

Thanks for your advice.

Tim

I would hazard a guess at Template.css in sitename/templates/template name/css

It is just a guess though but there are usually some Logo styling codes in there.

Thanks Hulyd but I can't find a sitename folder in the cherrydesign template.

Whats your joomla version?

In any reference to sitename/ joomlaroot or root means entry level directory of your website.

As Norman said....

By 'sitename' I mean your root folder, which is where your joomla is installed... So in there one of the folders is 'templates'... Within this folder will be whatever templates you have installed, cherrydesign being one of them hopefully... Once you have opened this 'cherrydesign' folder you will be presented with a selection of folders, one of which should be 'css'... open it up and 'template.css' should be in there.

I hope this is a little clearer than my previous message.

Hi

Thanks for your replies - sorry, been out all day. Sorry to misunderstand the 'sitename' reference.

I have Joomla version 1.7. I've tried altering template.css (in the css folder) as well as using the override.css method.

Thanks

Tim

Where abouts are you trying to move it to?

Just for information most Gavick templates have 3 logo alternatives.

1. Standard logo in stylex.css
2. Text Logo
3. Selecting an image from template features and using that as logo.

All 3 selections have common css code as well as separate css codes.

So which logo type are you using?

In the features section of the cherrydesign template I selected 'text' for the logo type.

In reply to Hulyd, I'd like to be able to move the text logo down a bit to align it with the menu.

Thanks

Tim

Hi Tim,

With regards to your text size for the logo...

in templates/cherrydesign/css/ find and open your template.css file and locate the logo section as below.

Code: Select all

/* Logo */

#gkLogo {background:transparent url('../images/style1/logo_bg.png') no-repeat 0 0; height: 66px; width: 265px; margin: 0; padding: 0; line-height: 100%; float: left }
#gkLogo.text a {}
.gkLogoText {font-family:Arial, sans-serif; font-size:32px; line-height:12px; font-weight:bold; margin:0; color:#fff!important; float:left; padding: 15px 7px 0px}
.gkLogoSlogan { text-transform:uppercase; font-size:12px; color:#ddd; padding: 0 9px; margin: 0!important}
#gkLogo a { display: block; height: 60px; margin: 0; width: 261px; }
#gkLogo.text a { text-indent:0!important; background:none!important; }
#gkLogo img {display:block; margin:0; padding:10px 14px; text-indent:-999em; background-position: center center}


The line beginning with .gkLogoText is responsible for your logo text when the logo text option is selected in your template.

With regards the position of the logo... Is there any chance you could post a screenshot of what you currently have?

Thanks Hulyd. I had already identified this and altered that line with no effect before I started this thread. I don't know why it doesn't appear to be working. I have altered the font size to 66px in template.css, changed the line size, changed the padding parameters etc but nothing seems to change.

Could this be a cache issue of some sort?

I've attached a screenshot of the test site that I'm playing with.

Thanks, Tim

PS. I modified another gavickpro template some years ago - www.wildimaging.co.uk - and I want to rebuild that site on the cherrydesign template.

It seems to be a mistake as in the code template is using "<h1 class="gkLogo text">" which is dual css usage which uses gkLogo and text which are both separate css codes and when code is like that it gets its values from following files and lines.

Stylex.css ( x is a number )
Line : 191

Code: Select all

.text {
    text-shadow: 1px 1px 1px #FFFFFF;
}


Template.css
Line: 96

Code: Select all

.text {
    font-size: 30px;
    line-height: 1.3;
    padding-bottom: 20px;
    padding-left: 0;
    padding-right: 0;
    padding-top: 0;
}


You can change above codes for your font size however any other elements using .text will also change. e.g message in demo website " I am Robert Cherry, an imaginative and experienced..."

To prevent that you can follow below.
Find File: "templatesgk_cherrydesignlayoutsblocksnav.php"
Find Line: 47
Which is

Code: Select all

     <h1 class="gkLogo text">


Change it to

Code: Select all

     <h1 class="gkLogoText">


Now in template.css
any of the following codes will change Logo text only...
Main Container Any text follows below styling

Code: Select all

.gkLogoText {font-family:Arial, sans-serif; font-size:32px; line-height:12px; font-weight:bold; margin:0; color:#fff!important; float:left; padding: 15px 7px 0px}


Rest of this just a explanation of how css works for future references.
Adding "A link" styling if you want links different, lets change link fontsize to 50px

Code: Select all

.gkLogoText {font-family:Arial, sans-serif; font-size:32px; line-height:12px; font-weight:bold; margin:0; color:#fff!important; float:left; padding: 15px 7px 0px}
.gkLogoText a {font-size:50px; }


Or you can use h1 styling same as above

Code: Select all

.gkLogoText {font-family:Arial, sans-serif; font-size:32px; line-height:12px; font-weight:bold; margin:0; color:#fff!important; float:left; padding: 15px 7px 0px}
h1.gkLogoText {font-size:50px;}


or you can use a > span styling

Code: Select all

.gkLogoText {font-family:Arial, sans-serif; font-size:32px; line-height:12px; font-weight:bold; margin:0; color:#fff!important; float:left; padding: 15px 7px 0px}
.gkLogoText a span {font-size:50px; }


Looking at the code for Logo Text which is below

Code: Select all

     <h1 class="gkLogoText">
         <a href="./">
              <span><?php echo $this->getParam('logo_text', ''); ?></span>
              <small class="gkLogoSlogan"><?php echo $this->getParam('logo_slogan', ''); ?></small>
         </a>
     </h1>


As you can see starts with class gkLogoText with H1 element
--------Then continues with a class
----------------Then continues with span class
Last class if you have the css styling will overwrite all other previous classes.

See you around...

Hi Norman

Well done finding the fault! I was beginning to think I was doing something stupid (not unusual ).

Cheers

Tim

No problem at all, see you around...