Welcome to Geeklog, Anonymous Tuesday, November 26 2024 @ 03:27 pm EST
Geeklog Forums
Pictures as backgrounds for stories
Anonymous
Anonymous
Im trying to create a custom geeklog theme with pictures as backgrounds for normal and featured stories, but what ever I try I still cant format the background options, Ive tried creating backgrounds per table, and even per cell in the table but I still cant format them.
I ve edited featured storytext.thtml, storytext.thtml, featuredstorybodytext.thtml and storybodytext.thtml on several different themes but still came up with the same result. Is this possable with geeklog, and if so how do I do it?
Thanks
8
9
Quote
Anonymous
Anonymous
You should be able to do this with CSS in a style sheet. If there's a class already set up for your story and one for your featured story, then add the background attribute and define which images you want displayed for each. If there is no class already, then create one and do this.
6
8
Quote
Status: offline
Creator
Forum User
Full Member
Registered: 07/11/02
Posts: 181
Location:Austin, TX
In your style.css file look for .blockinfo and/or .storyinfo. These two
control the content inside the blocks and stories. Most themes have this,
though some do not.
L. Whitworth
If your theme does not have it, then look inside the other themes that do and see where those styles are used in leftblocks.thtml and rightblocks.thtml as well as storybody.thtml and featuredstorybody.thtml.
---
L. Whitworth
www.finiserv.com
L. Whitworth
8
7
Quote
Anonymous
Anonymous
Dont suppose you know any themes that do this? Ive searched high and low but cant find 1
9
7
Quote
Anonymous
Anonymous
Look inside the theme you are modifying and see if it uses a class for the regular stories and one for the featured story. If you don't know what a class is, then you probably want to read a basic tutorial. If they contain a class (or id), then add this line to the class (or id) inside your style sheet:
background: url(background.gif);
or
background-image: url(background.gif);
***** NOTE: make sure the link in the url() points to wherever you have the background image.
If the class already has the background defined, then just add the url to it. For example, if the class looks like this:
.story {
font-family: arial, sans serif;
font-size: 14px;
background: #ffffff;
}
then just add the url to it like so:
.story {
font-family: arial, sans serif;
font-size: 14px;
background: #ffffff url(background.gif);
}
IF the theme you are modifying doesn't have a class, then just make one up but don't select any already being used. Pick any name but hopefully one that's meaningful to you. Add the background attribute as described above. For example:
.regularstory {
background: #ffff00 url(prettybackground1.gif);
}
.featuredstory {
background: #cccccc url(prettybackground2.gif);
}
It's a good idea to include a color just in case the background image doesn't display for some reason to the visitor. Set the background color to whatever you want. Now take your made up classes and put them in your style sheet.
Inside the theme files, you need to add the class so the browser knows to display it. If you want the background to display in a row, then place the class in your theme like this:
<tr class="regularstory">
or if you want it in a column like this:
<td class="regularstory">
Place one class in your story template and one in your featured story template. You can make the classes the same or different -- your choice.
Make sure the url used inside url() points to where the images are. On some servers, you can just put the relative path (eg ../images/prettybackground.gif) and on others you have to specify the complete path (eg http://yourdomainname/pathtobackground/prettybackground.gif)
That's it.
Text Formatted Code
background: url(background.gif);
or
background-image: url(background.gif);
If the class already has the background defined, then just add the url to it. For example, if the class looks like this:
Text Formatted Code
.story {
font-family: arial, sans serif;
font-size: 14px;
background: #ffffff;
}
Text Formatted Code
.story {
font-family: arial, sans serif;
font-size: 14px;
background: #ffffff url(background.gif);
}
Text Formatted Code
.regularstory {
background: #ffff00 url(prettybackground1.gif);
}
.featuredstory {
background: #cccccc url(prettybackground2.gif);
}
Inside the theme files, you need to add the class so the browser knows to display it. If you want the background to display in a row, then place the class in your theme like this:
Text Formatted Code
<tr class="regularstory">
Text Formatted Code
<td class="regularstory">
Make sure the url used inside url() points to where the images are. On some servers, you can just put the relative path (eg ../images/prettybackground.gif) and on others you have to specify the complete path (eg http://yourdomainname/pathtobackground/prettybackground.gif)
That's it.
5
9
Quote
All times are EST. The time is now 03:27 pm.
- Normal Topic
- Sticky Topic
- Locked Topic
- New Post
- Sticky Topic W/ New Post
- Locked Topic W/ New Post
- View Anonymous Posts
- Able to post
- Filtered HTML Allowed
- Censored Content