File: //proc/self/cwd/wp-content/plugins/woo-variation-swatches/includes/preview-tab-tutorials.php
<?php
defined( 'ABSPATH' ) or die( 'Keep Quit' );
?>
<div id="wvs-pro-product-variable-swatches-options" class="panel wc-metaboxes-wrapper hidden">
<style type="text/css">
.gwp-pro-features-wrapper {
padding: 20px;
margin: 10px;
background-color: #f1f1f1;
}
.gwp-pro-features-wrapper li span {
color: #15ce5c;
}
.gwp-pro-features-wrapper p, .gwp-pro-features-wrapper ul {
padding: 10px 0;
}
.gwp-pro-button span {
padding-top: 10px;
}
.gwp-pro-features-wrapper ul {
display: block;
}
.gwp-pro-features-wrapper ul li {
margin-bottom: 10px;
}
.gwp-pro-features-wrapper .gwp-pro-features-links {
margin-left: 20px;
padding: 5px;
}
</style>
<div class="gwp-pro-features-wrapper">
<h3>How To Convert Variation Select Dropdown Into Color, Image and Button Swatches For Free (Global Attribute)</h3>
<ul>
<li>
<div class="gwp-pro-video-features-wrapper">
<iframe width="100%" height="485" src="https://www.youtube.com/embed/4uIZjvWiSf0?rel=0&showinfo=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
</div>
</li>
</ul>
<h3>How To Convert Variation Select Dropdown Into Color, Image, Button and Radio Swatches (Custom Product Level Attribute)</h3>
<ul>
<li>
<div class="gwp-pro-video-features-wrapper">
<iframe width="100%" height="485" src="https://www.youtube.com/embed/rg1Xg-t29Kc?rel=0&showinfo=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
</div>
</li>
</ul>
<h3>How To Show WooCommerce Variation Swatches on Shop / Archive Page</h3>
<ul>
<li>
<div class="gwp-pro-video-features-wrapper">
<iframe width="100%" height="485" src="https://www.youtube.com/embed/1IhEZiGzJHs?rel=0&showinfo=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
</div>
</li>
</ul>
<h3>How To Convert WooCommerce Product Variation Into Dual / Multi Color Swatches</h3>
<ul>
<li>
<div class="gwp-pro-video-features-wrapper">
<iframe width="100%" height="485" src="https://www.youtube.com/embed/EgwRHfeGSZQ?rel=0&showinfo=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
</div>
</li>
</ul>
<h4>With the premium version of Variation Swatches for WooCommerce, you can do:</h4>
<ul>
<li><span class="dashicons dashicons-yes"></span> Convert attribute variations into radio button.
<div class="gwp-pro-features-links">
<a target="_blank" href="https://demo.getwooplugins.com/woocommerce-variation-swatches/radio-variation-swatches">Live Demo</a> |
<a target="_blank" href="https://www.youtube.com/watch?v=XY6GjG3yPUU&list=PLjkiDGg3ul_JB6vcxRYEVlDC1_setGLY0">Video Tutorial</a>
</div>
</li>
<li>
<span class="dashicons dashicons-yes"></span> Show Entire Color, Image, Label And Radio Attributes Swatches In Catalog/ Category / Archive / Store/ Shop Pages
<div class="gwp-pro-features-links">
<a target="_blank" href="https://demo.getwooplugins.com/woocommerce-variation-swatches/">Live Demo</a> |
<a target="_blank" href="https://www.youtube.com/watch?v=1IhEZiGzJHs">Video Tutorial</a></div>
</li>
<li>
<span class="dashicons dashicons-yes"></span> Show Selected Single Color or Image Or Label Attribute Swatches In Catelog/ Category / Archive / Store / Shop Pages
<div class="gwp-pro-features-links">
<a target="_blank" href="https://demo.getwooplugins.com/woocommerce-variation-swatches/product-details/">Live Demo</a> |
<a target="_blank" href="https://www.youtube.com/watch?v=r1DIlBSJI5o&list=PLjkiDGg3ul_L-3332EDkmuN_G2ttrJM24&index=8">Video Tutorial</a>
</div>
</li>
<li>
<span class="dashicons dashicons-yes"></span> Individual Product Basis Attribute Variation Swatches Customization
<div class="gwp-pro-features-links">
<a target="_blank" href="https://demo.getwooplugins.com/woocommerce-variation-swatches/show-all-swatches-type-in-the-same-variation/">Live Demo</a> |
<a target="_blank" href="https://www.youtube.com/watch?v=rg1Xg-t29Kc">Video Tutorial</a>
</div>
</li>
<li>
<span class="dashicons dashicons-yes"></span> Show Image, Color, Button Variation Swatches in Same Attribute
<div class="gwp-pro-features-links">
<a target="_blank" href="https://demo.getwooplugins.com/woocommerce-variation-swatches/product-details/product/polo-ralph-lauren-ph3127-59/">Live Demo</a> |
<a target="_blank" href="https://www.youtube.com/watch?v=ILf1S2k97es&list=PLjkiDGg3ul_L-3332EDkmuN_G2ttrJM24&index=9">Video Tutorial</a>
</div>
</li>
<li>
<span class="dashicons dashicons-yes"></span> Convert Manually Created Attribute Variations Into Color, Image, and Label Swatches
<div class="gwp-pro-features-links">
<a target="_blank" href="https://www.youtube.com/watch?v=rg1Xg-t29Kc">Video Tutorial</a>
</div>
</li>
<li>
<span class="dashicons dashicons-yes"></span> Change Variation Product Gallery After Selecting Single Attribute Like Amazon Or AliExpress
<div class="gwp-pro-features-links">
<a target="_blank" href="https://demo.getwooplugins.com/woocommerce-variation-swatches/change-product-image-based-on-select-attribute/">Live Demo</a> |
<a target="_blank" href="https://www.youtube.com/watch?v=31WR96-9kuQ">Video Tutorial</a>
</div>
</li>
<li><span class="dashicons dashicons-yes"></span> Generate Selected Attribute Variation Link
<div class="gwp-pro-features-links">
<a target="_blank" href="https://demo.getwooplugins.com/woocommerce-variation-swatches/generate-link-for-selected-variations/">Live Demo</a> |
<a target="_blank" href="https://www.youtube.com/watch?v=Zw_5ACg0ASA&list=PLjkiDGg3ul_L-3332EDkmuN_G2ttrJM24">Video Tutorial</a>
</div>
</li>
<li>
<span class="dashicons dashicons-yes"></span> Option to Select ROUNDED and SQUARED Attribute Variation Swatches Shape In the Same Product.
<div class="gwp-pro-features-links">
<a target="_blank" href="https://demo.getwooplugins.com/woocommerce-variation-swatches/round-square-shape-swatches">Live Demo</a> |
<a target="_blank" href="https://www.youtube.com/watch?v=1yO9DGYCYAA&list=PLjkiDGg3ul_L-3332EDkmuN_G2ttrJM24&index=10">Video Tutorial</a>
</div>
</li>
<li>
<span class="dashicons dashicons-yes"></span> Blur Or Hide Or Show Cross Sign For Out of Stock Variation Swatches (Unlimited Variations Without hiding out of stock item from catalog)
<div class="gwp-pro-features-links">
<a target="_blank" href="https://demo.getwooplugins.com/woocommerce-variation-swatches/cross-out-of-stock-variations-more-than-30-variations/">Live Demo</a> |
<a target="_blank" href="https://www.youtube.com/watch?v=LGomum3lwHw&list=PLjkiDGg3ul_L-3332EDkmuN_G2ttrJM24&index=11">Video Tutorial</a></div>
</li>
<li><span class="dashicons dashicons-yes"></span> Shop Page Swatches Size Control
<div class="gwp-pro-features-links">
<a target="_blank" href="https://www.youtube.com/watch?v=xeT7byUaa7U">Live Preview</a></div>
</li>
<li>
<span class="dashicons dashicons-yes"></span> Make Selected Attribute Variation Swatches Size Larger Than Other Default Attribute Variations
<div class="gwp-pro-features-links">
<a target="_blank" href="https://demo.getwooplugins.com/woocommerce-variation-swatches/swatches-size-selected-attribute/">Live Demo</a> |
<a target="_blank" href="https://www.youtube.com/watch?v=xeT7byUaa7U">Video Tutorial</a>
</div>
</li>
<li>
<span class="dashicons dashicons-yes"></span> Show Custom Text in Variation Tooltip In Product and Shop Page
<div class="gwp-pro-features-links">
<a target="_blank" href="https://www.youtube.com/watch?v=bzx_G5Di9kQ&list=PLjkiDGg3ul_L-3332EDkmuN_G2ttrJM24&index=12">Live Preview</a></div>
</li>
<li>
<span class="dashicons dashicons-yes"></span> Show Custom Image in Variation Swatches Tooltip In Product And Shop Page
<div class="gwp-pro-features-links">
<a target="_blank" href="https://demo.getwooplugins.com/woocommerce-variation-swatches/image-tooltip/">Live Demo</a> |
<a target="_blank" href="https://www.youtube.com/watch?v=zrOeb2ksOig&list=PLjkiDGg3ul_L-3332EDkmuN_G2ttrJM24&index=13">Video Tutorial</a>
</div>
</li>
<li><span class="dashicons dashicons-yes"></span> Archive page swatches positioning.</li>
<li><span class="dashicons dashicons-yes"></span> Archive page swatches alignment.</li>
<li><span class="dashicons dashicons-yes"></span> Tooltip display setting on archive/shop page.</li>
<li><span class="dashicons dashicons-yes"></span> Variation clear button display setting.</li>
<li><span class="dashicons dashicons-yes"></span> Customize tooltip text and background color.</li>
<li><span class="dashicons dashicons-yes"></span> Customize tooltip image and image size.</li>
<li><span class="dashicons dashicons-yes"></span> Customize font size, swatches height and width.
</li>
<li>
<span class="dashicons dashicons-yes"></span> Customize swatches colors, background and border sizes.
</li>
<li><span class="dashicons dashicons-yes"></span> Automatic updates and exclusive technical support.
</li>
</ul>
<div class="clear"></div>
<a target="_blank" class="button button-primary button-hero gwp-pro-button" href="<?php echo esc_url( woo_variation_swatches()->get_pro_link( 'product-edit' ) ); ?>">Okay, I need the features!<span class="dashicons dashicons-external"></span></a>
</div>
</div>