Icons/Images not showing

[krembo99]

It seems I have encountered an odd problem, or maybe I am just mising the obvious here :

I can't change (or add) images to the basic template ..
somehow, if i try to change for example the RSS text link to an image/Icon link, the image is not showing(or in some cases, it showes only 1 or 2 rows of pixels... (using IMG)

It is surely a simple CSS error, but it is driving me crazy :-)

[dakwegmo]

Perhaps a link to this odd behavior?

One thing to keep in mind when adding images, is that when the template loads it's going to displayed in the root of your photoblog, so any paths to images need to account for that.

[krembo99]

Sorry .. I can not post a link for 2 reasons :

1. - If I will post a link, You will not see the problem, you will just see a normal installation of the templte, because the picture is not showing :-)

2. - I do not have it on a server yet, but in a localhost install on my computer

But as i said before , except for the images not showing, you see almost nothing ifferent.

Just take the default installation of PP , and in the browse_template.html try to change the words "valid CSS" for example with <img src="../../images/something" /> .

The result of that , is nothing for me .
and so is the case if I add a new <div > </div> with an image inside. (for example at the end of the page, just before the body closure...
the div creates a table , but no image is shown. strange, eh ??

[dakwegmo]

There are some pretty smart people on the boards here who know PixelPost pretty well and could probably figure out the problem with enough information. Since you really haven't given me much to go on, I'm going to make some broad assumptions. The footer for simple template's browse_template.html looks like this:

<div id="footer">
Site Style: <a href="#" onclick="setActiveStyleSheet('light'); return false;">Light</a> /
<a href="#" onclick="setActiveStyleSheet('dark'); return false;">Dark</a>&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;<SITE_RSS_LINK> / <SITE_ATOM_LINK>&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;
<a href="http://validator.w3.org/check/referer" title="This website uses Valid xHTML">Valid xHTML</a> / <a href="http://jigsaw.w3.org/css-validator/check/referer" title="This website uses Valid CSS2">Valid CSS</a>
</div>

If you want to change the link for valid css, you would only need to change this line:

<a href="http://jigsaw.w3.org/css-validator/check/referer" title="This website uses Valid CSS2">Valid CSS</a>

to something like this
<a href="http://jigsaw.w3.org/css-validator/check/referer" title="This website uses Valid CSS2"><img src="path/to/your/image.jpg"></a>

If you're trying to change the RSS link URL, you won't be able to use, the PP RSS tag, so you'll have to remove it and replace it with the feed URL and your image.
This:
&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;<SITE_RSS_LINK>

Becomes:
&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;<a href="http://yourdomain.com/path/to/pixelpost/index.php?x=rss"><img src="path/to/your/image.jpg"></a>

And if you need more specific help, you will need to either post the code, or provide us with some other way to see the odd behavior.

[Dennis]

True, when you post the link you won't see the image. But we will see the code. And that beats an image every time :)

[krembo99]

Hi...
well, when i tried to put he images, I did exactly what you later did

I have uploaded images to show what is happening:

This is the normal link :
http://img150.imageshack.us/img150/4926/20071030sitopplinkrn9.jpg

this is how it looks in the code and in the HTML editor :
http://img89.imageshack.us/img89/9109/20071030sitopplinkcodemw6.jpg


and this is how the result looks in the browser (firefox)
http://img152.imageshack.us/img152/8250/20071030sitopplinkimagell9.jpg

see that small gray line? that is the presumed image (the pixel button you see in the HTML editor)

Is the problem more clear now? anyone had that problem before??

[dakwegmo]

See my original reply to your question for a hint at the answer, then see my last reply for a more thorough examination of the answer. Specifically though, you need to remove the ../../ from your image's source path. The reason for this is as I mentioned in my first reply

...when the template loads it's going to displayed in the root of your photoblog, so any paths to images need to account for that.

Alternatively, you could move the image file into your template directory, then change the path to the image to: templates/your_template/images/world-citizen.jpg

Either way though, the image won't show up in the design view of your HTML editor, because it's assuming a path relative to the document browse_template.html, not the actual document that calls the code which is /index.php.

[krembo99]

Thanks ..

I have resolved the problem by re-writing the CSS (something I had to do anyhow for my template) . I do not know what the problem was , but it is resolved now.

Thanks anyhow ...