Dropcaps Explained

Make your own graphic using the "dropcap-blank.png" image. This image has room for you to add your letter or symbol using an image program, .

The text and dropcap shown below are written in Armenian.

աշտոնական անվանումը արտացոլում է Համբուրգի պատմությունը որպես միջնադարյան Հանզեական լիգայի անդամ և Սրբազան Հռոմեական կայսրության ազատ կայսերական քաղաք:
This graphic is in Armenian.

You would save the image in your img/dropcap folder and insert it on the template settings page.

Use the "Change" button to switch the image to yours.

This image has room for a letter or symbol that is placed over the top of the center line, using your graphics program.

There is a blank image (dropcap-blank2.png) that can be used in the place of the letter. This way, if you want a "fancier" look, you can use this image.

This image can be used in place of the lettered image. Click on the "Change" button to switch to a different dropcap.

 Use coding for inline insertion of the image. If you wanted a dropcap, but it wasn't coded into your template, you can use this code.

<img class="img-left-dropcap" src="templates/template274/img/dropcap/dropcapt.png">

I tried using the just the image code, but it would only work if I used the templates folder with the specific template. If you don't have the "img-left-dropcap" coding in your css, this is the style that you will insert into your templatestyles.css file:

.img-left-dropcap {margin:0 5px 0 0; float: left;}

You can add different images to different languages. You would call the image from the text message input box.

English:

French:

The inline insertion code on the template settings page would look as follows:

Those are easy to do. First, if there is no font dropcap coding, you'll have to add the inline style to your template settings page.

You will need to close the paragraph that was opened on the index.php page by just adding a </p> "Close Paragraph Tag".

Then you will need to open a new paragraph with the dropcap code:
<p class="dropcap">. This adds the dropcap formatting to the paragraph. So your line of code would be:

</p><p class="dropcap">

Works like a charm!