Home Version 2 Page Code

Click to preview the Home Version 2 demo. View demo

Preview:

HomeVersion2

BEST POWERFUL TEMPLATE We are a team comprised of (BannerPane)

Code:

html

<div class="home02-banner animation"style="background-image: url('http://demo8.dnngo.net/portals/13/Home02-Images/home02-banner.jpg');"> <div class="banner-bg">&nbsp;</div> <div class="dnn_layout"> <div class="content_mid clearfix"> <div class="banner-title animation_item fadeInLeft delay1">BEST<br />POWERFUL<br />TEMPLATE</div> <div class="banner-content animation_item fadeInLeft delay2">We are a team comprised of experienced employees whose<br />aim is to provide you with skins and modules.</div> <div class="banner-link animation_item fadeInLeft delay3"><a href="#">Purchase This Theme <span class="fa fa-angle-right"></span></a></div> </div> </div> </div>

Welcome To Our Website Nunc at viverra nisl, eu blandit massa est augue cursus in vitae. (TopPane)

Code:

html

<div class="animation pb-10"> <h3 class="home02-title animation_item scaleUp delay1" style="font-weight:600">Welcome To Our Website <span>Nunc at viverra nisl, eu blandit massa est augue cursus in vitae.</span></h3> <div class="home02-cont02 pb-60"> <div class="text_img"><img alt="" src="http://demo8.dnngo.net/portals/13/Home02-Images/home02-img02.png" /></div> <dl class="text_box_1 animation_item fadeInLeft delay1"> <dt>Free supports and updates</dt> <dd>We promise to keep upgrading our skins and modules constantly.</dd> <dd class="line">&nbsp;</dd> </dl> <dl class="text_box_2 animation_item fadeInRight delay2"> <dt>Advanced technology</dt> <dd>Use the most cutting-edge development technology of HTML5 &amp; CSS3.</dd> <dd class="line">&nbsp;</dd> </dl> <dl class="text_box_3 animation_item fadeInLeft delay3"> <dt>Lifetime Services</dt> <dd>Aim to give you and your clients the best user experience</dd> <dd class="line">&nbsp;</dd> </dl> <dl class="text_box_4 animation_item fadeInRight delay4"> <dt>Responsive design</dt> <dd>Compatible with desktops, laptops and mobile devices.</dd> <dd class="line">&nbsp;</dd> </dl> </div> </div>

Custom Styles (Full_Screen_PaneB · 1)

Code:

html

<div class="home02-bg pt-60 pb-60"> <div class="container pt-20 pb-10"> <div class="row animation"> <div class="col-sm-4 animation_item scaleUp delay1"> <div class="home02-ibox"> <div class="ico"><span class="fa fa-space-shuttle"></span></div> <h5>Custom Styles</h5> <p>Sed vel mauris ut libero malesuada posuere quis id risus. Nulla vitae ipsum ac est sagittis luctus at id lacus. Aliquam eu aliquam nisi. </p> <p class="pt-10"><a href="http://store.dnnsoftware.com/home/product-details/PackageID/36589/r/cd57d7207c9d4266bc34" target="_blank">MORE INFORMATION</a></p> </div> </div> <div class="col-sm-4 animation_item scaleUp delay2"> <div class="home02-ibox"> <div class="ico"><span class="fa fa-headphones"></span></div> <h5>Advanced Codes</h5> <p>Sed vel mauris ut libero malesuada posuere quis id risus. Nulla vitae ipsum ac est sagittis luctus at id lacus. Aliquam eu aliquam nisi. </p> <p class="pt-10"><a href="http://store.dnnsoftware.com/home/product-details/PackageID/36589/r/cd57d7207c9d4266bc34" target="_blank">MORE INFORMATION</a></p> </div> </div> <div class="col-sm-4 animation_item scaleUp delay3"> <div class="home02-ibox"> <div class="ico"><span class="fa fa-trophy"></span></div> <h5>Top Sellers</h5> <p>Sed vel mauris ut libero malesuada posuere quis id risus. Nulla vitae ipsum ac est sagittis luctus at id lacus. Aliquam eu aliquam nisi. </p> <p class="pt-10"><a href="http://store.dnnsoftware.com/home/product-details/PackageID/36589/r/cd57d7207c9d4266bc34" target="_blank">MORE INFORMATION</a></p> </div> </div> </div> </div> </div>

ARE YOU READY? (Full_Screen_PaneB · 2)

Code:

html

<div class="home02-bg02 color_white"> <div class="shade pt-60 pb-60"> <div class="container"> <div class="row animation"> <div class="pt-60 pb-60"></div> <div class="home02-cont02"> <h3 class="animation_item scaleUp delay2">ARE YOU READY?</h3> <p class="pt-10 pb-30 animation_item scaleUp delay3">Go to dnngo to choose the best template</p> <p><a href="http://store.dnnsoftware.com/home/product-details/PackageID/36589/r/cd57d7207c9d4266bc34" target="_blank" class="home02-btn animation_item fadeInLeft delay4">CLICK HERE</a><span class="hidden-xs">&nbsp;&nbsp;&nbsp;&nbsp;</span><a class="home02-btn animation_item fadeInRight delay4" href="http://store.dnnsoftware.com/home/product-details/PackageID/36589/r/cd57d7207c9d4266bc34" target="_blank">LET&rsquo;S GO</a> </p> </div> <div class="pt-60 pb-60"></div> </div> </div> </div> </div>

Amazing Portfolios Nunc at viverra nisl, eu blandit massa est augue cursus in vitae. (ContentPane)

Code:

html

<div class="pt-30"> <h3 class="home02-title animation scaleUp">Amazing Portfolios <span>Nunc at viverra nisl, eu blandit massa est augue cursus in vitae.</span></h3> <div class="row pt-30 animation"> <div class="col-md-4 animation_item scaleUp delay1"> <div class="home02-ibox02"> <div class="img"> <a href="#"><img alt="" src="http://demo8.dnngo.net/portals/13/Home02-Images/home02-img03.jpg" /><span class="fa fa-link"></span></a> </div> <div class="title"> <h5>Unlimited Color</h5> <div class="data">May 20th, 2014</div> <div class="love"><span class="fa fa-heart-o"></span>12</div> </div> <p>In nec enim ac mi pharetra tincidunt. Nulla vitae leo augue. Cras congu suscipit odio ut tincidunt. Pellentesque dignissim nibh sed urna euismo at dignissim arcu dapibus. Fusce ac dui eu odio molestie cursus in vitae nisleu est augue.</p> </div> </div> <div class="col-md-4 animation_item scaleUp delay2"> <div class="home02-ibox02"> <div class="img"> <a href="#"><img alt="" src="http://demo8.dnngo.net/portals/13/Home02-Images/home02-img04.jpg" /><span class="fa fa-link"></span></a> </div> <div class="title"> <h5>Modules Development</h5> <div class="data">June 11th, 2014</div> <div class="love"><span class="fa fa-heart-o"></span>73</div> </div> <p>In nec enim ac mi pharetra tincidunt. Nulla vitae leo augue. Cras congu suscipit odio ut tincidunt. Pellentesque dignissim nibh sed urna euismo at dignissim arcu dapibus. Fusce ac dui eu odio molestie cursus in vitae nisleu est augue.</p> </div> </div> <div class="col-md-4 animation_item scaleUp delay3"> <div class="home02-ibox02"> <div class="img"> <a href="#"><img alt="" src="http://demo8.dnngo.net/portals/13/Home02-Images/home02-img05.jpg" /><span class="fa fa-link"></span></a> </div> <div class="title"> <h5>Boxed &amp; Wide Layout</h5> <div class="data">August 08th, 2014</div> <div class="love"><span class="fa fa-heart-o"></span>24</div> </div> <p>In nec enim ac mi pharetra tincidunt. Nulla vitae leo augue. Cras congu suscipit odio ut tincidunt. Pellentesque dignissim nibh sed urna euismo at dignissim arcu dapibus. Fusce ac dui eu odio molestie cursus in vitae nisleu est augue.</p> </div> </div> <div class="clearfix visible-sm">&nbsp;</div> <div class="col-md-4 animation_item scaleUp delay4"> <div class="home02-ibox02"> <div class="img"> <a href="#"><img alt="" src="http://demo8.dnngo.net/portals/13/Home02-Images/home02-img06.jpg" /><span class="fa fa-link"></span></a> </div> <div class="title"> <h5>CSS3 &amp; HTML 5</h5> <div class="data">September 27th, 2014</div> <div class="love"><span class="fa fa-heart-o"></span>56</div> </div> <p>In nec enim ac mi pharetra tincidunt. Nulla vitae leo augue. Cras congu suscipit odio ut tincidunt. Pellentesque dignissim nibh sed urna euismo at dignissim arcu dapibus. Fusce ac dui eu odio molestie cursus in vitae nisleu est augue.</p> </div> </div> <div class="col-md-4 animation_item scaleUp delay5"> <div class="home02-ibox02"> <div class="img"> <a href="#"><img alt="" src="http://demo8.dnngo.net/portals/13/Home02-Images/home02-img07.jpg" /><span class="fa fa-link"></span></a> </div> <div class="title"> <h5>Retina Ready</h5> <div class="data">October 10th, 2014</div> <div class="love"><span class="fa fa-heart-o"></span>57</div> </div> <p>In nec enim ac mi pharetra tincidunt. Nulla vitae leo augue. Cras congu suscipit odio ut tincidunt. Pellentesque dignissim nibh sed urna euismo at dignissim arcu dapibus. Fusce ac dui eu odio molestie cursus in vitae nisleu est augue.</p> </div> </div> <div class="col-md-4 animation_item scaleUp delay6"> <div class="home02-ibox02 xs-pb-0"> <div class="img"> <a href="#"><img alt="" src="http://demo8.dnngo.net/portals/13/Home02-Images/home02-img08.jpg" /><span class="fa fa-link"></span></a> </div> <div class="title"> <h5>Multi-Purpose</h5> <div class="data">December 15th, 2014</div> <div class="love"><span class="fa fa-heart-o"></span>12</div> </div> <p>In nec enim ac mi pharetra tincidunt. Nulla vitae leo augue. Cras congu suscipit odio ut tincidunt. Pellentesque dignissim nibh sed urna euismo at dignissim arcu dapibus. Fusce ac dui eu odio molestie cursus in vitae nisleu est augue.</p> </div> </div> </div> </div>

Top Numbers Nunc at viverra nisl, eu blandit massa (Full_Screen_PaneE · 1)

Code:

html

<div class="home02-bg pt-60 pb-60"> <div class="container pt-20"> <h3 class="home02-title animation scaleUp">Top Numbers <span> Nunc at viverra nisl, eu blandit massa est augue cursus in vitae.</span></h3> <div class="pt-20 row animation"> <div class="col-md-3 col-sm-6 animation_item scaleUp delay1"> <div class="home02-ibox03"> <div data-percent="100" class="decorate color-1"> <div class="fa fa-user"> </div> </div> <div class="animation number" data-number="8036">0</div> <div class="title">Clients</div> <p>Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem massa quismollis pretium. </p> </div> </div> <div class="col-md-3 col-sm-6 animation_item scaleUp delay2"> <div class="home02-ibox03"> <div data-percent="100" class="decorate color-2"> <div class="fa fa-lightbulb-o"> </div> </div> <div class="animation number" data-number="9750">0</div> <div class="title">Hot Skins</div> <p>Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem massa quismollis pretium. </p> </div> </div> <div class="col-md-3 col-sm-6 animation_item scaleUp delay3"> <div class="home02-ibox03"> <div data-percent="100" class="decorate color-3"> <div class="fa fa-paint-brush"> </div> </div> <div class="animation number" data-number="10002">0</div> <div class="title">Reviews</div> <p>Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem massa quismollis pretium. </p> </div> </div> <div class="col-md-3 col-sm-6 animation_item scaleUp delay4"> <div class="home02-ibox03"> <div data-percent="100" class="decorate color-4"> <div class="fa fa-thumbs-o-up"> </div> </div> <div class="animation number" data-number="21040">0</div> <div class="title">Praises</div> <p>Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem massa quismollis pretium. </p> </div> </div> </div> </div> </div>

Testimonials (Full_Screen_PaneE · 2)

Code:

html

<div class="home02-bg03 color_white pt-60 pb-60"> <div class="container animation scaleUp pt-20 pb-20"> <h3 class="home02-title02">Testimonials</h3> <div class="Testimonials_tab home02-Testimonials" data-autoplay="3000" data-autoheight="false"> <ul> <li> <div class="mark"><span class="fa fa-quote-left"></span></div> <blockquote>&ldquo;Suspendisse libero odio, rhoncus nec blandit eget, semper nec mi. Fusce dapibus tellus eu interdum varius. Quisque tempor faucibus turpis sit amet mollis. Vivamus enim ligula, porta vel velit nec, varius sagittis quam. Integer fringilla blandit diam, quis tempus ligula. Sed vel ultricies lacus, in facilisis leo. Vestibulum et turpio.&rdquo;</blockquote> </li> <li> <div class="mark"><span class="fa fa-quote-left"></span></div> <blockquote>&ldquo;In nec enim ac mi pharetra tincidunt. Nulla vitae leo augue. Cras congu suscipit odio ut tincidunt. Pellentesque dignissim nibh sed ur na euismo at dignissim arcu dapibtus. Fusce ac dui eu odio molestie cursus in vitae nisleu est augue, scelerisque ac interdum.&rdquo;</blockquote> </li> <li> <div class="mark"><span class="fa fa-quote-left"></span></div> <blockquote>&ldquo;Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat Nam aliquet rutrum eros eu mattis. Morbi tempus dapibus mattis. Aliquam arcu erat, pharetra vitae consectetur eu, pellentesque eget ipsum.&rdquo;</blockquote> </li> </ul> <div class="dot"><a href="javascript:;"><img alt="" src="http://demo8.dnngo.net/portals/13/Home02-Images/home02-portrait01.jpg" /></a> <a href="javascript:;"><img alt="" src="http://demo8.dnngo.net/portals/13/Home02-Images/home02-portrait02.jpg" /></a> <a href="javascript:;"><img alt="" src="http://demo8.dnngo.net/portals/13/Home02-Images/home02-portrait03.jpg" /></a></div> </div> </div> </div>

Pricing Tables Nunc at viverra nisl, eu blandit massa est augue cursus in vitae. (BottomPane)

Code:

html

<div class="pt-30"><h3 class="home02-title animation scaleUp"> Pricing Tables <span>Nunc at viverra nisl, eu blandit massa est augue cursus in vitae.</span> </h3> <div class="price-table home02-price row animation"> <div class="col-md-3 col-sm-6 animation_item scaleUp delay1"> <div class="price_title"> <h2>STANDARD</h2> </div> <div class="price_holder"> <div class="price_box"> <span class="sup">$</span><span class="price">100</span> <span class="unit">/month</span> </div> <ul> <li>10 Projects</li> <li>30GB Space</li> <li>Unlimited Colors</li> <li>5 Blog Pages</li> <li>Responsive Web</li> </ul> <a href="http://store.dnnsoftware.com/home/product-details/PackageID/36589/r/cd57d7207c9d4266bc34" class="btn ">Buy It Now</a> </div> </div> <div class="col-md-3 col-sm-6 animation_item scaleUp delay2"> <div class="price_title "> <h2>PROFESSIONAL</h2> </div> <div class="price_holder"> <div class="price_box"> <span class="sup">$</span><span class="price">200</span> <span class="unit">/month</span> </div> <ul> <li>20 Projects</li> <li>60GB Space</li> <li>Unlimited Colors</li> <li>10 Blog Pages</li> <li>Responsive Web</li> </ul> <a href="http://store.dnnsoftware.com/home/product-details/PackageID/36589/r/cd57d7207c9d4266bc34" class="btn ">Buy It Now</a> </div> </div> <div class="clearfix visible-sm"></div> <div class="col-md-3 col-sm-6 animation_item scaleUp delay3"> <div class="price_title"> <h2>MAXIMUM</h2> </div> <div class="price_holder"> <div class="price_box"> <span class="sup">$</span><span class="price">300</span> <span class="unit">/month</span> </div> <ul> <li>30 Projects</li> <li>90GB Space</li> <li>Unlimited Colors</li> <li>15 Blog Pages</li> <li>Responsive Web</li> </ul> <a href="http://store.dnnsoftware.com/home/product-details/PackageID/36589/r/cd57d7207c9d4266bc34" class="btn ">Buy It Now</a> </div> </div> <div class="col-md-3 col-sm-6 animation_item scaleUp delay4 xs-mb-0"> <div class="price_title"> <h2>EXTREME</h2> </div> <div class="price_holder"> <div class="price_box"> <span class="sup">$</span><span class="price">400</span> <span class="unit">/month</span> </div> <ul> <li>40 Projects</li> <li>120GB Space</li> <li>Unlimited Colors</li> <li>20 Blog Pages</li> <li>Responsive Web</li> </ul> <a href="http://store.dnnsoftware.com/home/product-details/PackageID/36589/r/cd57d7207c9d4266bc34" class="btn ">Buy It Now</a> </div> </div> </div></div>

Advanced technology Nemo enim ipsam voluptatem qui (BottomOutPane)

Code:

html

<div class="home02-bg pt-60 pb-60"> <div class="container pt-40 pb-40 "> <div class="row animation"> <div class="col-sm-6"> <div class="home02-title03 animation_item fadeInLeft delay1">Advanced technology</div> <p class="pb-30 animation_item fadeInLeft delay2" style="font-size:14px;">Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat Nam aliquet rutrum eros eu mattis. Morbi tempus dapibus mattis. Aliquam arcu erat, pharetra vitae consectetur eu, pellentesque eget ipsum.</p> <a class="home02-btn02 animation_item fadeInLeft delay3" href="https://www.dnngo.net/DNNStore.aspx">Learn More</a></div> <div class="col-sm-6 animation_item fadeInRight delay4"><img alt="" class="img-responsive" src="http://demo8.dnngo.net/portals/13/Home02-Images/home02-img01.png" /></div> </div> </div> </div>

Get In Touch (Home02PaneA · 1)

Code:

html

<div class="pt-20"><div class="color_white pt-60 pb-20 animation scaleUp"> <h3 style="text-align: center;" class="home02-title04">Get In Touch</h3> <p class="big-size color-white" style="text-align: center;font-size:14px">Nunc at viverra nisl, eu blandit massa est augue cursus in vitae.</p> </div></div>

Form Section (Home02PaneA)

This section uses the DNNGo PowerForms module — see PowerForms.

Home02PaneA Section (Home02PaneA · 3)

Code:

html

<div class="pt-50 pb-60"></div>

Home02PaneB Section (Home02PaneB)

Code:

html

<div class="home02-gmap" id="gmap01"></div>

About DNNGo (FootPaneD)

Code:

html

<div class="animation scaleUp delay1"> <p>Interdum et malesuada fames ac ante ipsum primis in faucibus. Mauris quis vehicula diam. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas ut pellentesque massa, ut porttitor risus. </p> <p> </p> <p> Aliquam volutpat congue scelerisque. Nam eget fringilla risus, vitae posuere nisl Vivamu.</p> <a href="#">More Information &gt;</a> </div>

Categories (FootPaneE)

Code:

html

<ul class="home02-list02 animation scaleUp delay2">
    <li><span class="fa fa-th-large"></span><a href="#">Module Development</a></li>
    <li><span class="fa fa-th-large"></span><a href="#">Responsive Skin &amp; Design</a></li>
    <li><span class="fa fa-th-large"></span><a href="#">Amazing Portfolios</a></li>
    <li><span class="fa fa-th-large"></span><a href="#">CSS3 Animations</a></li>
</ul>

Recent News (FootPaneF)

Code:

html

<ul class="home02-ibox04 animation scaleUp delay3"> <li><img alt="" src="http://demo8.dnngo.net/portals/13/Home02-Images/home02-img09.jpg" /> <p>Ut wisi enim ad minim veniam, amcorper suscipit lobortis nislut liquip exea commodo.</p> <a href="https://www.dnngo.net/DNNStore.aspx">Read More</a></li> <li><img alt="" src="http://demo8.dnngo.net/portals/13/Home02-Images/home02-img10.jpg" /> <p>Ut wisi enim ad minim veniam, amcorper suscipit lobortis nislut liquip exea commodo.</p> <a href="https://www.dnngo.net/DNNStore.aspx">Read More</a></li> </ul>

Follow Us (FootPaneG)

Code:

html

<div class=" animation scaleUp delay4"> <p>Morbi tempus dapibus mattis. Aliquam arcu erat, pharetra vitae consectetur eu, pellentesque eget ipsum nibh auctor.</p> <div class="pt-10 pb-10"> <p style="margin-bottom:5px;">Email: [email protected]</p> <p>Skype: dnngo-linda</p> </div> <div class="home02-social"> <a href="#"><span class="fa fa-twitter"></span></a> <a href="#"><span class="fa fa-facebook"></span></a> <a href="#"><span class="fa fa-apple"></span></a> <a href="#"><span class="fa fa-android"></span></a> </div> </div>

Home Version 2 Page Code ​

BEST POWERFUL TEMPLATE We are a team comprised of (BannerPane) ​

Welcome To Our Website Nunc at viverra nisl, eu blandit massa est augue cursus in vitae. (TopPane) ​

Custom Styles (Full_Screen_PaneB · 1) ​

ARE YOU READY? (Full_Screen_PaneB · 2) ​

Amazing Portfolios Nunc at viverra nisl, eu blandit massa est augue cursus in vitae. (ContentPane) ​

Top Numbers Nunc at viverra nisl, eu blandit massa (Full_Screen_PaneE · 1) ​

Testimonials (Full_Screen_PaneE · 2) ​

Pricing Tables Nunc at viverra nisl, eu blandit massa est augue cursus in vitae. (BottomPane) ​

Advanced technology Nemo enim ipsam voluptatem qui (BottomOutPane) ​

Get In Touch (Home02PaneA · 1) ​

Form Section (Home02PaneA) ​

Home02PaneA Section (Home02PaneA · 3) ​

Home02PaneB Section (Home02PaneB) ​

About DNNGo (FootPaneD) ​

Categories (FootPaneE) ​

Recent News (FootPaneF) ​

Follow Us (FootPaneG) ​

Home Version 2 Page Code

BEST POWERFUL TEMPLATE We are a team comprised of (BannerPane)

Welcome To Our Website Nunc at viverra nisl, eu blandit massa est augue cursus in vitae. (TopPane)

Custom Styles (Full_Screen_PaneB · 1)

ARE YOU READY? (Full_Screen_PaneB · 2)

Amazing Portfolios Nunc at viverra nisl, eu blandit massa est augue cursus in vitae. (ContentPane)

Top Numbers Nunc at viverra nisl, eu blandit massa (Full_Screen_PaneE · 1)

Testimonials (Full_Screen_PaneE · 2)

Pricing Tables Nunc at viverra nisl, eu blandit massa est augue cursus in vitae. (BottomPane)

Advanced technology Nemo enim ipsam voluptatem qui (BottomOutPane)

Get In Touch (Home02PaneA · 1)

Form Section (Home02PaneA)

Home02PaneA Section (Home02PaneA · 3)

Home02PaneB Section (Home02PaneB)

About DNNGo (FootPaneD)

Categories (FootPaneE)

Recent News (FootPaneF)

Follow Us (FootPaneG)