Joomla Tutor

XTypo is a GPL joomla mambot / plugin that able to produce an extra nice css styling to your joomla content. With this plugin, you don't need anymore to put any hard code css into your template css just to get an extra css styling for your content. Just install and publish this plugin and get your extra css easily with adding a string like this : {xtypo_alert} . . . {/xtypo_alert} , {xtypo_quote} . . . {/xtypo_quote} etc , into your joomla content. Another good news is, this plugin also configurable, so you can modify the styling looks from the backend parameter. You can change the icon, define the border size, define the padding, etc ... and then create your own new styling

We use Xtypo plugin for this content typography. Xtypo plugin is a Free Joomla Plugin from TemplatePlazza.com that will produce a Nice Web 2.0 CSS Styling from any text in your joomla articles. This plugis in is configurable, you can change the look of the styling from backend parameter.
Feel free to download this plugin from templateplazza download section

I've seen too much :o) 12244567890!@#$%^&*()_+~ This is a sample of the 'xtypo_alert' style. You can use this style to denote specific information to your users. To use this style use the folllowing code: {xtypo_alert} . . . { /xtypo_alert}

I've seen too much :o) This is a sample of the 'xtypo_info' style. You can use this style to denote specific information to your users. To use this style use the folllowing code:{xtypo_ info} . . . { /xtypo_info}

This is a sample of the 'xtypo_warning' style. You can use this style to denote specific information to your users. To use this style use the folllowing code: {xtypo_warning} . . . {/xty po_warning}

This is a sample of the 'xtypo_sticky' style. You can use this style to denote specific information to your users. To use this style use the folllowing code:{xtypo_sticky} . . . { /xtypo_sticky}

This is a sample of the 'xtypo_feed' style. You can use this style to denote specific information to your users.
To use this style use the folllowing code:{xtypo_feed} . . .{ /xtypo_feed}

This is a sample of the 'xtypo_download' style. You can use this style to denote specific information to your users. To use this style use the folllowing code:{ xtypo_download} . . . {/xtypo_download }

Below is a sample of the 'xtypo_code' style. You can use this style to publish a piece of programming code to your users.

defined( '_VALID_MOS' ) or die( 'Restricted access' );
// needed to seperate the ISO number from the language file constant _ISO
$iso = explode( '=', _ISO );
// xml prolog
echo '';
?>p.rightalign {
text-align: right;
}
.red {
color: #c00;
}
.green {
color: #0c0;
}

To use the xtypo_code style use the folllowing code: { xtypo_code}. . . { /xtypo_code}

This is a sample of the 'xtypo_quote' style. You can use this style to quote a piece of content to your users. To use the xtypo_quote style use the folllowing code: {xtypo_quote}. . . { /xtypo_quote}

This is a sample of the 'left aligned xtypo_quote' style. You can use this style to quote a piece of
content to your users. To use this style use the folllowing code:{xtypo_quote_left}. . .{ /xtypo_quote_left}

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie. Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum condimentum facilisis nulla. In hac habitasse platea dictumst. Nulla nonummy. Cras quis libero. Cras venenatis. Aliquam posuere lobortis pede. Nullam fringilla urna id leo. Praesent aliquet pretium erat. Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor.

This is a sample of the 'left aligned xtypo_quote' style. You can use this style to quote a piece ofcontent to your users. To use this style use the folllowing code:{xtypo_quote_right}. . . {/xtypo_quote_right }

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie. Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum condimentum facilisis nulla. In hac habitasse platea dictumst. Nulla nonummy. Cras quis libero. Cras venenatis. Aliquam posuere lobortis pede. Nullam fringilla urna id leo. Praesent aliquet pretium erat. Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor.

his is a sample of the 'xtypo_dropcap' style. You can use this style to give a nice dropcap
styling to your content.

To use the xtypo_dropcap style use the folllowing code: {xtypo_dropcap} T {/xtypo_dropcap } is is a dropcap

Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor.

Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor. Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor.

Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor.

Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor. Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor.

Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor.

Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor. Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor.

Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor.

Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor. Praesent non odio. Pellentesque a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor.

To use the button styles above you can use the folllowing codes: { xtypo_button1} Button 1 { /xtypo_button1} , { xtypo_button2} Button 2{ /xtypo_button2} , { xtypo_button3} Button 3 { /xtypo_button3}

Demo : Here
Download : Available for Free