Saturday, December 31, 2011

Removing Border and Shadow from Selected Images in Blogger Dynamic View

Previously, I wrote a tutorial on how you can remove borders and shadows from your pictures, in a Dynamic View template. The tweak applies to all the pictures in your blog. Blog reader Filipe wants to know if it is possible to remove borders and shadows from a single image alone, instead of applying the tweak to all images. Yes, it is possible, and here's how.


Step 1:

If you're using the old Blogger interface: Go to Dashboard - Design - Template Designer - Advanced - Add CSS - paste the following code - Press enter after the last character of the last line } - Apply to Blog.

If you're using the new Blogger interface: Go to Dashboard ('House' symbol) - Template - Customize - Advanced - Add CSS - paste the following code - Press enter after the last character of the last line } - Apply to Blog.
.ss, .noborderdv img{
box-shadow: none !important;
padding: 0px !important;
border: 0px !important;
}

Step 2: 

Compose a post, and upload an image. Once you've inserted the image to your post editor, click on 'HTML' to view its HTML content. This is what you will see:



Step 3: 

Change the word 'separator' in the very first line, to 'noborderdv'. This is what your HTML should look like now.


And that's it. To relieve a picture from its border and shadows, just change 'separator' to 'noborderdv', and that image alone will be shadowless and borderless.

Happy 2012 everyone!

Elm0D

Author & Editor

Has laoreet percipitur ad. Vide interesset in mei, no his legimus verterem. Et nostrum imperdiet appellantur usu, mnesarchum referrentur id vim.

0 comments:

Post a Comment

Navigate» Become author for this Blog

Manual Categories