Add Shadow Effects

Hello and nice to meet all of you again readers. Now, you have come to the right time and right post because you will learn something special that rarely found in blogging. That special thing that I had said just now is "Adding Shadow Effect". For your information, we can add/put shadow effect at the texts or words that we wrote. If you want to learn how to do it, you just need to follow the four, fast easy steps below.






Step #1:
Log in to your blogger like usual using your blog ID. Go to your Layout and choose Edit HTML tab. Back up your template. Click at the Download Full Template. Tick at the Expand Widget Templates.

Step #2:

Use Ctrl+F and search for this ]]></b:skin> tag. Copy and paste this code above the ]]></b:skin> tag

.syafzpic-shadow {
color: #222;
font-size: 14px;
font-family: helvetica, tahoma, arial;
text-shadow: 0px 2px 3px #555;
}

Step #3:

Save template.

Step #4:

In every section you want this shadow effect to be worked, you just need to add this code:

<div class="syafzpic-shadow" >

PUT YOUR TEXT HERE

</div>

For example:

Example 1: without link

<div class="syafzpic-shadow" >

 Blogger Tips and Style

</div>

Example 2: with link

<div class="syafzpic-shadow" >

<a class="syafzpic-shadow" href="PUT TARGET LINK HERE"><strong>Welcome to MyBlog</strong></a>

</div>

You can replace the blue text above with your own text.Also do not forget to change the PUT TARGET LINK HERE with your target link(url).

For any question, please leave a comment...

Credits:
1. syafzpic.com

InspiredMagz.com