Featured Items
Featured item full width banners that highlight specific content (dimensions are not applicable in this demo because this is normally full bleed content.)
Cras teleflora scelerisque elit accumsan, varius.
CTA Link
<!-- content container starts -->
<div class="m-homepage l-content-homepage centered clearfix">
<!-- section starts -->
<section class="m-homepage-middle-promo top-margin clearfix">
<!-- container starts -->
<div class="d-container_12 container_4">
<!-- wrapper starts -->
<div class="l-wrapper">
<!-- image starts -->
<div class="m-homepage-middle-promo-image d-grid_6 no-mobile">
<img src="http://placehold.it/450x265" class="fluid" alt="promo-product-image">
</div>
<!-- image ends -->
<!-- text starts -->
<div class="m-homepage-middle-promo-text d-grid_6">
<p class="m-homepage-middle-promo-text-p m-pattern-lib-downsize">Cras <span class="teleflora-logo">teleflora</span> scelerisque elit accumsan, varius.</p>
<a href="#" class="avenir-medium m-homepage-middle-promo-text-link">CTA Link</a>
</div>
<!-- text ends -->
</div>
<!-- wrapper ends -->
</div>
<!-- container ends -->
</section>
<!-- section ends -->
</div>
<!-- content container ends -->
|
Ad Modules
Displaying the two layouts for product promotional modules.
<!-- product container starts -->
<div class="m-product-mini col-1 top-margin">
<div data-id="11500">
<!-- main-image starts -->
<div id="productImage" class="m-product-mini-image">
<a href="/batch2/subcategory">
<style type="text/css" scoped="">
#promoBg-11500{background-image: url('http://placehold.it/160x200');}
@media screen and (min-width:961px){
#promoBg-11500{background-image: url('http://placehold.it/160x200');}
}
.oldie #promoBg-11500{background-image: url('http://placehold.it/160x200');}
</style>
<div id="promoBg-11500" class="promo-bg-image"></div>
</a>
</div>
<!-- main-image ends -->
<a href="#" class="m-category-flower-link centered text-large">Vestibulum ante ipsum primis in.</a>
<a href="#" class="m-product-mini-price">$00.00</a>
<a href="#" class="centered bembosize alt-pink"></a>
</div>
</div>
<!-- product container ends -->
|