Saturday, June 1, 2013

Shadows and Post Titles

Hola. :)

Today, I'm going to be talking about two different CSS rules that have to do with two different types of templates: Simple and Ethereal.

On the Simple template, you will notice that all of your pictures have a sometimes rather annoying shadow. If this is there, you simply can't make a white picture blend with the rest of the template and look professional. So how do we get rid of that?

On the Ethereal template, when you hover over the post title, you'll get an underline. Some people might like that, but for me, it doesn't look professional. How do you get rid of that underline?

These are the two questions that I'm going to be answer in this post.

How to get rid of the shadow on Simple templates:
1. Log in.
2. Click on the blog you want to edit.
3. Get your blog into a Simple template or click customize if you already have.
4. Go to Advanced.
5. Scroll down and click CSS.
6. Paste this code:


.post-body img, .post-body .tr-caption-container, .Profile img, .Image img,
.BlogList .item-thumbnail img {
  padding: none !important;
  border: none !important;
  background: none !important;
  -moz-box-shadow: 0px 0px 0px transparent !important;
  -webkit-box-shadow: 0px 0px 0px transparent !important;
  box-shadow: 0px 0px 0px transparent !important;
}


7. Click return and then save template.
8. Click "back to blogger" and see how your blog looks!! :)
Note: when you're on the template editor, it will not show the effects of the CSS code. It will only show the effects once you are on your blog.

How to get ride of the underline on post titles on the Ethereal template:
1. Log in.
2. Click on the blog you want to edit.
3. Get your blog into an Ethereal template or click customize if you already have.
4. Go to Advanced.
5. Scrolls down and click CSS.
6. Paste this code:


h3.post-title a,
h3.post-title a:visited
{
text-decoration:none !important;
}


7. Click return and then save template.
8. Click "back to blogger" and see how your blog looks!! :)
Note: when you are on the template editor, you can't hover over links, so like before you'll have to go onto your blog to see the works. ;)

Hope this was helpful!! :)

6 comments:

  1. How to you get your post titles to italicize when your mouse hovers over it?

    ReplyDelete
  2. Hey,
    I just wanted to request a header and button for a blog I'm starting with some friends called, "The Authors Club" with the description "Stories by Six Friends"

    Need it fairly quickly thanks :)
    Your Friend
    Sarah

    ReplyDelete

be kind • be polite • be amazing