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.
Happy 2012 everyone!
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.
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:
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.
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!
Category Article Dynamic View, Tutorial
