Announcement

**gabrielcrowe** · 02-Jul-2007, 09:33 PM

put simply, the height of this element should be controlled by css

a css file called actinic.css that you'll find in the design tab, under actinic stylesheet.

in the code of your page, try to find the container surreounding the image's name.

edit this containers css.

does this help?

**Simon Bridges** · 02-Jul-2007, 09:40 PM

The first straightforward answer i've had, stunning. it works. How do I implement this on the brochure/home page if it's not asking too much, plus background colour to black?
This really is so appreciated.
Simon

**gabrielcrowe** · 02-Jul-2007, 09:47 PM

if you have microsoft office, you'll no doubt have 'frontpage'

this is a microsoft html editor, and its capable of creating css, with menus and options, instead of mess code.

dreamweaver is also a good one. its the one i use, its very good.

other than that... here is a html page with some template styles for you to edit for your page.

HTML Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
<!--
.demo {
	background-color: #0066FF;
	height: 75px;
	width: 500px;
	border: 2px solid #000033;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	font-size: 10px;
	padding: 5px;
}
-->
</style>
</head>

<body>
<div class="demo">this is some text</div>
</body>
</html>

have fun.

**Simon Bridges** · 02-Jul-2007, 10:01 PM

I think I need to visit actinic for some training as you've lost me now!
so..
I presume there is some css that controls the BrochureLogo in the same way as the Company Logo?
Is it a case of selecting the HOME page on the content tree and then actinic css under page type then editing again?
I have found the BrochureLogoWidth and the BrochureLogo width in pink (content page)but am struggling to find the css that controld this in Actinic Stylesheet.
Man I hope nobody else is looking at this as I feel a bit dumb right now.
Finally any ideas on background to black for both brochure home page and online store page?
Thanks once again.

**Simon Bridges** · 02-Jul-2007, 10:03 PM

I do have dreamweaver which I have used for basic HTML sites in the past but no experience at all of writing/implementing css code

**Simon Bridges** · 02-Jul-2007, 10:06 PM

Hold the phone........ I have manged to insert the Brochure logo and set the height....wonders will never cease......just the background colour now

**Simon Bridges** · 03-Jul-2007, 12:15 AM

Gabriel, you have sent me on the right path now, many, many thanks for your help
Simon

**pinbrook** · 03-Jul-2007, 11:10 AM

Simon would you mind documenting how you did this as it is often asked, and should be added to the Knowledge base

**Marci** · 03-Jul-2007, 11:52 AM

Simon - a few steps to assist you in your CSS adventures...

First, get Firefox webbrowser. Then get Web Developer Toolbar

Pick a current Actinic Site... eg: http://store.over-clock.com
View Source in browser, copy and paste into Dreamweaver. You'll see in there the paths to the two css files... so download those as well (http://store.over-clock.com/actinic.css & http://store.over-clock.com/structure.css)

Get the source of the page, and the two CSS files opened in Dreamweaver, and http://store.over-clock.com open in firefox... and on the Developers Toolbar go to Info > Display Class & ID Details.

Reference across each other... find the class for the area on the page in Firefox for what it is you want to find out how to do... find that class in one of the two stylesheets, and look on the sourcecode for the page for how that class/style is "called" from the sourcecode (look for id=, class= and style= within tags).

On the Developer's Toolbar, under CSS, you can select "Edit CSS" and make your changes onthefly on someone else's site to see how they look etc... just copy and paste your own CSS from Dreamweaver into the EditCSS box and hit apply...

If you set Firefox as default browser, you can then do a standard Actinic FullSite Preview, and use the EditCSS feature of web developer's toolbar to fiddle with your own CSS and view it realtime in it's entirety as you make the changes, then gradually transfer this over into Actinic.css or your own .css file

Once you get the hang of it, Dreamweaver prompts you automatically for the stylesheet contents as you write it, making life a lot easier. Just have a play with someone else's contents basically.

**Simon Bridges** · 10-Jul-2007, 10:20 PM

Changing page to fit Logo height/backgrond colour

Originally posted by pinbrook

Simon would you mind documenting how you did this as it is often asked, and should be added to the Knowledge base

Ok my first attempt at a technical answer so bear with me>
Firstly I am using the executive theme and the following works. I am not sure if it works with other themes as I haven't tried.

1.Make sure you have the design tab selected and the Online Catalogue selected in the content tree.
2.Use the Selected page type drop down to select Actinic Stylesheet
3.Locate line number 261
4. Here you will seethe following css code
_________________________________________
.page_header1 {
background-color: #000000;
margin: 0px 0px 0px 0px;
}
.page_header_content {
width: 762px;
text-align: left;
height: 130px;
___________________________________________
5. Change the values of background colour to whatever hex number you need eg 000000 for black FFFFFF for white etc.
6. Change the page header/ height: to whatever the size of you company logo
Bob's your uncle etc..

Hope this helps and good call Jo, this needs to be available for all

Simon

**Sean Williams** · 14-May-2008, 11:37 AM

Thanks Gabe and Simon - this was exactly what I was looking for

Announcement

Header Height and more.....

Header Height and more.....

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment