Changing a Text logo to an image
Changing a Text logo to an image
Hi
I'm completely new to CMSMS and im currently trying to adapt a template (high_tour.xml) to suit my needs. I was getting really into in but I've hit a problem. The template uses plain text for the website title/logo where as I need to chage it so it shows a image as the logo. I can see how it changes in templates such as NCleanBlue but i just can't figure it out in the stylesheet for this template. The details for the logo it has at the moment in the stylesheet is:
/* begin Logo. This is where the title logo is placed */
.logo
{
display : block;
position: absolute;
left: 0px;
top: 24px;
width: 400px;
}
h1.logo-name
{
display: block;
text-align: center;
}
h1.logo-name, h1.logo-name a, h1.logo-name a:link, h1.logo-name a:visited, h1.logo-name a:hover
{
font-family: "Trebuchet MS", Arial, Helvetica, Sans-Serif;
font-size: 38px;
text-decoration: none;
letter-spacing: 1px;
padding:0;
margin:0;
color: #ffffff !important;
}
.logo-text
{
display: block;
text-align: center;
}
.logo-text, .logo-text a
{
font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Sans-Serif;
font-size: 20px;
padding:0;
margin:0;
color: #F5E8B8 !important;
}
/* end Logo */
And the template shows:
<h1 id="name-text" class="logo-name"><a href="#">High Tour</a></h1>
<div id="slogan-text" class="logo-text">scenic
retreat</div>
How do I change this so it shows a clickable image and not text?
I'm completely new to CMSMS and im currently trying to adapt a template (high_tour.xml) to suit my needs. I was getting really into in but I've hit a problem. The template uses plain text for the website title/logo where as I need to chage it so it shows a image as the logo. I can see how it changes in templates such as NCleanBlue but i just can't figure it out in the stylesheet for this template. The details for the logo it has at the moment in the stylesheet is:
/* begin Logo. This is where the title logo is placed */
.logo
{
display : block;
position: absolute;
left: 0px;
top: 24px;
width: 400px;
}
h1.logo-name
{
display: block;
text-align: center;
}
h1.logo-name, h1.logo-name a, h1.logo-name a:link, h1.logo-name a:visited, h1.logo-name a:hover
{
font-family: "Trebuchet MS", Arial, Helvetica, Sans-Serif;
font-size: 38px;
text-decoration: none;
letter-spacing: 1px;
padding:0;
margin:0;
color: #ffffff !important;
}
.logo-text
{
display: block;
text-align: center;
}
.logo-text, .logo-text a
{
font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Sans-Serif;
font-size: 20px;
padding:0;
margin:0;
color: #F5E8B8 !important;
}
/* end Logo */
And the template shows:
<h1 id="name-text" class="logo-name"><a href="#">High Tour</a></h1>
<div id="slogan-text" class="logo-text">scenic
retreat</div>
How do I change this so it shows a clickable image and not text?
-
- Power Poster
- Posts: 1049
- Joined: Wed Mar 19, 2008 4:54 pm
Re: Changing a Text logo to an image
<h1 id="name-text" class="logo-name"><a href="#"><img src="path-to-image.jpg" width="xx" height="yy"></a></h1>
<div id="slogan-text" class="logo-text">scenic
retreat</div>
<div id="slogan-text" class="logo-text">scenic
retreat</div>
Last edited by staartmees on Wed Jul 04, 2012 6:34 am, edited 1 time in total.
Re: Changing a Text logo to an image
Thanks for the help. I've entered the code into the template but it doesn't show anything? Does something need added in the logo section of the style sheet to identify it as an image?
The logo is a PNG file so it doesn't have any background. This shouldn't make a difference should it?
Thanks for your help. Its really appreciated.
Pete
The logo is a PNG file so it doesn't have any background. This shouldn't make a difference should it?
Thanks for your help. Its really appreciated.
Pete
-
- Power Poster
- Posts: 1049
- Joined: Wed Mar 19, 2008 4:54 pm
Re: Changing a Text logo to an image
try with the full path to the image
<img src="http://www.websitename.ext/cms/uploads/images/image.jpg" width="xx" height="yy">
<img src="http://www.websitename.ext/cms/uploads/images/image.jpg" width="xx" height="yy">
Re: Changing a Text logo to an image
Still nothing....
Its the only major stumbling block i'm having. Everything else seems to be coming along nicely.
Its the only major stumbling block i'm having. Everything else seems to be coming along nicely.
-
- Power Poster
- Posts: 1049
- Joined: Wed Mar 19, 2008 4:54 pm
Re: Changing a Text logo to an image
do you see the img-tag in the html-code of the page?
Re: Changing a Text logo to an image
As always, a link to the site/page really helps us help you...
Re: Changing a Text logo to an image
Hi all
On my tablet I could see an image that failed to load (blue logo with a ?) but on my laptop I can't see anything.
the website link is www.cumbrianrun.co.uk. The difficulty I have is that its a business site so I can't make it active until its ready.
On my tablet I could see an image that failed to load (blue logo with a ?) but on my laptop I can't see anything.
the website link is www.cumbrianrun.co.uk. The difficulty I have is that its a business site so I can't make it active until its ready.
Re: Changing a Text logo to an image
I make a mysite.com/subfolder CMSMS install to test changes etc. till it's ready then move it to the root, sorry but w/o a real link it makes it hard to help...
Re: Changing a Text logo to an image
Hi
I'm not sure how to do that and i'm incredibly desperate, so for the next 24 hours i'm going to activate the site. Please take a look at
www.cumbrianrun.co.uk.
Any help is really appreciated.
I'm not sure how to do that and i'm incredibly desperate, so for the next 24 hours i'm going to activate the site. Please take a look at
www.cumbrianrun.co.uk.
Any help is really appreciated.
Re: Changing a Text logo to an image
Give class some fixed height:
.logo
{
...
...
height: 158px;
}
Missing quote:
<h1 id="name-text" class="logo-name"><a href="#"><img src="uploads/high_tour/finallogo.png" width="486" height="158"></a></h1>
Looks like image doesnt exist: uploads/high_tour/finallogo.png
Check for file present or spelling...
grtz. Rolf
.logo
{
...
...
height: 158px;
}
Missing quote:
<h1 id="name-text" class="logo-name"><a href="#"><img src="uploads/high_tour/finallogo.png" width="486" height="158"></a></h1>
Looks like image doesnt exist: uploads/high_tour/finallogo.png
Check for file present or spelling...
grtz. Rolf
- + - + - + - + - + - + -
LATEST TUTORIAL AT CMS CAN BE SIMPLE:
Migrating Company Directory module to LISE
Migrating Company Directory module to LISE
- + - + - + - + - + - + -
Re: Changing a Text logo to an image
Yes, it is to do with the quoting.
Also the image, even if quoted correctly is missing.
Code: Select all
<img src="uploads/high_tour/finallogo.png width=" 486"="" height="158">
Re: Changing a Text logo to an image
That did the trick!
You are both wonderful wonderful people!!!! Thank you so much.
You are both wonderful wonderful people!!!! Thank you so much.
Re: Changing a Text logo to an image
3) After your problem is solved add [Solved] in the subject
[added] If you are the originator of the topic, you can click on the 'modify' button on the first post in the topic. This will provide a form which allows you to edit the subject, and even the content... please add [Solved] to the beginning of the subject, once your topic has been resolved, and click 'Save'
http://forum.cmsmadesimple.org/viewtopi ... 40&t=17166

[added] If you are the originator of the topic, you can click on the 'modify' button on the first post in the topic. This will provide a form which allows you to edit the subject, and even the content... please add [Solved] to the beginning of the subject, once your topic has been resolved, and click 'Save'
http://forum.cmsmadesimple.org/viewtopi ... 40&t=17166
