Single Image Border Style

Lasha Member
Located in the "template-fuctions.php" file of the "zen" folder in the main directory is this code:

`function printDefaultSizedImage($alt, $class=NULL, $id=NULL) {

echo "\
" width=\"" . getDefaultWidth() . "\" height=\"" . getDefaultHeight() . "\"" .

(($class) ? " class=\"$class\"" : "") .

(($id) ? " id=\"$id\"" : "") . " />";

}`

And it produces the <img> tag linking to the image to display when viewing a picture in a gallery. How would one add a style tag within this code to give it something like a 3px border?

Here is the code located in "image.php" of the theme's folder:

`" title="<?php echo getImageTitle();?>">

<?php printDefaultSizedImage(getImageTitle()); ?>
`

When that renders in an actual browser, something like this shows:

`

Fence
`

In the <img> tag above, I'd like to figure out how to add a <style> tag so I can get a border onto the IMAGE itself, and not its container.

If anyone needs me to go further into the detail of what I'm talking about, let me know. Mainly, I'm guessing someone with PHP knowledge will know how to add a <style> tag into a <?php ?> area with proper syntax. Maybe a developer, etc.?

Thank you so much!

Comments

  • Hello Lasha,

    You don't have to insert a <style> tag in the middle of this php script to insert a border, or whatever style element you want to use.

    In fact, each theme (using the image.php in your theme folder for example) use a stylesheet: it's a file describing only the style of the page, usually for zenphoto's themes it's zen.css.

    All you have to do, is looking after the line describing the style of the image. For the default theme, on line 100 of zen.css, you have "border: 0;" just replace it by "border: 3px solid black;" for example.

    Just edit your theme's stylesheet and make some modifications. But don't touch to template-functions.php ! ;)

    Have fun.
  • Lasha Member
    Wow, that actually worked! I didn't quite think of that method to get a border onto the individual images. In the default theme, the individual image is in between a <div> tag with an ID of "image", and I added this CSS code to only give a border to image tags contained within divs named "image" like this:

    #image img {border: 3px solid #999999;
    }

    Seems like a pretty good way to get this done. I'll try and see if I can get this done in other themes as well. Thanks a bunch, man!
Sign In or Register to comment.