How to build the boxes on Transfer theme

powerplay1989 · August 2015

I would like to know how to create the 3 boxes and the Curabitur porta blandit lectus box and how to put that divider in-between it.

http://themes.muffingroup.com/be/transfer/

leapedu.com/wp-content/uploads/2014/10/Screen-Shot-2015-08-06-at-5.08.28-PM.png

&

leapedu.com/wp-content/uploads/2014/10/Screen-Shot-2015-08-06-at-5.08.35-PM.png

Albert · August 2015

Hi,

for these elements we used "Column" item with some html inside.

For this one http://leapedu.com/wp-content/uploads/2014/10/Screen-Shot-2015-08-06-at-5.08.28-PM.png, we used below html:

<div style="border: 1px solid #b2c0cd; background: #fff;">
<div style="padding: 30px 10%; border-bottom: 1px solid #b2c0cd">
[image src="http://themes.muffingroup.com/be/transfer/wp-content/uploads/2015/06/home_transfer_icon_1.png" border="0"]
</div>
<div style="padding: 30px 20px 10px; text-align: center;">
<h3>We will call you back</h3>
<p>Etiam venenatis eu ante in tincidunt. Donec finibus tellus posuere justo. Integer at neque</p>
[button title="See more" link="#" color="theme"]
</div>
</div>

but for this http://leapedu.com/wp-content/uploads/2014/10/Screen-Shot-2015-08-06-at-5.08.35-PM.png we used below:

<div style="border: 1px solid #b2c0cd; padding: 30px 20px 10px; background: #f2f8ff;" class="clearfix">

[one]
<h4>Curabitur porta blandit lectus</h4>
[/one]

[one_second]
<div style="border-right: 1px solid #b2c0cd; padding: 10px 8% 2px 0; margin-right: -2%;">
<span style="display: block; color: #0032ab; font-size: 36px; line-height: 36px; font-weight: 500; margin-bottom: 15px; font-family: Exo;">234 000</span>
<p><a style="font-weight: 700;" href="#">Pellen tesque habitant</a> morbi tristique senectus et netus et malesuada fames ac cras amet.</p>
</div>
[/one_second]

[one_second]
<div style="padding: 10px 0 2px 4%;">
<span style="display: block; color: #0032ab; font-size: 36px; line-height: 36px; font-weight: 500; margin-bottom: 15px; font-family: Exo;">5 455 000</span>
<p>Sed <a style="font-weight: 700;" href="#">molestie</a> dui eget ornare tincidunt. Maecenas blandit luctus elit tristique  volutpat tellus.</p>
</div>
[/one_second]

</div>

Next time we recommend to create additional wp instance so you can import demos and check how some things were made. This is the easiest and fastest way.

How to build the boxes on Transfer theme

Comments