Capabilities

  • Easily Create a Cap for a Starting Paragraph

  • Three Main Cap Styles

  • All Google Fonts or Font Awesome Icons for Main Character

  • Responsive Sizing on Small Screens

  • Size Main Character from Small to Huge

  • Main Character, Shadow & Background Color Control

  • Background Transparency

  • Twenty Two Shadow Styles

  • Main Character & Body Text Alignment

  • Body Text First Line Indent

  • Justify Body Text

  • Size Adjustment of Background

  • Border Width, Six Border Styles, Border Transparency Option, Border Color & Corner Radius

  • Background Shadow Size & Color

  • Font Awesome Icon Review

  • Background Image Drop In / Resources / Warehouse Folder Support

  • Background Image Sizing Helper

Stack Settings

InitialisPro Settings:

Current Version: 1.0.0
  • ➀ 

    Letter:  Set the letter for the main character

  • ➁ 

    Font:  Set a web-safe font for the letter

  • ➂ 

    Font Weight:  Select the font weight for the letter

  • ➃ 

    Font Style:  Select the font style for the letter

  • ➄ 

    Use Google Font:  Enable to use a google font for the letter - Note: overrides Font, Font Weight & Font Style

  • ➅ 

    Google Font:  Enter name of google font for the letter (No quotes)

  • ➆ 

    Google Wt:  Only enter google font weight for the letter if it's anything other than normal(400)

  • ➇ 

    Use Font Awesome Icon:  Enable to use font awesome icon instead of letter

  • ➈ 

    Font Awesome:  Enter font awesome icon name - Use Font Awesome Review to see names

  • ➉ 

    FA Link:  Choose link for font awesome icon

  • ➀➀ 

    Font Awesome Review:  Enable to see font awesome icons in Edit Mode (Disable for Publish)

  • ➀➁ 

    Font Size:  Set the font size of the main character

  • ➀➂ 

    Character:  Set the color of the main character

  • ➀➃ 

    Shadow Style:  Set the shadow style of the character

  • ➀➄ 

    Shadow:  Set the color of the main character shadow

  • ➀➅ 

    Cap Style:  Select the cap alignment style

  • ➀➆ 

    Vert. Align:  Adjust vertical position of main character

  • ➀➇ 

    Top Space:  Adjust space between main character and top edge of background

  • ➀➈ 

    Right Space:  Adjust space between main character and right edge of background

  • ➁⓪ 

    Bottom Space:  Adjust space between main character and bottom edge of background

  • ➁➀ 

    Left Space:  Adjust space between main character and left edge of background

  • ➁➁ 

    First Line Indent:  Adjust first line indent of body text

  • ➁➂ 

    Fix 1st Letter Clipping:  Enable to fix clipping of the first letter of the body text

  • ➁➃ 

    Top Padding:  Adjust top padding of body text - Use to vertically align text w/ main character

  • ➁➄ 

    Side Padding:  Adjust space between right edge of background and body text

  • ➁➅ 

    Bottom Padding:  Adjust space between bottom edge of main character and body text

  • ➁➆ 

    Justify Text:  Set the body text to a justified style

  • ➁➇ 

    Background:  Set background color behind main character

  • ➁➈ 

    BG Color Opacity:  Set background color opacity

  • ➂⓪ 

    BG Border Width:  Set background border width

  • ➂➀ 

    BG Border Radius:  Set background border radius

  • ➂➁ 

    BG Border Style:  Select the background border style

  • ➂➂ 

    BG Border:  Set background border color

  • ➂➃ 

    Border Transparency:  Set the border to match transparency of background color

  • ➂➄ 

    BG Shadow:  Set background shadow color

  • ➂➅ 

    Shadow Hor:  Set the horizontal shadow amount of the background, px Note-neg. values are allowed

  • ➂➆ 

    Shadow Vert:  Set the vertical shadow amount of the background, px Note-neg. values are allowed

  • ➂➇ 

    Shadow Blur:  Set the blur shadow amount of the background, px

  • ➂➈ 

    Use BG Image:  Enable to set background image behind main character

  • ➃⓪ 

    Image Source:  Select the image source method you wish to use

  • ➃➀ 

    BG Image:  Set a background image

  • ➃➁ 

    Image Folders:  Select either Resources or Warehouse - Note: Select 'Not Used' if using Drop In

  • ➃➂ 

    Resources Image:  Enter path in Resources & image name

  • ➃➃ 

    Warehouse Image:  Enter path to warehouse folder & image name

  • ➃➄ 

    Alt Tag:  Set the alt attribute text for the background image

  • ➃➅ 

    Show Image Size:  Display suggested size of the background image behind main character (Disable for Publish)

  • ➃➆ 

    Resize on Small Screen:  Resize if viewed on smaller mobile phone screens

Demo

Drop Style

D
  Width:
px
  Height:
px
Text surrounds your capital initial.
Lorem ipsum dolor sit amet, consect adipiscing elit. Maecenas elementum nos de odio nec felis. Odio nos de a nec felis. Elementum nos de pan nec fanta. Felis aliquet egestas vitae, erst lectus nibh ante quis quis dolor sed mauris nos de a nec sem ut.

Margin Style

M
  Width:
px
  Height:
px
Capital initial to side of text.
Lorem ipsum dolor sit amet, consect adipiscing elit. Maecenas elementum nos de odio nec felis. Odio nos de a nec felis. Elementum nos de pan nec nos de a nec elis aliqut.

Baseline Style

B
  Width:
px
  Height:
px
Capital initial at first text line. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas elementum nos de odio nec felis. Odio nos de a nec felis. Elementum nos de pan nec elis aliquet egestas vitae.

Six Border Styles

S
  Width:
px
  Height:
px
Lorem ipsum dolor sit amet, consect adipiscing elit. Maecenas elementum nos de odio nec felis. Odio nos de a nec felis. Elementum nos de pan nec fanta. Felis aliquet egestas vitae, erst lectus nibh ante quis quis dolor sed.

Font Awesome Icons

A
  Width:
px
  Height:
px
See the entire icon library below. Lorem ipsum dolor sit amet, consect adipiscing elit. Maecenas elementum nos de odio nec felis. Odio nos de a nec felis. Elementum nos de pan nec fanta. Felis aliquet egestas vitae dolor sed.

BG / Border Opacity

O
  Width:
px
  Height:
px
Lorem ipsum dolor sit amet, consect adipiscing elit. Maecenas elementum nos de odio nec felis. Odio nos de a nec felis. Elementum nos de pan nec fanta. Felis aliquet egestas vitae, erst lnec felix de lectus nibhir ante quis quis dolor sed.

And to Make a Good Impression...

A
  Width:
px
  Height:
px
Support for the entire Google web font library, twenty-two different character shadow styles, custom background image support and more...

Try out the InitialisPro Demo - It'll make your page stand out !
Note: 'InitialisPro Demo Version' will appear within the stack - but it's fully functional for you to try out.

Font Awesome Icon Collection

Web Application Icons
  • adjust
  • asterisk
  • ban-circle
  • barcode
  • beaker
  • beer
  • bell
  • bell-alt
  • bolt
  • book
  • bookmark-empty
  • briefcase
  • bullhorn
  • calendar
  • camera
  • camera-retro
  • certificate
  • check
  • check-empty
  • circle
  • circle-blank
  • cloud
  • cloud-download
  • cloud-upload
  • coffee
  • cog
  • cogs
  • comment
  • comment-alt
  • comments
  • comments-alt
  • credit-card
  • dashboard
  • desktop
  • download
  • download-alt
  • edit
  • envelope
  • envelope-alt
  • exchange
  • exclamation-sign
  • external-link
  • eye-close
  • eye-open
  • facetime-video
  • fighter-jet
  • film
  • filter
  • fire
  • flag
  • folder-close
  • folder-open
  • folder-close-alt
  • folder-open-alt
  • food
  • gift
  • glass
  • globe
  • group
  • hdd
  • headphones
  • heart
  • heart-empty
  • home
  • inbox
  • info-sign
  • key
  • leaf
  • laptop
  • legal
  • lemon
  • lightbulb
  • lock
  • unlock
  • magic
  • magnet
  • map-marker
  • minus
  • minus-sign
  • mobile-phone
  • money
  • move
  • music
  • off
  • ok
  • ok-circle
  • ok-sign
  • pencil
  • picture
  • plane
  • plus
  • plus-sign
  • print
  • pushpin
  • qrcode
  • question-sign
  • quote-left
  • quote-right
  • random
  • refresh
  • remove
  • remove-circle
  • remove-sign
  • reorder
  • reply
  • resize-horizontal
  • resize-vertical
  • retweet
  • road
  • rss
  • screenshot
  • search
  • share
  • share-alt
  • shopping-cart
  • signal
  • signin
  • signout
  • sitemap
  • sort
  • sort-down
  • sort-up
  • spinner
  • star
  • star-empty
  • star-half
  • tablet
  • tag
  • tags
  • tasks
  • thumbs-down
  • thumbs-up
  • time
  • tint
  • trash
  • trophy
  • truck
  • umbrella
  • upload
  • upload-alt
  • user
  • user-md
  • volume-off
  • volume-down
  • volume-up
  • warning-sign
  • wrench
  • zoom-in
  • zoom-out
Text Editor Icons
  • file
  • file-alt
  • cut
  • copy
  • paste
  • save
  • undo
  • repeat
  • text-height
  • text-width
  • align-left
  • align-center
  • align-right
  • align-justify
  • indent-left
  • indent-right
  • font
  • bold
  • italic
  • strikethrough
  • underline
  • link
  • paper-clip
  • columns
  • table
  • th-large
  • th
  • th-list
  • list
  • list-ol
  • list-ul
  • list-alt
Directional Icons
  • angle-left
  • angle-right
  • angle-up
  • angle-down
  • arrow-down
  • arrow-left
  • arrow-right
  • arrow-up
  • caret-down
  • caret-left
  • caret-right
  • caret-up
  • chevron-down
  • chevron-left
  • chevron-right
  • chevron-up
  • circle-arrow-down
  • circle-arrow-left
  • circle-arrow-right
  • circle-arrow-up
  • double-angle-left
  • double-angle-right
  • double-angle-up
  • double-angle-down
  • hand-down
  • hand-left
  • hand-right
  • hand-up
  • circle
  • circle-blank
Video Player Icons
  • play-circle
  • play
  • pause
  • stop
  • step-backward
  • fast-backward
  • backward
  • forward
  • fast-forward
  • step-forward
  • eject
  • fullscreen
  • resize-full
  • resize-small
Social Icons
  • phone
  • phone-sign
  • facebook
  • facebook-sign
  • twitter
  • twitter-sign
  • github
  • github-alt
  • github-sign
  • linkedin
  • linkedin-sign
  • pinterest
  • pinterest-sign
  • google-plus
  • google-plus-sign
  • sign-blank
Medical Icons
  • ambulance
  • beaker
  • h-sign
  • hospital
  • medkit
  • plus-sign-alt
  • stethoscope
  • user-md