IA Item Blocks with items from different packages/plugins

This is how you can create blocks in your *.tpl files when developing templates or plugins/packages.

At vero eos et

posted on October 21

• http://www.subrion.com
• Pagerank 4
• Alexa Rank: 43006

At vero eos et accusam et justo duo dolores et ea rebum. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Stet...

Administrator Business 285 Views

<div class="media ia-item ia-item-bordered" id="itemId">
  <div class="pull-left text-center">
    <img src="http://placehold.it/150x150" class="media-object thumbnail">
    <i class="icon-star icon-orange"></i> 
    <i class="icon-star icon-orange"></i> 
    <i class="icon-star icon-orange"></i>
  </div>
	
  <div class="media-body">
    <h3 class="media-heading"><a href="#">At vero eos et</a></h3>
    <p class="ia-item-date">posted on October 21</p>
    <ul class="unstyled">
      <li><i class="icon-link"></i> <a href="http://www.subrion.com" class="url">http://www.subrion.com</a></li>
      <li><i class="icon-signal"></i> Pagerank 4</li>
      <li><i class="icon-globe"></i> Alexa Rank: <a href="#">43006</a></li>
    </ul>
    <div class="ia-item-body">
      <p>At vero eos et accusam et justo duo dolores et ea rebum. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Stet...</p>
    </div>
  </div>

  <div class="ia-item-panel">
    <a href="#" class="btn btn-small btn-info pull-left"><i class="icon-info-sign"></i></a>
    <a rel="nofollow" href="#" class="btn btn-small btn-info pull-left" title="Edit"><i class="icon-pencil"></i></a>
    <span class="panel-item pull-left"> <i class="icon-user"></i> <a href="#">Administrator</a></span>
    <span class="panel-item pull-right"><i class="icon-folder-open"></i> <a href="#">Business</a></span>
    <span class="panel-item pull-right"><i class="icon-eye-open"></i> 285 Views</span>
  </div>
</div>

You can easily change appearence of items just by adding or removing content. Here is an example of Blog post:

<div class="media ia-item">
  <div class="media-body">
    <h5 class="media-heading"><a href="#">Hello, World!</a></h5>
    <p class="ia-item-date">Sep 30, 2013</p>
    <p class="ia-item-body"> It's my first blog entry! </p>
  </div>
</div>
<div class="media ia-item ia-item-bordered">
  <div class="media-body">
    <h5 class="media-heading"><a href="#">Hello, World!</a></h5>
    <p class="ia-item-date">Sep 30, 2013</p>
    <p class="ia-item-body"> It's my first blog entry! </p>
  </div>
</div>
<div class="media ia-item ia-item-bordered">
  <div class="media-body">
    <h5 class="media-heading"><a href="#">Hello, World!</a></h5>
    <p class="ia-item-date">Sep 30, 2013</p>
    <p class="ia-item-body"> It's my first blog entry! </p>
  </div>
  <div class="ia-item-panel">
    <span class="panel-item pull-left"> <i class="icon-user"></i> <a href="#">Administrator</a></span>
    <span class="panel-item pull-right"><i class="icon-eye-open"></i> 285 Views</span>
  </div>
</div>