Subscribe Here RSS or Email

5/5/08

Make the first letter of your paragraph larger the easy way

0 comments Buzz Here
I have tried the drop cap using Microsoft Format Menu but get tired of cut and paste, i find it more work and their are times it didn't work. I have tried the other methods and have the same situation, frustration and i end up editing my post because the letter just don't follow to what i want.

Dropcap will actually add attraction to your content.

What is Dropcap?
A larger letter at the beginning of your paragraph...larger than the rest of the letters.

I search about this and there many ways to use dropcap, but i will just share the simple and easy way to have this in your blog.

What do you need?
You need is to follow the simple instruction and your done. You need to have an access to your html template because we are going to use CSS (Cascading Style Sheet) -- This is where you command and instruct your text on how they will appear on the web page.

Here's what to do, follow this easy steps.
  1. Go to your Dashboard, open Layout and then edit HTML
  2. MUST: Before editing your template, make sure you save a copy of your template. Make sure you click Download Full template.
  3. Look for this </b:skin>
  4. Place the below code before </b:skin>
.dropcap {
float: left;
font: normal 60pt/0.8em Georgia,
Helvetica, Verdana, Arial,
sans-serif;
color: yellowgreen;
margin-right: 3px;
}
Then Save your template.

Note: For the beginners or the one's that are not so familiar with CSS, it maybe hard for you to find the Step 3, to make this easy hit Ctrl+F then type </b:skin>

If you want to change the color of the first letter to match to your template, you can. Just replace the one i colored green using with any color you like or if you want to use the hex color code just replace the above code with below code and replace the #F5F5F5 with color of your choice from the color code chart.
color: #F5F5F5;
Just do whatever you like with the color, experiment and have fun.

After you have placed the style of your dropcap, we need to save an html to your post template -- follow this next steps.
  1. Go to Settings
  2. look for the formatting menu
  3. Scroll down until you find Post Template
  4. Copy the below code
<p>
<span class="dropcap">T</span>his starts with a dropcap.
</p>

Save Setting.

Make a new post and see how you like it.

There are other bloggers that i have seen using different approach, they used different font, they make it look fancy.

For more dropcaps try this:
mandarin design
Learning jquery
tjkdesign
fancy dropcaps

Look for the fancy Initials? You can download it from dafont.

I hope you followed my instructions and enjoyed it as much as i do. Please check my other tips and tricks and start tweaking and make your site look attractive.

If your new here please don't forget to subscribe to my RSS or by email. Please come back for more tips and tricks.


Related Posts by Categories



0 comments:

Post a Comment

I really love to read your thoughts, Reminder though that I Moderate my blog, If your intention is only to spam think twice.

For those that will comment because you want to share your thoughts i really appreciate your time. "Dofollow" Rules.

 

  © Blogger template 'tbn' by thebuzznutter 2008

Bring me to TOP