[cs_content][cs_element_section _id=”1″ ][cs_element_row _id=”2″ ][cs_element_column _id=”3″ ][x_custom_headline level=”h1″ looks_like=”h3″ accent=”true” class=”cs-ta-center” style=”margin-bottom: 40px;”]Product Demos[/x_custom_headline][x_tab_nav type=”three-up” float=”top”][x_tab_nav_item title=”Print” active=”true”][x_tab_nav_item title=”Apparel” active=”false”][x_tab_nav_item title=”Miscellaneous” active=”false”][/x_tab_nav][x_tabs][x_tab active=”true”] [/x_tab][x_tab active=”false”]

[/x_tab][x_tab active=”false”][/x_tab][/x_tabs][/cs_element_column][/cs_element_row][/cs_element_section][/cs_content][cs_content_seo]Product DemosPrintApparelMiscellaneousa.eg-henryharrison-element-1,a.eg-henryharrison-element-2{-webkit-transition:all .4s linear; -moz-transition:all .4s linear; -o-transition:all .4s linear; -ms-transition:all .4s linear; transition:all .4s linear}.eg-jimmy-carter-element-11 i:before{margin-left:0px; margin-right:0px}.eg-harding-element-17{letter-spacing:1px}.eg-harding-wrapper .esg-entry-media{overflow:hidden; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; padding:30px 30px 0px 30px}.eg-harding-wrapper .esg-media-poster{overflow:hidden; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%}.eg-ulysses-s-grant-wrapper .esg-entry-media{overflow:hidden; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; padding:30px 30px 0px 30px}.eg-ulysses-s-grant-wrapper .esg-media-poster{overflow:hidden; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%}.eg-richard-nixon-wrapper .esg-entry-media{overflow:hidden; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; padding:30px 30px 0px 30px}.eg-richard-nixon-wrapper .esg-media-poster{overflow:hidden; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%}.eg-herbert-hoover-wrapper .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); filter:gray; -webkit-filter:grayscale(100%)}.eg-herbert-hoover-wrapper:hover .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); -webkit-filter:grayscale(0%)}.eg-lyndon-johnson-wrapper .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); filter:gray; -webkit-filter:grayscale(100%)}.eg-lyndon-johnson-wrapper:hover .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); -webkit-filter:grayscale(0%)}.esg-overlay.eg-ronald-reagan-container{background:-moz-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-webkit-gradient(linear,left top,left bottom,color-stop(50%,rgba(0,0,0,0)),color-stop(99%,rgba(0,0,0,0.83)),color-stop(100%,rgba(0,0,0,0.85))); background:-webkit-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-o-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-ms-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=’#00000000′,endColorstr=’#d9000000′,GradientType=0 )}.eg-georgebush-wrapper .esg-entry-cover{background:-moz-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-webkit-gradient(linear,left top,left bottom,color-stop(50%,rgba(0,0,0,0)),color-stop(99%,rgba(0,0,0,0.83)),color-stop(100%,rgba(0,0,0,0.85))); background:-webkit-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-o-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-ms-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=’#00000000′,endColorstr=’#d9000000′,GradientType=0 )}.eg-jefferson-wrapper{-webkit-border-radius:5px !important; -moz-border-radius:5px !important; border-radius:5px !important; -webkit-mask-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC) !important}.eg-monroe-element-1{text-shadow:0px 1px 3px rgba(0,0,0,0.1)}.eg-lyndon-johnson-wrapper .esg-entry-cover{background:-moz-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:-webkit-gradient(radial,center center,0px,center center,100%,color-stop(0%,rgba(0,0,0,0.35)),color-stop(96%,rgba(18,18,18,0)),color-stop(100%,rgba(19,19,19,0))); background:-webkit-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:-o-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:-ms-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:radial-gradient(ellipse at center,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=’#59000000′,endColorstr=’#00131313′,GradientType=1 )}.eg-wilbert-wrapper .esg-entry-cover{background:-moz-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:-webkit-gradient(radial,center center,0px,center center,100%,color-stop(0%,rgba(0,0,0,0.35)),color-stop(96%,rgba(18,18,18,0)),color-stop(100%,rgba(19,19,19,0))); background:-webkit-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:-o-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:-ms-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:radial-gradient(ellipse at center,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=’#59000000′,endColorstr=’#00131313′,GradientType=1 )}.eg-wilbert-wrapper .esg-media-poster{-webkit-transition:0.4s ease-in-out; -moz-transition:0.4s ease-in-out; -o-transition:0.4s ease-in-out; transition:0.4s ease-in-out; filter:url(“data:image/svg+xml;utf8,#grayscale”); filter:gray; -webkit-filter:grayscale(100%)}.eg-wilbert-wrapper:hover .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); -webkit-filter:grayscale(0%)}.eg-phillie-element-3:after{content:” “;width:0px;height:0px;border-style:solid;border-width:5px 5px 0 5px;border-color:#000 transparent transparent transparent;left:50%;margin-left:-5px; bottom:-5px; position:absolute}.eg-howardtaft-wrapper .esg-media-poster,.eg-howardtaft-wrapper .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); -webkit-filter:grayscale(0%)}.eg-howardtaft-wrapper:hover .esg-media-poster,.eg-howardtaft-wrapper:hover .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); filter:gray; -webkit-filter:grayscale(100%)}.myportfolio-container .added_to_cart.wc-forward{font-family:”Open Sans”; font-size:13px; color:#fff; margin-top:10px}.esgbox-title.esgbox-title-outside-wrap{font-size:15px; font-weight:700; text-align:center}.esgbox-title.esgbox-title-inside-wrap{padding-bottom:10px; font-size:15px; font-weight:700; text-align:center}.esg-content.eg-twitterstream-element-33-a{display:inline-block}.eg-twitterstream-element-35{word-break:break-all}.esg-overlay.eg-twitterstream-container{background:-moz-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-webkit-gradient(linear,left top,left bottom,color-stop(50%,rgba(0,0,0,0)),color-stop(99%,rgba(0,0,0,0.83)),color-stop(100%,rgba(0,0,0,0.85))); background:-webkit-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-o-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-ms-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=’#00000000′,endColorstr=’#d9000000′,GradientType=0 )}.esg-content.eg-facebookstream-element-33-a{display:inline-block}.eg-facebookstream-element-0{word-break:break-all}.esg-overlay.eg-flickrstream-container{background:-moz-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-webkit-gradient(linear,left top,left bottom,color-stop(50%,rgba(0,0,0,0)),color-stop(99%,rgba(0,0,0,0.83)),color-stop(100%,rgba(0,0,0,0.85))); background:-webkit-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-o-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-ms-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=’#00000000′,endColorstr=’#d9000000′,GradientType=0 )}
.minimal-light .navigationbuttons,.minimal-light .esg-pagination,.minimal-light .esg-filters{text-align:center}.minimal-light .esg-filterbutton,.minimal-light .esg-navigationbutton,.minimal-light .esg-sortbutton,.minimal-light .esg-cartbutton a{color:#999; margin-right:5px; cursor:pointer; padding:0px 16px; border:1px solid #e5e5e5; line-height:38px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; font-size:12px; font-weight:700; font-family:”Open Sans”,sans-serif; display:inline-block; background:#fff; margin-bottom:5px}.minimal-light .esg-navigationbutton *{color:#999}.minimal-light .esg-navigationbutton{padding:0px 16px}.minimal-light .esg-pagination-button:last-child{margin-right:0}.minimal-light .esg-left,.minimal-light .esg-right{padding:0px 11px}.minimal-light .esg-sortbutton-wrapper,.minimal-light .esg-cartbutton-wrapper{display:inline-block}.minimal-light .esg-sortbutton-order,.minimal-light .esg-cartbutton-order{display:inline-block; vertical-align:top; border:1px solid #e5e5e5; width:40px; line-height:38px; border-radius:0px 5px 5px 0px; -moz-border-radius:0px 5px 5px 0px; -webkit-border-radius:0px 5px 5px 0px; font-size:12px; font-weight:700; color:#999; cursor:pointer; background:#fff}.minimal-light .esg-cartbutton{color:#333; cursor:default !important}.minimal-light .esg-cartbutton .esgicon-basket{color:#333; font-size:15px; line-height:15px; margin-right:10px}.minimal-light .esg-cartbutton-wrapper{cursor:default !important}.minimal-light .esg-sortbutton,.minimal-light .esg-cartbutton{display:inline-block; position:relative; cursor:pointer; margin-right:0px; border-right:none; border-radius:5px 0px 0px 5px; -moz-border-radius:5px 0px 0px 5px; -webkit-border-radius:5px 0px 0px 5px}.minimal-light .esg-navigationbutton:hover,.minimal-light .esg-filterbutton:hover,.minimal-light .esg-sortbutton:hover,.minimal-light .esg-sortbutton-order:hover,.minimal-light .esg-cartbutton a:hover,.minimal-light .esg-filterbutton.selected{background-color:#fff; border-color:#bbb; color:#333; box-shadow:0px 3px 5px 0px rgba(0,0,0,0.13)}.minimal-light .esg-navigationbutton:hover *{color:#333}.minimal-light .esg-sortbutton-order.tp-desc:hover{border-color:#bbb; color:#333; box-shadow:0px -3px 5px 0px rgba(0,0,0,0.13) !important}.minimal-light .esg-filter-checked{padding:1px 3px; color:#cbcbcb; background:#cbcbcb; margin-left:7px; font-size:9px; font-weight:300; line-height:9px; vertical-align:middle}.minimal-light .esg-filterbutton.selected .esg-filter-checked,.minimal-light .esg-filterbutton:hover .esg-filter-checked{padding:1px 3px 1px 3px; color:#fff; background:#000; margin-left:7px; font-size:9px; font-weight:300; line-height:9px; vertical-align:middle}
.eg-wc-demos-element-24{font-size:25px; line-height:40px; color:#ffffff; font-weight:200; padding:5px 10px 5px 10px ; border-radius:0px 0px 0px 0px ; background:rgba(0,0,0,0.5); z-index:2 !important; display:block; font-family:”Lato”; text-transform:uppercase}.eg-wc-demos-element-28{font-size:15px !important; line-height:25px !important; color:#ffffff !important; font-weight:800 !important; display:inline-block !important; float:right !important; clear:both !important; margin:0px 0px 0px 0px !important; padding:3px 10px 2px 10px !important; border-radius:0px 0px 0px 5px !important; background:rgba(38,38,38,0.70) !important; position:relative !important; z-index:2 !important; font-family:”Lato” !important; text-transform:uppercase !important}.eg-wc-demos-element-0{font-size:20px !important; line-height:25px !important; color:#363839 !important; font-weight:600 !important; display:block !important; text-align:left !important; clear:both !important; margin:0px 0px 20px 0px !important; padding:0px 0px 0px 0px !important; border-radius:0px 0px 0px 0px !important; position:relative !important; z-index:2 !important; text-transform:capitalize !important}.eg-wc-demos-element-27{font-size:12px; line-height:20px; color:#888888; font-weight:400; display:inline-block; float:none; clear:both; margin:0px 0px 0px 0px ; padding:0px 0px 0px 0px ; border-radius:0px 0px 0px 0px ; background:transparent; position:relative; z-index:2 !important; font-family:”Raleway”; text-transform:uppercase}
.eg-wc-demos-element-24:hover{font-size:25px; line-height:40px; color:#ffffff; font-weight:200; border-radius:0px 0px 0px 0px ; background:rgba(0,0,0,0.71); font-family:”Lato”; text-transform:uppercase}
.eg-wc-demos-element-24-a{display:inline-block; float:none; clear:both; margin:0px 0px 0px 0px ; position:relative}
.eg-wc-demos-container{background:transparent}
.eg-wc-demos-content{background:#fcfcfc; padding:30px 30px 30px 30px; border-width:0px 0px 0px 0px; border-radius:0px 0px 0px 0px; border-color:transparent; border-style:double; text-align:left}
.esg-grid .mainul li.eg-wc-demos-wrapper{background:#ffffff; padding:0px 0px 0px 0px; border-width:0px 0px 0px 0px; border-radius:0px 0px 0px 0px; border-color:transparent; border-style:none; box-shadow:0px 1px 6px 0px rgba(0,0,0,0.20)}
.esg-grid .mainul li.eg-wc-demos-wrapper .esg-media-poster{background-size:cover; background-position:center center; background-repeat:no-repeat}

VIEW DEMO

Photo Frame
This demo shows the usage of upload zone, which is a placeholder for adding media types like images or texts.

VIEW DEMO

Poster
Display the product designer in the next page after a button to start the customization is clicked.

VIEW DEMO

Calendar
You can even use the product designer for calendars and create a view for every month.

VIEW DEMO

Business Card
You can even use the product designer with WooCommerce variations.

VIEW DEMO

Greeting Card
Use the product designer for any type of print products like Greeting Cards etc..

VIEW DEMO
PLUS ADD-ON

Canvas
With the PLUS add-on you can show a module for free drawings.

VIEW DEMO

Collage
Create collages with the help of Upload Zones.

VIEW DEMO

Business Cards
Several Business Cards demos with different amount of views.

VIEW DEMO
MSPC

Birthday Card (MSPC)
Combine Multistep Product Configurator with the Designer.

var essapi_5;
jQuery(document).ready(function() {
essapi_5 = jQuery(“#esg-grid-5-7″).tpessential({
gridID:5,
layout:”masonry”,
forceFullWidth:”off”,
lazyLoad:”off”,
row:9999,
apiName: “essapi_5″,
loadMoreAjaxToken:”5e06225cab”,
loadMoreAjaxUrl:”https://fancyproductdesigner.com//wp-admin/admin-ajax.php”,
loadMoreAjaxAction:”Essential_Grid_Front_request_ajax”,
ajaxContentTarget:”ess-grid-ajax-container-“,
ajaxScrollToOffset:”0″,
ajaxCloseButton:”off”,
ajaxContentSliding:”on”,
ajaxScrollToOnLoad:”on”,
ajaxCallbackArgument:”off”,
ajaxNavButton:”off”,
ajaxCloseType:”type1″,
ajaxCloseInner:”false”,
ajaxCloseStyle:”light”,
ajaxClosePosition:”tr”,
space:20,
pageAnimation:”fade”,
startAnimation: “none”,
startAnimationSpeed: 1000,
startAnimationDelay: 100,
startAnimationType: “item”,
animationType: “item”,
paginationScrollToTop:”off”,
paginationAutoplay:”off”,
spinner:”spinner0″,
lightBoxMode:”single”,
lightboxHash:”group”,
lightboxPostMinWid:”75%”,
lightboxPostMaxWid:”75%”,
lightboxSpinner:”off”,
lightBoxFeaturedImg:”off”,
lightBoxPostTitle:”off”,
lightBoxPostTitleTag:”h2″,
lightboxMargin : “0|0|0|0”,
lbContentPadding : “0|0|0|0”,
lbContentOverflow : “auto”,
animSpeed:1000,
delayBasic:1,
mainhoverdelay:1,
filterType:”multi”,
filterLogic:”or”,
showDropFilter:”hover”,
filterGroupClass:”esg-fgc-5″,
filterNoMatch:”No Items for the Selected Filter”,
filterDeepLink:”off”,
hideMarkups: “on”,
inViewport: true,
viewportBuffer: 20,
youtubeNoCookie:”false”,
convertFilterMobile:false,
paginationSwipe: “off”,
paginationDragVer: “off”,
pageSwipeThrottle: 30,
googleFonts:[‘Open+Sans:300,400,600,700,800′,’Raleway:100,200,300,400,500,600,700,800,900′,’Droid+Serif:400,700′],
hideBlankItemsAt: “1”,
responsiveEntries: [
{ width:1400,amount:3,mmheight:0},
{ width:1170,amount:3,mmheight:0},
{ width:1024,amount:3,mmheight:0},
{ width:960,amount:3,mmheight:0},
{ width:778,amount:3,mmheight:0},
{ width:640,amount:3,mmheight:0},
{ width:480,amount:1,mmheight:0}
]
});

var arrows = true,
lightboxOptions = {
margin : [0,0,0,0],
buttons : [“share”,”thumbs”,”close”],
infobar : true,
loop : true,
slideShow : {“autoStart”: false, “speed”: 3000},
animationEffect : “fade”,
animationDuration : 500,
beforeShow: function(a, c) {
if(!arrows) {
jQuery(“body”).addClass(“esgbox-hidearrows”);
}
var i = 0,
multiple = false;
a = a.slides;
for(var b in a) {
i++;
if(i > 1) {
multiple = true;
break;
}
}
if(!multiple) jQuery(“body”).addClass(“esgbox-single”);
if(c.type === “image”) jQuery(“.esgbox-button–zoom”).show();
},
beforeLoad: function(a, b) {
jQuery(“body”).removeClass(“esg-four-by-three”);
if(b.opts.$orig.data(“ratio”) === “4:3”) jQuery(“body”).addClass(“esg-four-by-three”);
},
afterLoad: function() {jQuery(window).trigger(“resize.esglb”);},
afterClose : function() {jQuery(“body”).removeClass(“esgbox-hidearrows esgbox-single”);},
transitionEffect : “fade”,
transitionDuration : 500,
hash : “group”,
arrows : true,
wheel : false,
};

jQuery(“#esg-grid-5-7”).data(“lightboxsettings”, lightboxOptions);

});

a.eg-henryharrison-element-1,a.eg-henryharrison-element-2{-webkit-transition:all .4s linear; -moz-transition:all .4s linear; -o-transition:all .4s linear; -ms-transition:all .4s linear; transition:all .4s linear}.eg-jimmy-carter-element-11 i:before{margin-left:0px; margin-right:0px}.eg-harding-element-17{letter-spacing:1px}.eg-harding-wrapper .esg-entry-media{overflow:hidden; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; padding:30px 30px 0px 30px}.eg-harding-wrapper .esg-media-poster{overflow:hidden; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%}.eg-ulysses-s-grant-wrapper .esg-entry-media{overflow:hidden; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; padding:30px 30px 0px 30px}.eg-ulysses-s-grant-wrapper .esg-media-poster{overflow:hidden; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%}.eg-richard-nixon-wrapper .esg-entry-media{overflow:hidden; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; padding:30px 30px 0px 30px}.eg-richard-nixon-wrapper .esg-media-poster{overflow:hidden; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%}.eg-herbert-hoover-wrapper .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); filter:gray; -webkit-filter:grayscale(100%)}.eg-herbert-hoover-wrapper:hover .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); -webkit-filter:grayscale(0%)}.eg-lyndon-johnson-wrapper .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); filter:gray; -webkit-filter:grayscale(100%)}.eg-lyndon-johnson-wrapper:hover .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); -webkit-filter:grayscale(0%)}.esg-overlay.eg-ronald-reagan-container{background:-moz-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-webkit-gradient(linear,left top,left bottom,color-stop(50%,rgba(0,0,0,0)),color-stop(99%,rgba(0,0,0,0.83)),color-stop(100%,rgba(0,0,0,0.85))); background:-webkit-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-o-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-ms-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=’#00000000′,endColorstr=’#d9000000′,GradientType=0 )}.eg-georgebush-wrapper .esg-entry-cover{background:-moz-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-webkit-gradient(linear,left top,left bottom,color-stop(50%,rgba(0,0,0,0)),color-stop(99%,rgba(0,0,0,0.83)),color-stop(100%,rgba(0,0,0,0.85))); background:-webkit-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-o-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-ms-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=’#00000000′,endColorstr=’#d9000000′,GradientType=0 )}.eg-jefferson-wrapper{-webkit-border-radius:5px !important; -moz-border-radius:5px !important; border-radius:5px !important; -webkit-mask-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC) !important}.eg-monroe-element-1{text-shadow:0px 1px 3px rgba(0,0,0,0.1)}.eg-lyndon-johnson-wrapper .esg-entry-cover{background:-moz-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:-webkit-gradient(radial,center center,0px,center center,100%,color-stop(0%,rgba(0,0,0,0.35)),color-stop(96%,rgba(18,18,18,0)),color-stop(100%,rgba(19,19,19,0))); background:-webkit-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:-o-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:-ms-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:radial-gradient(ellipse at center,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=’#59000000′,endColorstr=’#00131313′,GradientType=1 )}.eg-wilbert-wrapper .esg-entry-cover{background:-moz-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:-webkit-gradient(radial,center center,0px,center center,100%,color-stop(0%,rgba(0,0,0,0.35)),color-stop(96%,rgba(18,18,18,0)),color-stop(100%,rgba(19,19,19,0))); background:-webkit-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:-o-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:-ms-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:radial-gradient(ellipse at center,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=’#59000000′,endColorstr=’#00131313′,GradientType=1 )}.eg-wilbert-wrapper .esg-media-poster{-webkit-transition:0.4s ease-in-out; -moz-transition:0.4s ease-in-out; -o-transition:0.4s ease-in-out; transition:0.4s ease-in-out; filter:url(“data:image/svg+xml;utf8,#grayscale”); filter:gray; -webkit-filter:grayscale(100%)}.eg-wilbert-wrapper:hover .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); -webkit-filter:grayscale(0%)}.eg-phillie-element-3:after{content:” “;width:0px;height:0px;border-style:solid;border-width:5px 5px 0 5px;border-color:#000 transparent transparent transparent;left:50%;margin-left:-5px; bottom:-5px; position:absolute}.eg-howardtaft-wrapper .esg-media-poster,.eg-howardtaft-wrapper .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); -webkit-filter:grayscale(0%)}.eg-howardtaft-wrapper:hover .esg-media-poster,.eg-howardtaft-wrapper:hover .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); filter:gray; -webkit-filter:grayscale(100%)}.myportfolio-container .added_to_cart.wc-forward{font-family:”Open Sans”; font-size:13px; color:#fff; margin-top:10px}.esgbox-title.esgbox-title-outside-wrap{font-size:15px; font-weight:700; text-align:center}.esgbox-title.esgbox-title-inside-wrap{padding-bottom:10px; font-size:15px; font-weight:700; text-align:center}.esg-content.eg-twitterstream-element-33-a{display:inline-block}.eg-twitterstream-element-35{word-break:break-all}.esg-overlay.eg-twitterstream-container{background:-moz-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-webkit-gradient(linear,left top,left bottom,color-stop(50%,rgba(0,0,0,0)),color-stop(99%,rgba(0,0,0,0.83)),color-stop(100%,rgba(0,0,0,0.85))); background:-webkit-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-o-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-ms-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=’#00000000′,endColorstr=’#d9000000′,GradientType=0 )}.esg-content.eg-facebookstream-element-33-a{display:inline-block}.eg-facebookstream-element-0{word-break:break-all}.esg-overlay.eg-flickrstream-container{background:-moz-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-webkit-gradient(linear,left top,left bottom,color-stop(50%,rgba(0,0,0,0)),color-stop(99%,rgba(0,0,0,0.83)),color-stop(100%,rgba(0,0,0,0.85))); background:-webkit-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-o-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-ms-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=’#00000000′,endColorstr=’#d9000000’,GradientType=0 )}
.minimal-light .navigationbuttons,.minimal-light .esg-pagination,.minimal-light .esg-filters{text-align:center}.minimal-light .esg-filterbutton,.minimal-light .esg-navigationbutton,.minimal-light .esg-sortbutton,.minimal-light .esg-cartbutton a{color:#999; margin-right:5px; cursor:pointer; padding:0px 16px; border:1px solid #e5e5e5; line-height:38px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; font-size:12px; font-weight:700; font-family:”Open Sans”,sans-serif; display:inline-block; background:#fff; margin-bottom:5px}.minimal-light .esg-navigationbutton *{color:#999}.minimal-light .esg-navigationbutton{padding:0px 16px}.minimal-light .esg-pagination-button:last-child{margin-right:0}.minimal-light .esg-left,.minimal-light .esg-right{padding:0px 11px}.minimal-light .esg-sortbutton-wrapper,.minimal-light .esg-cartbutton-wrapper{display:inline-block}.minimal-light .esg-sortbutton-order,.minimal-light .esg-cartbutton-order{display:inline-block; vertical-align:top; border:1px solid #e5e5e5; width:40px; line-height:38px; border-radius:0px 5px 5px 0px; -moz-border-radius:0px 5px 5px 0px; -webkit-border-radius:0px 5px 5px 0px; font-size:12px; font-weight:700; color:#999; cursor:pointer; background:#fff}.minimal-light .esg-cartbutton{color:#333; cursor:default !important}.minimal-light .esg-cartbutton .esgicon-basket{color:#333; font-size:15px; line-height:15px; margin-right:10px}.minimal-light .esg-cartbutton-wrapper{cursor:default !important}.minimal-light .esg-sortbutton,.minimal-light .esg-cartbutton{display:inline-block; position:relative; cursor:pointer; margin-right:0px; border-right:none; border-radius:5px 0px 0px 5px; -moz-border-radius:5px 0px 0px 5px; -webkit-border-radius:5px 0px 0px 5px}.minimal-light .esg-navigationbutton:hover,.minimal-light .esg-filterbutton:hover,.minimal-light .esg-sortbutton:hover,.minimal-light .esg-sortbutton-order:hover,.minimal-light .esg-cartbutton a:hover,.minimal-light .esg-filterbutton.selected{background-color:#fff; border-color:#bbb; color:#333; box-shadow:0px 3px 5px 0px rgba(0,0,0,0.13)}.minimal-light .esg-navigationbutton:hover *{color:#333}.minimal-light .esg-sortbutton-order.tp-desc:hover{border-color:#bbb; color:#333; box-shadow:0px -3px 5px 0px rgba(0,0,0,0.13) !important}.minimal-light .esg-filter-checked{padding:1px 3px; color:#cbcbcb; background:#cbcbcb; margin-left:7px; font-size:9px; font-weight:300; line-height:9px; vertical-align:middle}.minimal-light .esg-filterbutton.selected .esg-filter-checked,.minimal-light .esg-filterbutton:hover .esg-filter-checked{padding:1px 3px 1px 3px; color:#fff; background:#000; margin-left:7px; font-size:9px; font-weight:300; line-height:9px; vertical-align:middle}
.eg-wc-demos-element-24{font-size:25px; line-height:40px; color:#ffffff; font-weight:200; padding:5px 10px 5px 10px ; border-radius:0px 0px 0px 0px ; background:rgba(0,0,0,0.5); z-index:2 !important; display:block; font-family:”Lato”; text-transform:uppercase}.eg-wc-demos-element-28{font-size:15px !important; line-height:25px !important; color:#ffffff !important; font-weight:800 !important; display:inline-block !important; float:right !important; clear:both !important; margin:0px 0px 0px 0px !important; padding:3px 10px 2px 10px !important; border-radius:0px 0px 0px 5px !important; background:rgba(38,38,38,0.70) !important; position:relative !important; z-index:2 !important; font-family:”Lato” !important; text-transform:uppercase !important}.eg-wc-demos-element-0{font-size:20px !important; line-height:25px !important; color:#363839 !important; font-weight:600 !important; display:block !important; text-align:left !important; clear:both !important; margin:0px 0px 20px 0px !important; padding:0px 0px 0px 0px !important; border-radius:0px 0px 0px 0px !important; position:relative !important; z-index:2 !important; text-transform:capitalize !important}.eg-wc-demos-element-27{font-size:12px; line-height:20px; color:#888888; font-weight:400; display:inline-block; float:none; clear:both; margin:0px 0px 0px 0px ; padding:0px 0px 0px 0px ; border-radius:0px 0px 0px 0px ; background:transparent; position:relative; z-index:2 !important; font-family:”Raleway”; text-transform:uppercase}
.eg-wc-demos-element-24:hover{font-size:25px; line-height:40px; color:#ffffff; font-weight:200; border-radius:0px 0px 0px 0px ; background:rgba(0,0,0,0.71); font-family:”Lato”; text-transform:uppercase}
.eg-wc-demos-element-24-a{display:inline-block; float:none; clear:both; margin:0px 0px 0px 0px ; position:relative}
.eg-wc-demos-container{background:transparent}
.eg-wc-demos-content{background:#fcfcfc; padding:30px 30px 30px 30px; border-width:0px 0px 0px 0px; border-radius:0px 0px 0px 0px; border-color:transparent; border-style:double; text-align:left}
.esg-grid .mainul li.eg-wc-demos-wrapper{background:#ffffff; padding:0px 0px 0px 0px; border-width:0px 0px 0px 0px; border-radius:0px 0px 0px 0px; border-color:transparent; border-style:none; box-shadow:0px 1px 6px 0px rgba(0,0,0,0.20)}
.esg-grid .mainul li.eg-wc-demos-wrapper .esg-media-poster{background-size:cover; background-position:center center; background-repeat:no-repeat}

VIEW DEMO

T-Shirt
Design a custom shirt with the Sidebar layout.

VIEW DEMO

Sneaker (MSPC)
The Multistep Product Configurator plugin can be used with Fancy Product Designer.

VIEW DEMO
PLUS ADD-ON

Shirt
This demo shows the Bulk-Add Variations Form and Color Selection Panel.

VIEW DEMO
PLUS ADD-ON

Football Jersey
PLUS: Add a form to enter a bulk of names and numbers.

VIEW DEMO
Bulk Variations

Sweater
Enable bulk variations for straightforward products with multiple customization options.

VIEW DEMO

Hoodies
Display the product designer in a modal window (lightbox) by clicking a button to start customization.

VIEW DEMO

Shirts
Display the product designer in a modal window (lightbox) by clicking a button to start customization.

var essapi_6;
jQuery(document).ready(function() {
essapi_6 = jQuery(“#esg-grid-6-8″).tpessential({
gridID:6,
layout:”masonry”,
forceFullWidth:”off”,
lazyLoad:”off”,
row:9999,
apiName: “essapi_6″,
loadMoreAjaxToken:”5e06225cab”,
loadMoreAjaxUrl:”https://fancyproductdesigner.com//wp-admin/admin-ajax.php”,
loadMoreAjaxAction:”Essential_Grid_Front_request_ajax”,
ajaxContentTarget:”ess-grid-ajax-container-“,
ajaxScrollToOffset:”0″,
ajaxCloseButton:”off”,
ajaxContentSliding:”on”,
ajaxScrollToOnLoad:”on”,
ajaxCallbackArgument:”off”,
ajaxNavButton:”off”,
ajaxCloseType:”type1″,
ajaxCloseInner:”false”,
ajaxCloseStyle:”light”,
ajaxClosePosition:”tr”,
space:20,
pageAnimation:”fade”,
startAnimation: “none”,
startAnimationSpeed: 1000,
startAnimationDelay: 100,
startAnimationType: “item”,
animationType: “item”,
paginationScrollToTop:”off”,
paginationAutoplay:”off”,
spinner:”spinner0″,
lightBoxMode:”single”,
lightboxHash:”group”,
lightboxPostMinWid:”75%”,
lightboxPostMaxWid:”75%”,
lightboxSpinner:”off”,
lightBoxFeaturedImg:”off”,
lightBoxPostTitle:”off”,
lightBoxPostTitleTag:”h2″,
lightboxMargin : “0|0|0|0”,
lbContentPadding : “0|0|0|0”,
lbContentOverflow : “auto”,
animSpeed:1000,
delayBasic:1,
mainhoverdelay:1,
filterType:”multi”,
filterLogic:”or”,
showDropFilter:”hover”,
filterGroupClass:”esg-fgc-6″,
filterNoMatch:”No Items for the Selected Filter”,
filterDeepLink:”off”,
hideMarkups: “on”,
inViewport: true,
viewportBuffer: 20,
youtubeNoCookie:”false”,
convertFilterMobile:false,
paginationSwipe: “off”,
paginationDragVer: “off”,
pageSwipeThrottle: 30,
googleFonts:[‘Open+Sans:300,400,600,700,800′,’Raleway:100,200,300,400,500,600,700,800,900′,’Droid+Serif:400,700′],
hideBlankItemsAt: “1”,
responsiveEntries: [
{ width:1400,amount:3,mmheight:0},
{ width:1170,amount:3,mmheight:0},
{ width:1024,amount:3,mmheight:0},
{ width:960,amount:3,mmheight:0},
{ width:778,amount:3,mmheight:0},
{ width:640,amount:3,mmheight:0},
{ width:480,amount:1,mmheight:0}
]
});

var arrows = true,
lightboxOptions = {
margin : [0,0,0,0],
buttons : [“share”,”thumbs”,”close”],
infobar : true,
loop : true,
slideShow : {“autoStart”: false, “speed”: 3000},
animationEffect : “fade”,
animationDuration : 500,
beforeShow: function(a, c) {
if(!arrows) {
jQuery(“body”).addClass(“esgbox-hidearrows”);
}
var i = 0,
multiple = false;
a = a.slides;
for(var b in a) {
i++;
if(i > 1) {
multiple = true;
break;
}
}
if(!multiple) jQuery(“body”).addClass(“esgbox-single”);
if(c.type === “image”) jQuery(“.esgbox-button–zoom”).show();
},
beforeLoad: function(a, b) {
jQuery(“body”).removeClass(“esg-four-by-three”);
if(b.opts.$orig.data(“ratio”) === “4:3”) jQuery(“body”).addClass(“esg-four-by-three”);
},
afterLoad: function() {jQuery(window).trigger(“resize.esglb”);},
afterClose : function() {jQuery(“body”).removeClass(“esgbox-hidearrows esgbox-single”);},
transitionEffect : “fade”,
transitionDuration : 500,
hash : “group”,
arrows : true,
wheel : false,
};

jQuery(“#esg-grid-6-8”).data(“lightboxsettings”, lightboxOptions);

});

a.eg-henryharrison-element-1,a.eg-henryharrison-element-2{-webkit-transition:all .4s linear; -moz-transition:all .4s linear; -o-transition:all .4s linear; -ms-transition:all .4s linear; transition:all .4s linear}.eg-jimmy-carter-element-11 i:before{margin-left:0px; margin-right:0px}.eg-harding-element-17{letter-spacing:1px}.eg-harding-wrapper .esg-entry-media{overflow:hidden; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; padding:30px 30px 0px 30px}.eg-harding-wrapper .esg-media-poster{overflow:hidden; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%}.eg-ulysses-s-grant-wrapper .esg-entry-media{overflow:hidden; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; padding:30px 30px 0px 30px}.eg-ulysses-s-grant-wrapper .esg-media-poster{overflow:hidden; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%}.eg-richard-nixon-wrapper .esg-entry-media{overflow:hidden; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; padding:30px 30px 0px 30px}.eg-richard-nixon-wrapper .esg-media-poster{overflow:hidden; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%}.eg-herbert-hoover-wrapper .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); filter:gray; -webkit-filter:grayscale(100%)}.eg-herbert-hoover-wrapper:hover .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); -webkit-filter:grayscale(0%)}.eg-lyndon-johnson-wrapper .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); filter:gray; -webkit-filter:grayscale(100%)}.eg-lyndon-johnson-wrapper:hover .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); -webkit-filter:grayscale(0%)}.esg-overlay.eg-ronald-reagan-container{background:-moz-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-webkit-gradient(linear,left top,left bottom,color-stop(50%,rgba(0,0,0,0)),color-stop(99%,rgba(0,0,0,0.83)),color-stop(100%,rgba(0,0,0,0.85))); background:-webkit-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-o-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-ms-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=’#00000000′,endColorstr=’#d9000000′,GradientType=0 )}.eg-georgebush-wrapper .esg-entry-cover{background:-moz-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-webkit-gradient(linear,left top,left bottom,color-stop(50%,rgba(0,0,0,0)),color-stop(99%,rgba(0,0,0,0.83)),color-stop(100%,rgba(0,0,0,0.85))); background:-webkit-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-o-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-ms-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=’#00000000′,endColorstr=’#d9000000′,GradientType=0 )}.eg-jefferson-wrapper{-webkit-border-radius:5px !important; -moz-border-radius:5px !important; border-radius:5px !important; -webkit-mask-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC) !important}.eg-monroe-element-1{text-shadow:0px 1px 3px rgba(0,0,0,0.1)}.eg-lyndon-johnson-wrapper .esg-entry-cover{background:-moz-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:-webkit-gradient(radial,center center,0px,center center,100%,color-stop(0%,rgba(0,0,0,0.35)),color-stop(96%,rgba(18,18,18,0)),color-stop(100%,rgba(19,19,19,0))); background:-webkit-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:-o-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:-ms-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:radial-gradient(ellipse at center,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=’#59000000′,endColorstr=’#00131313′,GradientType=1 )}.eg-wilbert-wrapper .esg-entry-cover{background:-moz-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:-webkit-gradient(radial,center center,0px,center center,100%,color-stop(0%,rgba(0,0,0,0.35)),color-stop(96%,rgba(18,18,18,0)),color-stop(100%,rgba(19,19,19,0))); background:-webkit-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:-o-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:-ms-radial-gradient(center,ellipse cover,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); background:radial-gradient(ellipse at center,rgba(0,0,0,0.35) 0%,rgba(18,18,18,0) 96%,rgba(19,19,19,0) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=’#59000000′,endColorstr=’#00131313′,GradientType=1 )}.eg-wilbert-wrapper .esg-media-poster{-webkit-transition:0.4s ease-in-out; -moz-transition:0.4s ease-in-out; -o-transition:0.4s ease-in-out; transition:0.4s ease-in-out; filter:url(“data:image/svg+xml;utf8,#grayscale”); filter:gray; -webkit-filter:grayscale(100%)}.eg-wilbert-wrapper:hover .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); -webkit-filter:grayscale(0%)}.eg-phillie-element-3:after{content:” “;width:0px;height:0px;border-style:solid;border-width:5px 5px 0 5px;border-color:#000 transparent transparent transparent;left:50%;margin-left:-5px; bottom:-5px; position:absolute}.eg-howardtaft-wrapper .esg-media-poster,.eg-howardtaft-wrapper .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); -webkit-filter:grayscale(0%)}.eg-howardtaft-wrapper:hover .esg-media-poster,.eg-howardtaft-wrapper:hover .esg-media-poster{filter:url(“data:image/svg+xml;utf8,#grayscale”); filter:gray; -webkit-filter:grayscale(100%)}.myportfolio-container .added_to_cart.wc-forward{font-family:”Open Sans”; font-size:13px; color:#fff; margin-top:10px}.esgbox-title.esgbox-title-outside-wrap{font-size:15px; font-weight:700; text-align:center}.esgbox-title.esgbox-title-inside-wrap{padding-bottom:10px; font-size:15px; font-weight:700; text-align:center}.esg-content.eg-twitterstream-element-33-a{display:inline-block}.eg-twitterstream-element-35{word-break:break-all}.esg-overlay.eg-twitterstream-container{background:-moz-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-webkit-gradient(linear,left top,left bottom,color-stop(50%,rgba(0,0,0,0)),color-stop(99%,rgba(0,0,0,0.83)),color-stop(100%,rgba(0,0,0,0.85))); background:-webkit-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-o-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-ms-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=’#00000000′,endColorstr=’#d9000000′,GradientType=0 )}.esg-content.eg-facebookstream-element-33-a{display:inline-block}.eg-facebookstream-element-0{word-break:break-all}.esg-overlay.eg-flickrstream-container{background:-moz-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-webkit-gradient(linear,left top,left bottom,color-stop(50%,rgba(0,0,0,0)),color-stop(99%,rgba(0,0,0,0.83)),color-stop(100%,rgba(0,0,0,0.85))); background:-webkit-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-o-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:-ms-linear-gradient(top,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); background:linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgba(0,0,0,0.83) 99%,rgba(0,0,0,0.85) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=’#00000000′,endColorstr=’#d9000000’,GradientType=0 )}
.minimal-light .navigationbuttons,.minimal-light .esg-pagination,.minimal-light .esg-filters{text-align:center}.minimal-light .esg-filterbutton,.minimal-light .esg-navigationbutton,.minimal-light .esg-sortbutton,.minimal-light .esg-cartbutton a{color:#999; margin-right:5px; cursor:pointer; padding:0px 16px; border:1px solid #e5e5e5; line-height:38px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; font-size:12px; font-weight:700; font-family:”Open Sans”,sans-serif; display:inline-block; background:#fff; margin-bottom:5px}.minimal-light .esg-navigationbutton *{color:#999}.minimal-light .esg-navigationbutton{padding:0px 16px}.minimal-light .esg-pagination-button:last-child{margin-right:0}.minimal-light .esg-left,.minimal-light .esg-right{padding:0px 11px}.minimal-light .esg-sortbutton-wrapper,.minimal-light .esg-cartbutton-wrapper{display:inline-block}.minimal-light .esg-sortbutton-order,.minimal-light .esg-cartbutton-order{display:inline-block; vertical-align:top; border:1px solid #e5e5e5; width:40px; line-height:38px; border-radius:0px 5px 5px 0px; -moz-border-radius:0px 5px 5px 0px; -webkit-border-radius:0px 5px 5px 0px; font-size:12px; font-weight:700; color:#999; cursor:pointer; background:#fff}.minimal-light .esg-cartbutton{color:#333; cursor:default !important}.minimal-light .esg-cartbutton .esgicon-basket{color:#333; font-size:15px; line-height:15px; margin-right:10px}.minimal-light .esg-cartbutton-wrapper{cursor:default !important}.minimal-light .esg-sortbutton,.minimal-light .esg-cartbutton{display:inline-block; position:relative; cursor:pointer; margin-right:0px; border-right:none; border-radius:5px 0px 0px 5px; -moz-border-radius:5px 0px 0px 5px; -webkit-border-radius:5px 0px 0px 5px}.minimal-light .esg-navigationbutton:hover,.minimal-light .esg-filterbutton:hover,.minimal-light .esg-sortbutton:hover,.minimal-light .esg-sortbutton-order:hover,.minimal-light .esg-cartbutton a:hover,.minimal-light .esg-filterbutton.selected{background-color:#fff; border-color:#bbb; color:#333; box-shadow:0px 3px 5px 0px rgba(0,0,0,0.13)}.minimal-light .esg-navigationbutton:hover *{color:#333}.minimal-light .esg-sortbutton-order.tp-desc:hover{border-color:#bbb; color:#333; box-shadow:0px -3px 5px 0px rgba(0,0,0,0.13) !important}.minimal-light .esg-filter-checked{padding:1px 3px; color:#cbcbcb; background:#cbcbcb; margin-left:7px; font-size:9px; font-weight:300; line-height:9px; vertical-align:middle}.minimal-light .esg-filterbutton.selected .esg-filter-checked,.minimal-light .esg-filterbutton:hover .esg-filter-checked{padding:1px 3px 1px 3px; color:#fff; background:#000; margin-left:7px; font-size:9px; font-weight:300; line-height:9px; vertical-align:middle}
.eg-wc-demos-element-24{font-size:25px; line-height:40px; color:#ffffff; font-weight:200; padding:5px 10px 5px 10px ; border-radius:0px 0px 0px 0px ; background:rgba(0,0,0,0.5); z-index:2 !important; display:block; font-family:”Lato”; text-transform:uppercase}.eg-wc-demos-element-28{font-size:15px !important; line-height:25px !important; color:#ffffff !important; font-weight:800 !important; display:inline-block !important; float:right !important; clear:both !important; margin:0px 0px 0px 0px !important; padding:3px 10px 2px 10px !important; border-radius:0px 0px 0px 5px !important; background:rgba(38,38,38,0.70) !important; position:relative !important; z-index:2 !important; font-family:”Lato” !important; text-transform:uppercase !important}.eg-wc-demos-element-0{font-size:20px !important; line-height:25px !important; color:#363839 !important; font-weight:600 !important; display:block !important; text-align:left !important; clear:both !important; margin:0px 0px 20px 0px !important; padding:0px 0px 0px 0px !important; border-radius:0px 0px 0px 0px !important; position:relative !important; z-index:2 !important; text-transform:capitalize !important}.eg-wc-demos-element-27{font-size:12px; line-height:20px; color:#888888; font-weight:400; display:inline-block; float:none; clear:both; margin:0px 0px 0px 0px ; padding:0px 0px 0px 0px ; border-radius:0px 0px 0px 0px ; background:transparent; position:relative; z-index:2 !important; font-family:”Raleway”; text-transform:uppercase}
.eg-wc-demos-element-24:hover{font-size:25px; line-height:40px; color:#ffffff; font-weight:200; border-radius:0px 0px 0px 0px ; background:rgba(0,0,0,0.71); font-family:”Lato”; text-transform:uppercase}
.eg-wc-demos-element-24-a{display:inline-block; float:none; clear:both; margin:0px 0px 0px 0px ; position:relative}
.eg-wc-demos-container{background:transparent}
.eg-wc-demos-content{background:#fcfcfc; padding:30px 30px 30px 30px; border-width:0px 0px 0px 0px; border-radius:0px 0px 0px 0px; border-color:transparent; border-style:double; text-align:left}
.esg-grid .mainul li.eg-wc-demos-wrapper{background:#ffffff; padding:0px 0px 0px 0px; border-width:0px 0px 0px 0px; border-radius:0px 0px 0px 0px; border-color:transparent; border-style:none; box-shadow:0px 1px 6px 0px rgba(0,0,0,0.20)}
.esg-grid .mainul li.eg-wc-demos-wrapper .esg-media-poster{background-size:cover; background-position:center center; background-repeat:no-repeat}

VIEW DEMO

Cup
Use the product designer for mugs.

VIEW DEMO

Phone Cases
Display the product designer in a modal window (lightbox) by clicking a button to start customization.

VIEW DEMO

Bottle
Display the main bar for the product designer anywhere in the product page.

VIEW DEMO

Variable Phone Cases
Load a different product into the Fancy Product Designer depending on the selected variation.

VIEW DEMO
Bulk Variations

iPhone X (Bulk Variations)
User-friendly interface allowing you to view your selections in one handy column.

var essapi_7;
jQuery(document).ready(function() {
essapi_7 = jQuery(“#esg-grid-7-9″).tpessential({
gridID:7,
layout:”masonry”,
forceFullWidth:”off”,
lazyLoad:”off”,
row:9999,
apiName: “essapi_7″,
loadMoreAjaxToken:”5e06225cab”,
loadMoreAjaxUrl:”https://fancyproductdesigner.com//wp-admin/admin-ajax.php”,
loadMoreAjaxAction:”Essential_Grid_Front_request_ajax”,
ajaxContentTarget:”ess-grid-ajax-container-“,
ajaxScrollToOffset:”0″,
ajaxCloseButton:”off”,
ajaxContentSliding:”on”,
ajaxScrollToOnLoad:”on”,
ajaxCallbackArgument:”off”,
ajaxNavButton:”off”,
ajaxCloseType:”type1″,
ajaxCloseInner:”false”,
ajaxCloseStyle:”light”,
ajaxClosePosition:”tr”,
space:20,
pageAnimation:”fade”,
startAnimation: “none”,
startAnimationSpeed: 1000,
startAnimationDelay: 100,
startAnimationType: “item”,
animationType: “item”,
paginationScrollToTop:”off”,
paginationAutoplay:”off”,
spinner:”spinner0″,
lightBoxMode:”single”,
lightboxHash:”group”,
lightboxPostMinWid:”75%”,
lightboxPostMaxWid:”75%”,
lightboxSpinner:”off”,
lightBoxFeaturedImg:”off”,
lightBoxPostTitle:”off”,
lightBoxPostTitleTag:”h2″,
lightboxMargin : “0|0|0|0”,
lbContentPadding : “0|0|0|0”,
lbContentOverflow : “auto”,
animSpeed:1000,
delayBasic:1,
mainhoverdelay:1,
filterType:”multi”,
filterLogic:”or”,
showDropFilter:”hover”,
filterGroupClass:”esg-fgc-7″,
filterNoMatch:”No Items for the Selected Filter”,
filterDeepLink:”off”,
hideMarkups: “on”,
inViewport: true,
viewportBuffer: 20,
youtubeNoCookie:”false”,
convertFilterMobile:false,
paginationSwipe: “off”,
paginationDragVer: “off”,
pageSwipeThrottle: 30,
googleFonts:[‘Open+Sans:300,400,600,700,800′,’Raleway:100,200,300,400,500,600,700,800,900′,’Droid+Serif:400,700’],
hideBlankItemsAt: “1”,
responsiveEntries: [
{ width:1400,amount:3,mmheight:0},
{ width:1170,amount:3,mmheight:0},
{ width:1024,amount:3,mmheight:0},
{ width:960,amount:3,mmheight:0},
{ width:778,amount:3,mmheight:0},
{ width:640,amount:3,mmheight:0},
{ width:480,amount:1,mmheight:0}
]
});

var arrows = true,
lightboxOptions = {
margin : [0,0,0,0],
buttons : [“share”,”thumbs”,”close”],
infobar : true,
loop : true,
slideShow : {“autoStart”: false, “speed”: 3000},
animationEffect : “fade”,
animationDuration : 500,
beforeShow: function(a, c) {
if(!arrows) {
jQuery(“body”).addClass(“esgbox-hidearrows”);
}
var i = 0,
multiple = false;
a = a.slides;
for(var b in a) {
i++;
if(i > 1) {
multiple = true;
break;
}
}
if(!multiple) jQuery(“body”).addClass(“esgbox-single”);
if(c.type === “image”) jQuery(“.esgbox-button–zoom”).show();
},
beforeLoad: function(a, b) {
jQuery(“body”).removeClass(“esg-four-by-three”);
if(b.opts.$orig.data(“ratio”) === “4:3”) jQuery(“body”).addClass(“esg-four-by-three”);
},
afterLoad: function() {jQuery(window).trigger(“resize.esglb”);},
afterClose : function() {jQuery(“body”).removeClass(“esgbox-hidearrows esgbox-single”);},
transitionEffect : “fade”,
transitionDuration : 500,
hash : “group”,
arrows : true,
wheel : false,
};

jQuery(“#esg-grid-7-9”).data(“lightboxsettings”, lightboxOptions);

});[/cs_content_seo]