WordPress.org

Support

Support » Themes and Templates » [Resolved] Adding borders to only pasted photos?

[Resolved] Adding borders to only pasted photos?

  • Hello, I run a site called Nicki Daily, and I put updates on WP, photos on Coppermine. When I upload new photos, I put the thumbnails from CPG into a WP post. One link I use for example: http://nickidaily.com/photos/albums/userpics/10013/thumb_ABHMO~0.jpg. I paste that into the post as saving and uploading images would be a lot to do. I want to add a border to the images, using the following code.

    <style>
    body {
    	margin: 0px;
    	padding: 0px;
    	background-color: transparent;
    }
    
    img {
    background-color: #ffffff;
    background-image: url();
    background-repeat:repeat;
    background-position:center center;
    border: 1px solid #cccccc;
    padding: 4px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    }
    
    img:hover {
    background-color: #ffffff;
    background-image: url();
    background-repeat:repeat;
    background-position:center center;
    border: 1px solid #aaaaaa;
    padding: 4px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    }
    
    </style>

    The problem is, I only want those thumbnails to have borders. I don’t want anything else; so is it possible to modify the code to do that?

    Thanks in advance!

Viewing 4 replies - 1 through 4 (of 4 total)
  • esmi

    @esmi

    Forum Moderator

    What exactly do you add to your posts in terms of markup?

    Here’s an example of the HTML in one of my posts that contains the thumbnails:

    I've added three new Angela Boatwright outtakes to the gallery. Two of these are from her 2008 photoshoot for VIBE Magazine and are tagged. They're also in color, unlike some other photos released.
    
    The other outtake I've added is from her 2009 shoot for Honey Magazine. A snippet of it was previously uploaded, but this is the full/UHQ picture. Check them out by clicking on the thumbnails below!
    <p style="text-align: center;"><a href="http://nickidaily.com/photos/thumbnails.php?album=78">Photoshoots > 2008 > Angela Boatwright (VIBE Magazine)</a></p>
    <p style="text-align: center;"><a href="http://nickidaily.com/photos/thumbnails.php?album=78"><img alt="Z1b5jLE.jpg" src="http://nickidaily.com/photos/albums/userpics/10013/thumb_Z1b5jLE.jpg" /><img alt="zOLUlQJ.jpg" src="http://nickidaily.com/photos/albums/userpics/10013/thumb_zOLUlQJ.jpg" /></a></p>
    <p style="text-align: center;"><a href="http://nickidaily.com/photos/thumbnails.php?album=35">Photoshoots > 2009 > Angela Boatwright (Honey Magazine)</a></p>
    <p style="text-align: center;"><a href="http://nickidaily.com/photos/thumbnails.php?album=35"><img alt="ABHMO~0.jpg" src="http://nickidaily.com/photos/albums/userpics/10013/thumb_ABHMO~0.jpg" /></a></p>

    [Please post markup between backticks or use the code button. Your posted code may now have been permanently damaged by the forum’s parser.]

    esmi

    @esmi

    Forum Moderator

    You would be far better using:

    <a class="cm" href="http://nickidaily.com/photos/thumbnails.php?album=78">Photoshoots > 2008 > Angela Boatwright (VIBE Magazine)</a>

    and then using something like:

    img.cm {
    display:block;
    amrgin:1.5em 0;
    background-color:#fff;
    border: 1px solid #cccccc;
    padding: 4px;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    }
    
    img.cm:hover {
    border-color:#aaaaaa;
    }

    ^ Thank you!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘[Resolved] Adding borders to only pasted photos?’ is closed to new replies.