Customise 'soccer' template - CSS pointer req.
-
- Regular
- Posts: 56
- Joined: Sun May 18, 2008 5:50 pm
Customise 'soccer' template - CSS pointer req.
Hi,
I'm trying to customise the 'Soccer' template to match the broad design used on my web site. It's mostly done but I'm struggling to find a couple of CSS settings to change the back-ground colour in a couple of area's.
The blog is here: http://www.davidtapley.co.uk/blog/
My Web site is here: http://www.davidtapley.co.uk
The style sheet for the theme is: http://www.davidtapley.co.uk/blog/templ ... /style.css
1. Ideally I'd like to be able to change the 'background' colour in the left side column (currently light grey) which holds the plug-in's etc. The would appear to partly set in the #bg setting but does not seem to work.
2. I'd like to change the main 'background' colour that the blog sits in (currently white ?) I can't find this at all.
3. Finally, assuming I manage to add the main background colour, it would be nice to add a white boarder around the centre 'blog' screen. I'm guessing I can use the #wrap setting to set a wider boarder.
Sorry for what are probably simple questions, I've spent to afternoon trying to track them down without any success. Any hints tips or pointers towards the blindingly obvious will be appreciated
Thanks for your help
David
I'm trying to customise the 'Soccer' template to match the broad design used on my web site. It's mostly done but I'm struggling to find a couple of CSS settings to change the back-ground colour in a couple of area's.
The blog is here: http://www.davidtapley.co.uk/blog/
My Web site is here: http://www.davidtapley.co.uk
The style sheet for the theme is: http://www.davidtapley.co.uk/blog/templ ... /style.css
1. Ideally I'd like to be able to change the 'background' colour in the left side column (currently light grey) which holds the plug-in's etc. The would appear to partly set in the #bg setting but does not seem to work.
2. I'd like to change the main 'background' colour that the blog sits in (currently white ?) I can't find this at all.
3. Finally, assuming I manage to add the main background colour, it would be nice to add a white boarder around the centre 'blog' screen. I'm guessing I can use the #wrap setting to set a wider boarder.
Sorry for what are probably simple questions, I've spent to afternoon trying to track them down without any success. Any hints tips or pointers towards the blindingly obvious will be appreciated
Thanks for your help
David
Re: Customise 'soccer' template - CSS pointer req.
to correct the sidebar and content issue use
for the border add to #content
Code: Select all
#mainpane {
background: none repeat scroll 0 0 #FFFFFF; /*this is white*/
overflow: visible;
}
Code: Select all
#content {
border: 2px solid red; /* try any colour - or use web-colors */
}
Regards,
Ian
Serendipity Styx Edition and additional_plugins @ https://ophian.github.io/ @ https://github.com/ophian
Ian
Serendipity Styx Edition and additional_plugins @ https://ophian.github.io/ @ https://github.com/ophian
-
- Regular
- Posts: 56
- Joined: Sun May 18, 2008 5:50 pm
Re: Customise 'soccer' template - CSS pointer req.
Cheers Ian, just the job - much appreciated.Timbalu wrote:to correct the sidebar and content issue usefor the border add to #contentCode: Select all
#mainpane { background: none repeat scroll 0 0 #FFFFFF; /*this is white*/ overflow: visible; }
Code: Select all
#content { border: 2px solid red; /* try any colour - or use web-colors */ }
I've made those amends and used 'background' in the 'body' tag to get the whole screen coloured background I was looking for.
All's good except there is a slight alignment issue (which I expect was hidden in the original template) that has shown up with the colour change.
If anyone has any suggestions on how to fix it, that would be cool.
Thanks again
David
Re: Customise 'soccer' template - CSS pointer req.
Hi Daviddavid@mediacopy wrote:All's good except there is a slight alignment issue (which I expect was hidden in the original template) that has shown up with the colour change.
What do you mean? The Contact Nav link?
Change width to
Code: Select all
#navbar {
width: auto; /*542px;*/
}
Code: Select all
#bg {
background: none repeat scroll 0 0 transparent;
}
Trying to get this all near http://www.davidtapley.co.uk/index.htm is very nice. Go on!
Regards,
Ian
Serendipity Styx Edition and additional_plugins @ https://ophian.github.io/ @ https://github.com/ophian
Ian
Serendipity Styx Edition and additional_plugins @ https://ophian.github.io/ @ https://github.com/ophian
-
- Regular
- Posts: 56
- Joined: Sun May 18, 2008 5:50 pm
Re: Customise 'soccer' template - CSS pointer req.
Hi Ian,
The menu (contact) button does seem to roll onto a new line if the menu text is too long - your fix should allow me more descriptive menu link text
The alignment issue is in the white boarder - the left side is wider than the right side.
I've not had chance to play with your suggestions yet but that could be the fix ?
It's getting closer in style to the main site so fingers crossed. I'll make a few tweaks to the header image and they will help with the look too.
One thing that I was going to ask - are there any tricks to have a separate 'style' for different 'categories' ? You'll see on the blog I cover some very different subjects where the 'snow' style doesn't really match the other stuff.
Cheers
David
The menu (contact) button does seem to roll onto a new line if the menu text is too long - your fix should allow me more descriptive menu link text
The alignment issue is in the white boarder - the left side is wider than the right side.
I've not had chance to play with your suggestions yet but that could be the fix ?
It's getting closer in style to the main site so fingers crossed. I'll make a few tweaks to the header image and they will help with the look too.
One thing that I was going to ask - are there any tricks to have a separate 'style' for different 'categories' ? You'll see on the blog I cover some very different subjects where the 'snow' style doesn't really match the other stuff.
Cheers
David
Re: Customise 'soccer' template - CSS pointer req.
Yes.david@mediacopy wrote:I've not had chance to play with your suggestions yet but that could be the fix ?
Yes!david@mediacopy wrote:...any tricks to have a separate 'style' for different 'categories' ?
Something like
Code: Select all
/* syndication, quicksearch, archives, categories, authors, superuser, etc.
staticpage plugin, entrylinks plugin, freetag plugin, guestbook plugin, etc. */
.serendipitySideBarContent .serendipity_edit_nugget {
do: something;
}
Code: Select all
h3.serendipitySideBarTitle serendipity_syndication_plugin {
background: none repeat scroll 0 0 transparent;
}
Regards,
Ian
Serendipity Styx Edition and additional_plugins @ https://ophian.github.io/ @ https://github.com/ophian
Ian
Serendipity Styx Edition and additional_plugins @ https://ophian.github.io/ @ https://github.com/ophian
-
- Regular
- Posts: 56
- Joined: Sun May 18, 2008 5:50 pm
Re: Customise 'soccer' template - CSS pointer req.
Cheers Ian,
Much appreciated. I've fixed the background issue and it all looks balanced now.
I'll have a play with decoding the other elements of the CSS and am confident I'll be able better match to the main site when I have a bit more time.
I'm not sure I fully understand the plug-in/nugget approach - could this allow me to change the current \active css style between categories ?
Thinking about it, I guess the template HTML stays the same, it's just a case of using a different .css style sheet depending on the category 'content' or 'posts' being displayed ?
thanks again
David.
Much appreciated. I've fixed the background issue and it all looks balanced now.
I'll have a play with decoding the other elements of the CSS and am confident I'll be able better match to the main site when I have a bit more time.
I'm not sure I fully understand the plug-in/nugget approach - could this allow me to change the current \active css style between categories ?
Thinking about it, I guess the template HTML stays the same, it's just a case of using a different .css style sheet depending on the category 'content' or 'posts' being displayed ?
thanks again
David.
Re: Customise 'soccer' template - CSS pointer req.
Right! I should have said: Search for exact sidebar block name in html source code.david@mediacopy wrote:Thinking about it, I guess the template HTML stays the same, it's just a case of using a different .css style sheet depending on the category 'content' or 'posts' being displayed ?
Regards,
Ian
Serendipity Styx Edition and additional_plugins @ https://ophian.github.io/ @ https://github.com/ophian
Ian
Serendipity Styx Edition and additional_plugins @ https://ophian.github.io/ @ https://github.com/ophian
-
- Regular
- Posts: 56
- Joined: Sun May 18, 2008 5:50 pm
-
- Regular
- Posts: 56
- Joined: Sun May 18, 2008 5:50 pm
Re: Customise 'soccer' template - CSS pointer req.
One slight issue with the new theme is that the preview function fails when drafting a message.
The preview pane is very narrow, just a few px in the horizontal. The content appears to be displayed and it's possible to use the mouse to scroll it up and down so I'm guessing it must be a css setting somewhere
The preview pane is very narrow, just a few px in the horizontal. The content appears to be displayed and it's possible to use the mouse to scroll it up and down so I'm guessing it must be a css setting somewhere
Re: Customise 'soccer' template - CSS pointer req.
Yes David, it seems to do so, but without having this in real it is nearly impossible to give an advice.
Firefox has this fantastic plugin tool named Firebug, which being installed is able to let you do live editing od CSS and even HTML. With a tool like this everybody is able to solve its CSS problems after a while.
Firefox has this fantastic plugin tool named Firebug, which being installed is able to let you do live editing od CSS and even HTML. With a tool like this everybody is able to solve its CSS problems after a while.
Regards,
Ian
Serendipity Styx Edition and additional_plugins @ https://ophian.github.io/ @ https://github.com/ophian
Ian
Serendipity Styx Edition and additional_plugins @ https://ophian.github.io/ @ https://github.com/ophian
Re: Customise 'soccer' template - CSS pointer req.
Yes, but also possibly modifications to preview_iframe.tpl. Beware, said file is a tricky bitch. Basically, you'll want to make sure that preview_iframe.tpl resembles your index.tpl, but it still needs some special (inline) styles (see default/preview_iframe.tpl for reference). I'm afraid it's really hard to give you any further and more specific advice on this.david@mediacopy wrote:One slight issue with the new theme is that the preview function fails when drafting a message.
The preview pane is very narrow, just a few px in the horizontal. The content appears to be displayed and it's possible to use the mouse to scroll it up and down so I'm guessing it must be a css setting somewhere
YL
-
- Regular
- Posts: 56
- Joined: Sun May 18, 2008 5:50 pm
Re: Customise 'soccer' template - CSS pointer req.
Thanks both, I'll have a look at it when I have a moment.
It's not a busy site so previewing 'live' isn't a deal breaker at the moment.
It's not a busy site so previewing 'live' isn't a deal breaker at the moment.