Serendipity Forums

Posted: **Mon Dec 19, 2005 1:07 am**

Hello all, so I've read how you integrate Serendipity into an existing HTML design (I'm not much of a PHP or CSS guy, you see). You do it by editing the .tpl files in your default template directory right?

Well I can do that to an extent, change a few table background colors, add text here and there. But I'm having mucho problems getting anything else to work. For now though I'll just focus on one.

As I understand it, I edit the main layout of my blog page by editing index.tpl. So I go in there and try to add a background image into the <body> tag using <body background="images/image.gif"> or whatever. I also try to add marginheight="0" marginwidth="0" etc. so that the page has no white edges. It doesn't work if I try to specify a background color in the body tag either.

But none of this works! What am I doing wrong? Or am I just a knucklehead HTML designer who doesn't understand this complex stuff?

Posted: **Mon Dec 19, 2005 3:05 am**

It should work, more or less like that.

In your example, you used a relative URL. You need to keep in mind that -- for most browsers -- that's relative to the page being loaded. Since your page is being loaded via Serendipity, it could have subdirectories you're not expecting, like categories/, archive/ or what-have-you. Try an absolute URL instead, just to see if that helps.

Additionally, you might want to look into CSS. It's like taking all those marginright, marginleft, etc stuff, kicking it up a notch, and moving it into a new tag. It's really cool. For instance, check your style.css. Look for something like this:

Code: Select all

body {
  weird-stuff;
}

All the weird-stuff is like attributes in the tag. "background-image" can be used a lot like the "background" attribute; Serendipity happens to parse the style.css, so you can even put things like {TEMPLATE_DIR} in there. The nice thing is that there are lots of other things you can do with it, too: you can specify whether the background repeats in X, Y, or both, as well as whether it's offset by a bit. You can even do it all in one shot, with the "background" attribute.

For a more useful example, consider this: you can name and class your tags, too. A piece of CSS in the style.css that looks like this:

Code: Select all

.serendipitySideBarItem {
  background-color: red;
}

means that any HTML tag with class="serendipitySideBarItem" will get a red background. Any tag. <P class="serendipitySideBarItem">, <B class="serendipitySideBarItem">, a, div, ul, li, form, td... anything. If you use shorter class names, you can basically come up with your own tags.

Anyway, the CSS you want would look like:

Code: Select all

body {
  margin: 0px;
  background-image: url(<full-url>);
}

Good luck!

Posted: **Mon Dec 19, 2005 3:49 am**

Actually I've done most of that already. I had already tried absolute paths, and could never get it to work.

I'm no expert at CSS, but that was one of the other problems I'm having. When I change things in CSS, font weights or colors or what have you, nothing is changed on my blog. I can't figure it out for the life of me.

After I read your reply I went back and tried to change things in the body tag in my style.css file, and as far as I know I have everything correctly but nothing is changed on my site. Any ideas?

Posted: **Mon Dec 19, 2005 10:40 am**

Strider: Did you reload the full page and/or clear your browser cache? In some cases your CSS is cached and may not be reloaded for your changes!

Can you give us your URL to check the problems out, if they persist?

Regards,
Garvin

Posted: **Mon Dec 19, 2005 3:31 pm**

Yeah, I've cleared the cache and even checked the site on multiple computers, and still no dice.

You can check out the page as it stands at
http://www.christianthinker.net/serendipity

It's pretty ugly right now because I can get very little of anything to work! And the error message that you see on the top of the page is because I was trying to use a PHP include to include a header file using the instructions you gave another poster on the following thread:
http://www.s9y.org/forums/viewtopic.php?t=3851

I'm at my wit's end here. Serendipity is the only blog that has all the features I need, but I can't get it to work! Is it possible I have it set up incorrectly?

Thanks,
Brian

Posted: **Mon Dec 19, 2005 8:10 pm**

Actually, all is very easy to solve.

)

First: You've enabled "embed" option in your s9y configuration section. If you look at your HTML code, you'll see that no HTML header is echoed. The config item explicitly says that you'll have to take care of that, if you enabled embedding.

So, first solution: Disable embed mode. Then your stylesheet will apply.

Second issue seems to be that you are using a full URL to include a PHP file. You should not do that. Use the absolute or relative path to a PHP file instead!

Best regards
,Garvin

Posted: **Mon Dec 19, 2005 8:39 pm**

OK, that works but since I had once set the style in the admin page to "rusty" it only works if I change the "style.css" file in the rusty folder. I read somewhere that if you're going to do a custum design you need to create your own template folder. I would rather do this than have to manipulate rusty's style.css. How is that done?

Thanks for all the help Garvin!

Brian

Posted: **Mon Dec 19, 2005 8:46 pm**

That is described on www.s9y.org in the "Technical Documentation" > "Styles" section.

Have fun,
Garvin

Serendipity Forums

Need help working with index.tpl!

Need help working with index.tpl!