Intro text shortcode

In order to display the intro section on the homepage you have to use the following shortcode:

[pt_section id=”intro-description” class=”intro-description-div”]
[pt_container]
[pt_row]
[pt_column class=”col-lg-12″]
<article>
<div class=”header”>
<div class=”pt_heading text-center”>
<h2>If it’s not personal, It’s not possible!</h2>
<h3>Welcome dear visitor! Short story,  my name is Jessica Smith and I’m a <strong>Personal Trainer</strong> (PT) licensed by the National School of Coaches, ISSA certified specialist in sports, nutrition and fitness school teacher . You can have a look at my portfolio.</h3>
</div>
</div>
</article>
[/pt_column]
[/pt_row]

[pt_row]
[pt_column class=”col-lg-3 col-md-3 col-sm-6 has-animation” delay=”0″]
<div class=”intro-icon-block”>
<i class=”icon eat”></i>
<h2>Eat better</h2>
<p>Homero nominati democritum sit adongue consectetuer no sed. Unum habemus ex alterum impedit.</p>
</div>
[/pt_column]

[pt_column class=”col-lg-3 col-md-3 col-sm-6 has-animation” delay=”200″]
<div class=”intro-icon-block”>
<i class=”icon sleep”></i>
<h2>Sleep tight</h2>
<p>No stet imperdiet expetendis vix, postulant constituam dissentiunt vis ad ex mel exerci delicata.</p>
</div>
[/pt_column]

[pt_column class=”col-lg-3 col-md-3 col-sm-6 has-animation” delay=”400″]
<div class=”intro-icon-block”>
<i class=”icon exercise”></i>
<h2>Exercise</h2>
<p>Eu erat nonumy petentium ha fierent eleifend expetenda sea antiopam voluptatum apeirian scribentur.</p>
</div>
[/pt_column]

[pt_column class=”col-lg-3 col-md-3 col-sm-6 has-animation” delay=”600″]
<div class=”intro-icon-block”>
<i class=”icon lose-weight”></i>
<h2>Lose weight</h2>
<p>Est ad soleat omnesque vulputate. Vivendo nostrum urbanitas vis et, verear aperiam in sea, euismod corrumpit.</p>
</div>
[/pt_column]
[/pt_row]
[/pt_container]
[/pt_section]

The final result is:

intro

You can modify the following parameters:

The intro description wich can contain any html elements. In our case:

<article>
<div class=”header”>
<div class=”pt_heading text-center”>
<h2>If it’s not personal, It’s not possible!</h2>
<h3>Welcome dear visitor! Short story,  my name is Jessica Smith and I’m a <strong>Personal Trainer</strong> (PT) licensed by the National School of Coaches, ISSA certified specialist in sports, nutrition and fitness school teacher . You can have a look at my portfolio.</h3>
</div>
</div>
</article>

For each column:

  • a bootsrap class wich will specify for each resolution the amount of space occupied by that column ( class=”col-lg-3 col-md-3 col-sm-6″ )
  • an animate classs wich will specify if the column should animate and an animation parameter to specify the animation duration ( the amount is in miliseconds ) – ( class=”col-lg-3 col-md-3 col-sm-6 has-animation” delay=”400″ )
  • a representative icon for each column wich can be set using the html i tag with the folowing available classes: eat, sleep, lose-weight ( ex: <i class=”icon sleep”></i> )