File: /home/studiomoguls/webapps/Studio-mogulsc-clone/wp-content/plugins/arprice/documentation/index.html
<!DOCTYPE html>
<html>
<head lang="en">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<title>ReputeInfosystems | ARPrice Documentation</title>
<meta name="description" content="Create a wordpress pricing table in fraction of time - ARPrice Plugin allows you to make create fully functional pricing table without any coding." />
<meta name="keywords" content="pricing table plugin, wordpress pricing table plugin, price table, pricing table, ARPrice, ARPrice - Ultimate wordpress pricing table plugin " />
<link rel="stylesheet" href="assets/css/lightbox.css" type="text/css">
<link rel="stylesheet" href="assets/style.css" type="text/css" media="screen, projection">
<style type="text/css">
</style>
<script language="javascript" src="js/jquery-1.11.2.min.js"></script>
<script language="javascript">
jQuery(function($) {
var amountScrolled = 460;
$(window).scroll(function() {
if ( $(window).scrollTop() > amountScrolled ) {
$('a.back-to-top').fadeIn('slow');
} else {
$('a.back-to-top').fadeOut('slow');
}
});
$('a.back-to-top').click(function() {
$('html, body').animate({
scrollTop: 0
}, 700);
return false;
});
$('.panel').click(function(event) {
event.preventDefault();
$('.panel').removeClass('active');
$('html,body').animate({scrollTop:0}, 'fast','swing');
var id = this.hash;
$('#content').fadeOut('fast',function(){
$(this).html($(id).html()).fadeIn();
});
$(this).addClass('active');
});
var stickyTop = 40;
jQuery(window).scroll(function(){
var windowTop = jQuery(window).scrollTop() + 20;
if (stickyTop < windowTop)
{
$('#header').css({ position: 'fixed', top: 0 , height: '82px' });
}
else
{
$('#header').css({ position: 'fixed', top: 0 , height: '82px' });
}
});
jQuery("#menu_toggle").click(function(){
jQuery("body").toggleClass("nav_open");
});
jQuery("#overlay").click(function(){
jQuery("body").toggleClass("nav_open");
});
jQuery(document).ready(function(){
set_min_height();
jQuery(window).resize(function () {
set_min_height();
});
});
function set_min_height(){
var minheight = jQuery(window).height();
jQuery(".main_wrap").css('min-height', minheight);
}
});
</script>
</head>
<body>
<div class="header" id="header">
<a class="show_on_mobile" id="menu_toggle">
<span class="menu_icon"></span>
<span class="vert_divider"></span>
</a>
<div class="logo_wrap">
<div class="logo"></div>
</div>
</div>
<div class="main_wrap">
<div class="wrap clearfix">
<div id="sidebar">
<div id="api_sections">
<h5>Getting Started</h5>
<ul>
<li><a class="panel" href="#intro">Home</a></li>
<li><a class="panel" href="#installation">Installation & Activation</a></li>
</ul>
<h5>Documentation</h5>
<ul>
<li><a class="panel" href="#edit_clone_template">Template Selection</a></li>
<li><a class="panel" href="#real_time_editor">Real Time Editor</a></li>
</ul>
<h5>Editor Options</h5>
<ul>
<li><a class="panel" href="#column_settings_options">Column Options</a></li>
<li><a class="panel" href="#effects_options">Effects</a></li>
<li><a class="panel" href="#fonts">Fonts</a></li>
<li><a class="panel" href="#tooltip">Tooltip</a></li>
<li><a class="panel" href="#custom_css">Custom CSS</a></li>
<li><a class="panel" href="#toggle_price">Toggle Price </a></li>
<li><a class="panel" href="#color_scheme">Color Schemes</a></li>
<li><a class="panel" href="#custom_color_scheme">Custom Color Option</a></li>
</ul>
<h5>Column Level Options</h5>
<ul>
<li><a class="panel" href="#column_settings">Column Settings</a></li>
<li><a class="panel" href="#header_settings">Header Settings</a></li>
<li><a class="panel" href="#price_settings">Price Settings</a></li>
<li><a class="panel" href="#body_settings">Body Settings</a></li>
<li><a class="panel" href="#button_settings">Footer Settings</a></li>
</ul>
<h5>Supports</h5>
<ul>
<li><a class="panel" href="#paypal_integration">Paypal Integration</a></li>
<li><a class="panel" href="#woocommerce_integration">WooCommerce Integration</a></li>
<li><a class="panel" href="#arforms_integration">ARForms Integration</a></li>
</ul>
<h5>Other Options</h5>
<ul>
<li><a class="panel" href="#template_preview">Pricing Table Preview</a></li>
<li><a class="panel" href="#publish_pricing_table">Publish Your Pricing Table</a></li>
<li><a class="panel" href="#import_export_templates">Import-Export Templates</a></li>
<li><a class="panel" href="#global_settings">Global Settings</a></li>
</ul>
<h5>Reference</h5>
<ul>
<li><a class="panel" href="#sources_credits">Sources & Credits</a></li>
<li><a class="panel" href="#changelog">Changelog</a></li>
</ul>
</div>
</div>
<div id="content">
<div id="intro">
<h1>ARPrice - Ultimate Wordpress Pricing Table Plugin ( Version: 2.5.4 )</h1>
<div class="card">
<p><span class="icon_clock"></span><strong>Created:</strong> 21/10/2016</p>
<p><span class="icon_by"></span><strong>By:</strong> <a href="http://www.reputeinfosystems.com" target="_blank">Repute Infosystems</a> </p>
<p class="bottom_margin"><span class="icon_email"></span><strong> Email: </strong><a href="mailto:info@reputeinfosystems.com">info@reputeinfosystems.com</a></p>
<p>Thank you for purchasing our plugin. Please do not forget to rate our product by giving 5 star. We would be happy to see your comments and stars.</p>
<p>If you have any questions that are beyond the scope of this help file, please feel free to open support ticket <a href="http://www.reputeinfosystems.com/contact_support.php?help=arprice" target="_blank">here</a>. Thank you very much!</p>
<hr>
<h2>What is ARPrice?</h2>
<p>ARPrice is a fully featured <b>wordpress pricing table plugin</b> which you can use in any type of website. It's very powerful and flexible enough to look perfect in any modern wordpress theme. It's very fast and easy to create stunning pricing tables in just few seconds.</p>
<p>The best part of ARPrice is it's fully featured admin panel. First time it's happening that, in Pricing Table history you will have wordpress plugin having <code>DRAG AND DROP </code>columns. Apart form pricing table content and its font settings, ARPrice will give you facility to add Videos, Audios, Google Map, And Many More.</p>
<p>To publish any pricing table, you just need few clicks on settings and it all ready !!! ARPrice is UNIQUE pricing table plugin having 250+ ready pricing tables for your website. Just pick any of them and you are just done.</p>
<hr>
<h2>ARPrice Key Features:</h2>
<ul class="large_bottom_margin">
<li><strong>Fully Featured Admin Panel</strong> Having <code>DRAG AND DROP</code> & <code>Resizable</code> Columns.</li>
<li><code>Unlimited Colors</code> facility having beautiful look with each colors for Templates.</li>
<li>Monthly-yearly <code>Toggle price</code> Button</li>
<li>Facility for making <code>Full Column Clickable. </code></li>
<li>Facility to <code>Hide sections</code> for better customization.</li>
<li>Facility to <code>customize uploaded media</code> at header.</li>
<li><code>Responsive</code> Pricing Tables Design.</li>
<li>support <code>Unlimited Columns</code> to add in templates.</li>
<li>For each individual columns Custom CSS available.</li>
<li>Facility to handle number of <strong>columns to display</strong> at <strong>responsive view</strong>.</li>
<li><strong>Realtime Pricing Table Editor</strong></li>
<li>Customizable <code>Tooltip</code> Support</li>
<li>Provides Customizable <code>Unique Toggle Pricing</code> feature with different styling options.</li>
<li><code>Column Rotation</code> with <strong>lots of options.</strong></li>
<li>Supports different <code>Hover Effects</code> for Active Columns, <code>Navigation Effects</code> and <code>Animation Effects.</code></li>
<li>Facility to <code>Animate pricing value</code></li>
<li>Supports different <code>Shadow Styles</code> to give better look to columns of templates.</li>
<li><code>Live Preview</code> for <strong>Desktop Version</strong>, <strong>Tablet Version</strong> and <strong>Mobile Version</strong></li>
<li>Separate Settings for <strong>Header</strong>, <strong>Body</strong>, <strong>Pricing</strong> and <strong>Buttons</strong></li>
<li><strong> 170+ </strong>ready Pricing Tables</li>
<li>Fully customizable <strong>Ribbons</strong> support including unique <code>Custom Ribbon</code> feature.</li>
<li>Facility of <code>Post Variables</code> to send with button link or button script</li>
<li><strong>Quick template</strong> <code>duplication</code>.</li>
<li>Support Browser Default Fonts and <code>Google Fonts</code></li>
<li>Available <code>Font Preview</code> with all Font Family option.</li>
<li>Supports <strong>2500+</strong> different <strong>Font Icons</strong> including <code>Font Awesome Icons</code>, <code>Material Design Icons</code>, <code>Typicons</code>, <code>Ionicons</code>.</li>
<li>Support for <code>Visual Composer</code></li>
<li>Support for <code>Paypal Script</code> and other shortcodes</li>
<li>Supports <strong>Videos</strong>( <code>youtube</code>, <code>vimeo</code>, <code>screenr</code>, <code>html5</code>, <code>dailymotion</code>, <code>metacafe</code>)</li>
<li>Supports <strong>Audios</strong>( <code>html5</code>, <code>soundcloud</code>, <code>mixcloud</code>, <code>beatport</code>)</li>
<li>Supports <code>Google map</code>, and many more</li>
<li>Supports <code>Woo-Commerce</code> Add To Cart Shortcode</li>
<li>Supports <code>S2member</code>, <code>ARForms</code> and other third party shortcodes/scripts</li>
<li>Provides <code>Custom CSS</code> with<strong> CSS Class Information</strong> for advanced user to customize pricing table</li>
<li>Facility for <code>Footer Content</code></li>
<li>Facility to <strong>Import and Export Templates.</strong></li>
<li>Provides <code>Statistics</code> and <code>Analytics</code> for each templates.</li>
<li>Facility of <strong>Global Settings for Responsive View. </strong></li>
<li>Facility to <code>Hide Blank Rows</code> from bottom for all columns.</li>
<li>Provides Facility to add <code>character sets</code> with google fonts.</li>
</ul>
</div>
</div>
</div>
<!-- Div Contents -->
<div class="nonecontent" style="display: none;">
<div id="intro">
<h1>ARPrice - Ultimate Wordpress Pricing Table Plugin ( Version: 2.5.4 )</h1>
<div class="card">
<p><span class="icon_clock"></span><strong>Created:</strong> 21/10/2016</p>
<p><span class="icon_by"></span><strong>By:</strong> <a href="http://www.reputeinfosystems.com" target="_blank">Repute Infosystems</a> </p>
<p class="bottom_margin"><span class="icon_email"></span><strong> Email: </strong><a href="mailto:info@reputeinfosystems.com">info@reputeinfosystems.com</a></p>
<p>Thank you for purchasing our plugin. Please do not forget to rate our product by giving 5 star. We would be happy to see your comments and stars.</p>
<p>If you have any questions that are beyond the scope of this help file, please feel free to open support ticket <a href="http://www.reputeinfosystems.com/contact_support.php?help=arprice" target="_blank">here</a>. Thank you very much!</p>
<hr>
<h2>What is ARPrice?</h2>
<p>ARPrice is a fully featured <b>wordpress pricing table plugin</b> which you can use in any type of website. It's very powerful and flexible enough to look perfect in any modern wordpress theme. It's very fast and easy to create stunning pricing tables in just few seconds.</p>
<p>The best part of ARPrice is it's fully featured admin panel. First time it's happening that, in Pricing Table history you will have wordpress plugin having <code>DRAG AND DROP </code>columns. Apart form pricing table content and its font settings, ARPrice will give you facility to add Videos, Audios, Google Map, And Many More.</p>
<p>To publish any pricing table, you just need few clicks on settings and it all ready !!! ARPrice is UNIQUE pricing table plugin having 250+ ready pricing tables for your website. Just pick any of them and you are just done.</p>
<hr>
<h2>ARPrice Key Features:</h2>
<ul class="large_bottom_margin">
<li><strong>Fully Featured Admin Panel</strong> Having <code>DRAG AND DROP</code> & <code>Resizable</code> Columns.</li>
<li><code>Unlimited Colors</code> facility having beautiful look with each colors for Templates.</li>
<li>Monthly-yearly <code>Toggle price</code> Button</li>
<li>Facility for making <code>Full Column Clickable. </code></li>
<li>Facility to <code>Hide sections</code> for better customization.</li>
<li>Facility to <code>customize uploaded media</code> at header.</li>
<li><code>Responsive</code> Pricing Tables Design.</li>
<li>support <code>Unlimited Columns</code> to add in templates.</li>
<li>For each individual columns Custom CSS available.</li>
<li>Facility to handle number of <strong>columns to display</strong> at <strong>responsive view</strong>.</li>
<li><strong>Realtime Pricing Table Editor</strong></li>
<li>Customizable <code>Tooltip</code> Support</li>
<li>Provides Customizable <code>Unique Toggle Pricing</code> feature with different styling options.</li>
<li><code>Column Rotation</code> with <strong>lots of options.</strong></li>
<li>Supports different <code>Hover Effects</code> for Active Columns, <code>Navigation Effects</code> and <code>Animation Effects.</code></li>
<li>Facility to <code>Animate pricing value</code></li>
<li>Supports different <code>Shadow Styles</code> to give better look to columns of templates.</li>
<li><code>Live Preview</code> for <strong>Desktop Version</strong>, <strong>Tablet Version</strong> and <strong>Mobile Version</strong></li>
<li>Separate Settings for <strong>Header</strong>, <strong>Body</strong>, <strong>Pricing</strong> and <strong>Buttons</strong></li>
<li><strong> 170+ </strong>ready Pricing Tables</li>
<li>Fully customizable <strong>Ribbons</strong> support including unique <code>Custom Ribbon</code> feature.</li>
<li>Facility of <code>Post Variables</code> to send with button link or button script</li>
<li><strong>Quick template</strong> <code>duplication</code>.</li>
<li>Support Browser Default Fonts and <code>Google Fonts</code></li>
<li>Available <code>Font Preview</code> with all Font Family option.</li>
<li>Supports <strong>2500+</strong> different <strong>Font Icons</strong> including <code>Font Awesome Icons</code>, <code>Material Design Icons</code>, <code>Typicons</code>, <code>Ionicons</code>.</li>
<li>Support for <code>Visual Composer</code></li>
<li>Support for <code>Paypal Script</code> and other shortcodes</li>
<li>Supports <strong>Videos</strong>( <code>youtube</code>, <code>vimeo</code>, <code>screenr</code>, <code>html5</code>, <code>dailymotion</code>, <code>metacafe</code>)</li>
<li>Supports <strong>Audios</strong>( <code>html5</code>, <code>soundcloud</code>, <code>mixcloud</code>, <code>beatport</code>)</li>
<li>Supports <code>Google map</code>, and many more</li>
<li>Supports <code>Woo-Commerce</code> Add To Cart Shortcode</li>
<li>Supports <code>S2member</code>, <code>ARForms</code> and other third party shortcodes/scripts</li>
<li>Provides <code>Custom CSS</code> with<strong> CSS Class Information</strong> for advanced user to customize pricing table</li>
<li>Facility for <code>Footer Content</code></li>
<li>Facility to <strong>Import and Export Templates.</strong></li>
<li>Provides <code>Statistics</code> and <code>Analytics</code> for each templates.</li>
<li>Facility of <strong>Global Settings for Responsive View. </strong></li>
<li>Facility to <code>Hide Blank Rows</code> from bottom for all columns.</li>
<li>Provides Facility to add <code>character sets</code> with google fonts.</li>
</ul>
</div>
</div>
<div id="installation">
<h1>Installation And Activation</h1>
<div class="card">
<p>You can install plugin either of these two methods.</p>
<h3>New install via FTP </h3>
<ol class="large_bottom_margin bottom_margin" type="a">
<li>Download the plugin from CodeCanyon, and extract it. You should find a directory <strong>arprice.</strong></li>
<li>In your WordPress installation, upload <strong>arprice</strong> to <code>wp-content/plugins/</code></li>
<li>Activate the <strong>"ARPrice"</strong> plugin through the <strong>Plugins</strong> menu from WordPress admin panel.</li>
</ol>
<h3>New install via the WordPress Uploader </h3>
<ol class="large_bottom_margin bottom_margin" type="a">
<li>Download the plugin from <code>CodeCanyon</code></li>
<li>Log in to your WordPress admin panel</li>
<li>Go to <code>Plugins</code> -> <code>Add New</code> -> <code>Upload</code></li>
<li>Click on choose file and browse the download package from <code>CodeCanyon</code>. When the plugin uploads successfully, click on <code>Activate Plugin</code>.</li>
</ol>
<p class="bottom_margin">After activating the plugin, you will be able to see <strong>ARPrice</strong> menu in admin left menu.</p>
<p class="doc_image"><a href="assets/images/ARprice_plugin_installation.png" rel="lightbox"><img src="assets/images/ARprice_plugin_installation.png" alt="ARPrice - Plugin Installation" title="ARPrice - Plugin Installation" /></a></p>
<p>After activating the plugin, you need to activate your license for support and automatic upgrades. You will get Pricing Table Analytics Feature only after activating your license. A license key only be used for one installation of WordPress at a time.</p>
<p class="bottom_margin">Click on <code>Settings</code> link under "ARPrice" Menu to activate your license. You will see below section there on that page. To activate your license, you need to enter your Name, Email address and purchase code( Unique code obtained while purchased this product). </p>
<p class="doc_image"><a href="assets/images/ARPrice_activation.png" rel="lightbox"><img src="assets/images/ARPrice_activation.png" alt="ARPrice - Plugin Activation" title="ARPrice - Plugin Activation"/></a></p>
</div>
</div>
<div id="edit_clone_template">
<h1>Template Selection</h1>
<div class="card">
<p>Please refer <strong>Documentation</strong> or <strong>Tour Guide</strong> from right buttons at home page before starting to better understand.</p>
<p>ARPrice provides lots of beautiful pricing tables ready to use clone of it which are listed here.</p>
<p>Here you will also have a list of all your saved templates where you will be able to see another options on hover which includes Preview, Template Duplication, Edit Template and Delete Template.</p>
<p>Another information also available here with each template such as Title, Last Modified Date, <code>Statistics</code>, and <strong>Shortcode.</strong></p>
<p class="doc_image"><a href="assets/images/ARPrice_edit_template.png" rel="lightbox"><img src="assets/images/ARPrice_edit_template.png" alt="ARPrice Edit/Clone Template" title="ARPrice Edit/Clone Template"/></a></p>
<h2>Select Template</h2>
<p>Click on Select or double click on any of your favorite template from list and customize according to your requirements.</p>
<h2>Preview</h2>
<p>You can preview template before select from preview option visible on hover at each templates.</p>
</div>
</div>
<div id="real_time_editor">
<h1>Real Time Editor</h1>
<div class="card">
<p>ARPrice is the only pricing table plugin worldwide to provide this type of state of the art Editor. Its real user friend that any novice person too can create beautiful pricing tables and put on page without having any programming knowledge.</p>
<p>Following picture shows you a basic view of editor. Detailed explanation of each portion is explained in separate sections.</p>
<p class="doc_image"><a href="assets/images/ARPrice_real_time_editor.png" rel="lightbox"><img src="assets/images/ARPrice_real_time_editor.png" alt="ARPrice - Real time Editor" title="ARPrice - Real time Editor"/></a></p>
<p>There are lots of options like colors, size, fonts, etc for all columns as well as each particular column and its inner sections.</p>
<h2>Template Width</h2>
<p>As you can see in following picture on top right corner you are able to set width of your template in pixels according to your requirements. It will be applied to your template <strong>Right away</strong>.</p>
<p>You will able to see a line at our real time editor which will wrap your template according to given width.</p>
<p>Number of columns in a row will be arranged according to template width you will have set.</p>
<p>For Example, If you set width <strong>1000px</strong> and column width set <strong>200px</strong> then you will have 5 columns in a row.</p>
<p class="doc_image"><a href="assets/images/ARPrice_template_width.png" rel="lightbox"><img src="assets/images/ARPrice_template_width.png" alt="ARPrice - Template Width" title="ARPrice - Template Width"/></a></p>
</div>
</div>
<div id="column_settings_options">
<h1>Column Options</h1>
<div class="card">
<p>Get all columns related options here, any change from here will apply to all columns.</p>
<p class="doc_image"><a href="assets/images/ARPrice_column_option.png" rel="lightbox"><img src="assets/images/ARPrice_column_option.png" alt="ARPrice - Column Options" title="ARPrice - Column Options"/></a></p>
<p>Let's see each options in detail here.</p>
<h2>Column Width</h2>
<p> Here you are able to set width of columns according to your requirements. Column width will be in pixels. Changing width will also apply in editor instantly.</p>
<h2>Responsive Column</h2>
<p> Here you have choice whether you want responsive columns or not. If you check Responsive column option columns width will be set automatically at responsive views. If you have not checked this option then columns will have fix width at all views. </p>
<h2>Display Columns</h2>
<p> Here display columns option allows you to select number of columns to display at <strong>mobile view</strong> and <strong>tablet view.</strong></p>
<p class="alert alert_info"><i class="ts_icon ts_icon_info_circle"></i>Number of columns to be displayed is dependent on columns width as well as responsive option set or not.</p>
<ul class="italic" style="list-style:none;">
<li><strong>e.g.</strong></li>
<li>If Responsive column is set then width will be divided equally to each columns to be displayed. If Responsive column is not set then columns will be displayed according to given column width.</li>
</ul>
<h2>Space between columns</h2>
<p>Here you are provided option to set space between all columns. Space you have entered will be in pixels. You are also able to see change of space between columns at editor.</p>
<h2>Full column clickable</h2>
<p>ARPrice pricing table plugin provides facility for making entire column clickable. If this option is checked you will be able to run button script or link by click on full column. This facility will help if you want column footer hide or if you want default button hide.</p>
<h2>Column Radius </h2>
<p>Here you have option to set column radius. You are able to set radius for each corners individually in pixels.</p>
<p class="alert alert_info"><i class="ts_icon ts_icon_info_circle"></i>Column radius will be disabled if you have selected column shadow style from effects.</p>
<h2>Hide Caption Column</h2>
<p>ARPrice provides some templates having caption column with that you are also able to hide caption column as you may no required of it.</p>
<h2>Hide blank rows from bottom</h2>
<p>ARPrice pricing table plugin provides option to hide blank rows. This will hide blank rows from <strong>bottom</strong> only.</p>
<h2>Hide Column Sections</h2>
<p>You may no need to have particular section for that ARPrice provides a unique feature to hide sections. This will help if you want only informative template like persons profiles. If select this option you will find effect in editor. Hidden section will be blurred at editor.</p>
<p>Following sections you can hide :</p>
<ul class="bottom_margin">
<li>Hide Header</li>
<li>Hide Shortcode</li>
<li>Hide Price</li>
<li>Hide Body</li>
<li>Hide Button</li>
</ul>
<h2>Opacity</h2>
<p>ARPrice pricing table also provides facility to set Opacity of your pricing table. If you have used any image in your pricing table and you want to give opacity, you can do that from here by just selecting value for opacity and "save" pricing table.</p>
<h2>Column Borders</h2>
<p>Set column borders from here having another options as following,</p>
<ul class="bottom_margin">
<li>Border Size</li>
<li>Border Type</li>
<li>Border Color</li>
<li>Border Position [Left, Right, Top, Bottom]</li>
</ul>
<h2>Row Borders</h2>
<p>Set row borders at each columns from here having another options as following,</p>
<ul class="bottom_margin">
<li>Border Size</li>
<li>Border Type</li>
<li>Border Color</li>
</ul>
<h2>Button Style Options</h2>
<p>Change style for button of each columns from here. Let's see each options provided here.</p>
<h3>Button Type</h3>
<p>ARPrice provides number of button type which gives better look of button. Following is a list of button types provided by ARPrice.</p>
<ul class="bottom_margin">
<li>Flat</li>
<li>Classic</li>
<li>Border</li>
<li>Reverse Border</li>
<li>Modern</li>
<li>Shadow</li>
</ul>
<h3>Border Radius</h3>
<p>Here you are able to set border radius for each column. You are able to set radius for each corners individually in pixels.</p>
<p class="alert alert_info"><i class="ts_icon ts_icon_info_circle"></i>Border radius will be disabled if you have selected column shadow style from effects.</p>
</div>
</div>
<!-- Done Upto Here -->
<div id="effects_options">
<h1>Effects Options</h1>
<div class="card">
<p>ARPrice provides an individual section for animation or column effects related options.</p>
<p class="doc_image"><a href="assets/images/ARPrice_Effects.png" rel="lightbox"><img src="assets/images/ARPrice_Effects.png" alt="ARPrice - Effects" title="ARPrice - Effects"/></a></p>
<p>Each options are described in detail here.</p>
<h2 class="bottom_margin">Hover Effects</h2>
<h3>Disable Hover Effect</h3>
<p>Check this option to disable active column effects and hover color changes.</p>
<h3>Disable Button Hover Effect</h3>
<p>ARPrice ready templates have also hover effect for buttons which you may not required then you are able to disable button hover effect from here.</p>
<h3>Active Column</h3>
<p>Here you are able to set effects on column hover.</p>
<p class="alert alert_info"><i class="ts_icon ts_icon_info_circle"></i>If you have selected column shadow styles from column options then Shadow effects will not be available.</p>
<p>Following effects are provided by ARPrice :</p>
<ul class="bottom_margin">
<li>Hover Effect</li>
<li>Shadow effect</li>
<li>Pulse</li>
<li>Shake</li>
<li>Swing</li>
<li>Hang</li>
<li>Wobble</li>
</ul>
<hr>
<h2>Column Shadow</h2>
<p>ARPrice pricing table also provides different styles of column shadows which will give columns a better look. </p>
<p class="alert alert_info"><i class="ts_icon ts_icon_info_circle"></i>If you select any column shadow style then column radius will be disabled, As well as this option will be visible only if you have not selected shadow effects from <strong>Effects</strong> option</p>
<p>ARPrice provides 5 different shadows.</p>
<hr>
<h2 class="bottom_margin">Toggle Button</h2>
<h3>Price(Number) Spin Effect On Toggle</h3>
<p>If you enabled Toggle Price then you are able to use our another feature which is animate price on switch toggle. </p>
<p>To use this feature you have to wrap your pricing number with class <code>.arp_price_amount</code> with span tag. It will animate numbers of pricing while toggle. </p>
<hr>
<h2>Column Rotation</h2>
<p>Here you are provided unique feature of column rotation which will display your columns in slider. If you enable column rotation then other options related to rotation will be enabled which are described here.</p>
<ul>
<li>
<h3>Visible Columns</h3>
<p>Here you have choice to display number of columns according to your requirements.</p>
</li>
<li>
<h3>Columns to scroll</h3>
<p>Here number of columns you have set will be slide on navigation.</p>
</li>
<li>
<h3>Transition Speed</h3>
<p>Here you are able to set speed of sliding your columns. Speed will be in millisecond.</p>
</li>
<li>
<h3>Autoplay</h3>
<p>If you check this option your columns will rotate automatically according to speed you have set. This will help if you do not want navigation button or pagination button.</p>
</li>
<li>
<h3>Sticky Caption Column</h3>
<p>This option will be available only at those templates which have caption column. Here if you caption column not to scroll when column rotation enabled then you are able to have this option.</p>
<p class="alert alert_info"><i class="ts_icon ts_icon_info_circle"></i> This will work only for desktop or tablet view.</p>
</li>
<li>
<h3>Navigation Button</h3>
<p>Here you have choice whether you want navigation on or off. If you select on here then you will have navigation buttons.</p>
</li>
<li>
<h3>Pagination Button</h3>
<p>Here you have choice of position for pagination buttons whether you want top or bottom. You are also able to set off if you do not want pagination buttons. If you select top or bottom then you will have pagination buttons according to position you have selected.</p>
</li>
<li>
<h3>Navigation Effects</h3>
<p>Here you are provided number of navigation effects which will be applied on scrolling columns.</p>
</li>
</ul>
</div>
</div>
<div id="fonts">
<h1>Font Settings</h1>
<div class="card">
<p>Here you can get all font related settings for each sections.</p>
<p>For each section you have following options :</p>
<ul class="bottom_margin">
<li>Font Family [with Font Preview]</li>
<li>Font Size</li>
<li>Alignment</li>
<li>Font Style</li>
</ul>
<p class="doc_image"><a href="assets/images/ARPrice_fonts.png" rel="lightbox"><img src="assets/images/ARPrice_fonts.png" alt="ARPrice - Font Settings" title="ARPrice - Font Settings"/></a></p>
<h3>Sections :</h3>
<ul class="bottom_margin">
<li>Header Fonts</li>
<li>Pricing Fonts</li>
<li>Body Fonts</li>
<li>Footer Fonts</li>
<li>Button Fonts</li>
<li>Tooltip Fonts</li>
<li>Toggle Title Fonts</li>
<li>Toggle Tab Fonts</li>
</ul>
</div>
</div>
<div id="tooltip">
<h1>Tooltip Settings</h1>
<div class="card">
<p>ARPrice allows to set tooltip on each row for that purpose ARPrice also provides another tooltip styling options which you can find here.</p>
<p class="doc_image"><a href="assets/images/ARPrice_Tooltip.png" rel="lightbox"><img src="assets/images/ARPrice_Tooltip.png" alt="ARPrice - Tooltip Settings" title="ARPrice - Tooltip Settings"/></a></p>
<p>Let's see each options provided here:</p>
<h3>Colors</h3>
<p>Select Tooltip <strong>Background</strong> color and Tooltip <strong>Text</strong> color here.</p>
<hr>
<h3>Display Style</h3>
<p>ARPrice provides three types of tooltip which are following,</p>
<ul class="bottom_margin">
<li>Normal</li>
<li>Alert</li>
<li>Glass</li>
</ul>
<hr>
<h3 class="bottom_margin">Show Info Icon</h3>
<p>By default tooltip displayed on hover at full row but ARPrice provides another way to display tooltip only on hover or click on information icon.</p>
<h4>Tooltip Icon</h4>
<p>You are also able to change icon to be displayed for tooltip.</p>
<h4>Icon Position</h4>
<p>Another option for Tooltip icon is position. Display icon either <strong>Right Align</strong> or <strong>Float to Content</strong></p>
<hr>
<h3>Animation Effect</h3>
<p>There are different animation effects for tooltip to display which are,</p>
<ul class="bottom_margin">
<li>grow</li>
<li>fade</li>
<li>swing</li>
<li>slide</li>
<li>fall</li>
</ul>
<hr>
<h3>Tooltip Width</h3>
<p>Set tooltip width in pixels to display, width (0) zero value indicate auto width.</p>
<hr>
<h3>Show On</h3>
<p>You have choice here to either display tooltip on <strong>click</strong> or on <strong>hover</strong>.</p>
<hr>
<h3>Tooltip Position</h3>
<p>Select position for tooltip to display. You can display left, right, top, or bottom.</p>
</div>
</div>
<div id="custom_css">
<h1>Custom CSS</h1>
<div class="card">
<p>To Customize Template as per your requirement, you can set css for any class from here. If you want to add your css to pricing table or overwrite any default css then you can do that from here in simple way. </p>
<p>Just pick up any class of pricing table where you want do changes and put it in <strong>Custom Css</strong> block and save pricing table.</p>
<p class="doc_image"><a href="assets/images/ARPrice_custom_css.png" rel="lightbox"><img src="assets/images/ARPrice_custom_css.png" alt="ARPrice - Custom CSS" title="ARPrice - Custom CSS"/></a></p>
<p>If you will make custom css on, you will get an <strong>extra button</strong> on each columns on which you will get all <strong>css class information</strong> for that particular column which will include Column Level Classes, Header Level Classes, Price Level Classes, Body Level Classes, Feature Level Classes, Footer Classes, Button Classes, Ribbon Classes.</p>
<p>Copy class according to your requirements and add into custom css textarea where you will be able to add properties for that class. You will also able to add multiple classes.</p>
<p>There you will be able to have button for <strong>Apply To Editor</strong> which will apply your css at editor instantly.</p>
<div class="example bottom_margin">
<h5>Custom CSS</h5>
<pre><code>
.arp_price_wrapper
{
color : #990000;
font-size : 15px;
}</code></pre>
</div>
</div>
</div>
<div id="toggle_price">
<h1>Toggle Price Options</h1>
<div class="card">
<p>ARPrice pricing table plugin provides a very unique customizable toggle price facility having various options.</p>
<h2>Enable Toggle Price</h2>
<p>You will have switch for enabling toggle price. When toggle price is enabled you will be able to change content or other options for toggles.</p>
<p class="doc_image"><a href="assets/images/ARPrice_toggle_price.png" rel="lightbox"><img src="assets/images/ARPrice_toggle_price.png" alt="ARPrice - Toggle Price" title="ARPrice - Toggle Price"/></a></p>
<hr>
<h2>Copy First Tab Data To Other Tabs</h2>
<p>ARPrice provides facility to copy content of first tab to other tabs. Check this option to get duplicate content in other tabs.</p>
<hr>
<h2>Toggle Button Style</h2>
<p>ARPrice pricing table plugin provides two types of style to display toggles.</p>
<ul class="large_bottom_margin bottom_margin">
<li>Select <code>Switch Style</code> if you want your toggle switches looking as stylist buttons.</li>
<li>Select <code>Radio Style</code> if you want your toggle switches looking as radio buttons.</li>
</ul>
<hr>
<h2>Title</h2>
<p>This is optional to display title for toggles. If you no need to display any title you can keep this blank.</p>
<hr>
<h2>Title Position</h2>
<p>You will have choice of left, right or top to display your toggle pricing text.</p>
<hr>
<h2>Toggle Steps</h2>
<p><code>Toggle Steps</code> is provided to give you a choice of whether you want <strong>2 steps</strong> or <strong>3 steps</strong> tabs. According to steps you will have selected you will be able to change label for tabs. If you select 2 step then 2 labels will be allowed to change or if you select 3 step then 3 labels will be allowed to change.</p>
<hr>
<h2>Tabs Label</h2>
<p>Enter label for individual toggle here, you are also able to add <code>Font Awesome Icons</code>, <code>Material Design Icons</code>, <code>Typicons</code>, <code>Ionicons</code> at Tabs Label.</p>
<hr>
<h2>Colors</h2>
<p>Here you have <strong>color options</strong> to set font colors and background colors for Active tab and Inactive tab. If you select Radio Style toggle button then you will have another option for Main Belt Background color.</p>
</div>
</div>
<div id="color_scheme">
<h1>Color Options</h1>
<div class="card">
<p>In following picture you can see that on top right corner there is facility to change color of your pricing table as per your requirement. Just click your favorite color and it will be applied to your pricing table <b>Right away</b>.</p>
<p>ARPrice pricing table provides different colors for each different templates according to template design. </p>
<p>Your selected color will be highlighted by small round on color as you are able to see in following picture. ARPrice pricing table plugin provides <strong>Custom Color</strong> option where you will have <strong>Unlimited colors</strong> choice. Your template will look beautiful with any color you have selected. </p>
<p class="doc_image"><a href="assets/images/ARPrice_color_option.png" rel="lightbox"><img src="assets/images/ARPrice_color_option.png" alt="ARPrice - Column Color Option" title="ARPrice - Column Color Option"/></a></p>
<p>ARPrice also provides custom color scheme which is described in next section.</p>
</div>
</div>
<div id="custom_color_scheme">
<h1>Custom Color Options</h1>
<div class="card">
<p>ARPrice provides <strong>Custom Color</strong> option where you will have <strong>Unlimited Colors.</strong> </p>
<p>As you can see in picture, you are allowed to change colors and hover colors for each section. On change color for particular section, will apply to related section instantly at editor.</p>
<p>For each section there are two color options which are <strong>Background Color</strong> and <strong>Text Color</strong>. Same options are available for <strong>hover colors.</strong></p>
<p>There are list of all sections for which you may want to change colors.</p>
<ul class="large_bottom_margin bottom_margin">
<li>Header</li>
<li>Pricing</li>
<li>Footer</li>
<li>Button</li>
<li>Odd Rows</li>
<li>Even Rows</li>
</ul>
<p class="doc_image"><a href="assets/images/ARPrice_custom_color_option.png" rel="lightbox"><img src="assets/images/ARPrice_custom_color_option.png" alt="ARPrice - Custom Color Option" title="ARPrice - Custom Color Option"/></a></p>
</div>
</div>
<div id="column_settings">
<h1>Column Settings</h1>
<div class="card">
<p>ARPrice provides effective functionality to manage individual columns in an easy way. There are lots of functionality as described below:</p>
<h2>Drag and Drop Column (Rearrange Column)</h2>
<p>You are able to rearrange columns by just simply drag and drop according to your need.</p>
<p class="doc_image"><a href="assets/images/ARPrice_drag_drop_column.png" rel="lightbox"><img src="assets/images/ARPrice_drag_drop_column.png" alt="ARPrice - Drag and Drop Column" title="ARPrice - Drag and Drop Column"/></a></p>
<hr>
<h2>Add New Column</h2>
<p>ARPrice allows you to add <strong>Unlimited columns</strong>, so please add columns easily by just click on <strong>Add New Column.</strong></p>
<p>This will add column with same settings of last column.</p>
<hr>
<h2>Column Settings</h2>
<p>Click on any column to be customized and get first option for column settings where you can see number of options to customize your column which are following,</p>
<p class="doc_image"><a href="assets/images/ARPrice_Column_general_option.png" rel="lightbox"><img src="assets/images/ARPrice_Column_general_option.png" alt="ARPrice - Column General Options" title="ARPrice - Column General Options"/></a></p>
<p>You can navigate to next column or previous column for same option by click on arrows given below at options box.</p>
<h3>Background Image</h3>
<p>You may required to set image as background to give better look to your column then please click here at right side which will open a box where you can select image.</p>
<p>There are another options available for whether you want to scale your uploaded image and set position to fit in column or do not want to scale image.</p>
<h3>Highlight Column</h3>
<p>Please check this option if you required to highlight particular column. Highlighted column will have set hover effect at front which you can also see in preview.</p>
<h3>Add Ribbon</h3>
<p>You can add ribbon to package column from here. ARPrice pricing table provides plenty of options for ribbon. Ribbons are totally based on CSS. No images used. You can set ribbon text, ribbon background color, ribbon text color, it's position and much more.</p>
<p>ARPrice also provides <strong>Custom Ribbon</strong> option where you are able to set <strong>Image</strong> as ribbon according to you requirements.</p>
<p>If you wish to use custom ribbon then please select custom ribbon option from Ribbon Style. You will have <strong>Custom Ribbon</strong> option visible where you can to add image file. You will have another option visible <strong>Custom Position</strong> to set position from Left or Right and from Top.</p>
<p>If you enabled toggle price then there will be options to add custom ribbon or ribbon text for default ribbons for each toggle steps.</p>
<p>You are also able to remove ribbon later by just click on <strong>Remove Ribbon</strong>.</p>
<p class="doc_image"><a href="assets/images/ARPrice_ribbon_settings.png" rel="lightbox"><img src="assets/images/ARPrice_ribbon_settings.png" alt="ARPrice - Ribbon Options" title="ARPrice - Ribbon Options"/></a></p>
<h3>Post Variables</h3>
<p>As you can see in above picture ARPrice provides facility to <strong>Post Variables.</strong> You have textarea where you are able to add your variables and it's value. You are allowed to add multiple variables with separated by semicolon.</p>
<p>If you enabled toggle price then there you are able to set variables for each toggle steps.</p>
<div class="example bottom_margin">
<h5>For Example</h5>
<pre><code><strong>Post Variables</strong>
plan_id=1;type=arprice;</code></pre></div>
<hr>
<h2>Background and Font Color</h2>
<p>At second option you are able to set color schemes for particular column.</p>
<p>Here you have two tabs for <strong>Normal</strong> colors and <strong>Hover</strong> colors. Now you are able to select colors for given section of column which are,</p>
<ul class="bottom_margin">
<li>Header</li>
<li>Pricing</li>
<li>Footer</li>
<li>Button</li>
<li>Odd rows</li>
<li>Even rows</li>
</ul>
<p class="doc_image"><a href="assets/images/ARPrice_background_font_color.png" rel="lightbox"><img src="assets/images/ARPrice_background_font_color.png" alt="ARPrice - Background and Font Color" title="ARPrice - Background and Font Color"/></a></p>
<p>For each section you have two color options for <strong>Background</strong> and <strong>Text Color</strong>.</p>
<p>You can navigate to next column or previous column for same option by click on arrows given below at options box.</p>
<hr>
<h2>Duplicate Column</h2>
<p>You may need to add column with same settings of particular column then you have another best facility to duplicate column. For that please click on duplicate option, it will add clone of particular column.</p>
<hr>
<h2>Delete Column</h2>
<p>At last you have option to delete any particular, as you can see in image on click delete column you have to confirm whether you want to delete column surely.</p>
<p class="doc_image"><a href="assets/images/ARPrice_add_duplicate_delete_column.png" rel="lightbox"><img src="assets/images/ARPrice_add_duplicate_delete_column.png" alt="ARPrice - Add, Duplicate and Delete Column" title="ARPrice - Add, Duplicate and Delete Column"/></a></p>
</div>
</div>
<div id="header_settings">
<h1>Header Settings</h1>
<div class="card">
<h2>Header Settings</h2>
<p>Double click on header of particular column to customize header section, you will get header settings option where you can change header text, Add media or add icons from lots of provided different icons.</p>
<p class="doc_image"><a href="assets/images/ARPrice_header_settings.png" rel="lightbox"><img src="assets/images/ARPrice_header_settings.png" alt="ARPrice - Header Settings" title="ARPrice - Header Settings"/></a></p>
<p>ARPrice provides lots of icons which belongs to following,</p>
<ul class="bottom_margin">
<li>Font Awesome Icons</li>
<li>Material Design Icons</li>
<li>Typicons</li>
<li>Ionicons</li>
</ul>
<p>If you enabled toggle price then there you are able to customize header content for each toggle steps.</p>
<hr>
<h2>Media Settings</h2>
<p>ARPRice provides some media supporting templates where you will have <strong>Shortcode</strong> section where you are able to change image or any icon or any other supporting media. There you will also have facility to open media in <code>Lightbox</code>, another options for <code>Autoplay</code> for videos, <code>Loop</code> for audio and so many others. </p>
<p>You can also customize shortcode section from available options like styling and size.</p>
<p>You can navigate to next column or previous column for same option by click on arrows given below at options box.</p>
</div>
</div>
<div id="price_settings">
<h1>Price Settings</h1>
<div class="card">
<p>Please double click on price section to customize.</p>
<p>Here you can change price text, add icons from provided by arprice. </p>
<p class="doc_image"><a href="assets/images/ARPrice_price_settings.png" rel="lightbox"><img src="assets/images/ARPrice_price_settings.png" alt="ARPrice - Price Settings" title="ARPrice - Price Settings"/></a></p>
<p>To animate your pricing value on toggle then ARPrice allows you to use <strong>.arp_price_amount</strong> class for price animation.</p>
<p class="alert alert_info"><i class="ts_icon ts_icon_info_circle"></i>It will work only with numbers.</p>
<p>If you enabled toggle price then there you are able to customize price content for each toggle steps.</p>
<p>You can navigate to next column or previous column for same option by click on arrows given below at options box.</p>
</div>
</div>
<div id="body_settings">
<h1>Body Settings</h1>
<div class="card">
<p>Now to customize rows please double click on body section.</p>
<p>Here you are able to <strong>Add New Row</strong> and rearrange rows by just <code>drag and drop</code>.</p>
<p class="doc_image"><a href="assets/images/ARPrice_drag_drop_row.png" rel="lightbox"><img src="assets/images/ARPrice_drag_drop_row.png" alt="ARPrice - Drag and Drop Row" title="ARPrice - Drag and Drop Row"/></a></p>
<hr>
<h2>Row Settings</h2>
<p>Now to customize particular row double click on row you will get five options which are described below:</p>
<h3>Description Settings</h3>
<p>Here you have description and custom css options available for particular row.</p>
<p class="doc_image"><a href="assets/images/ARPrice_row_settings.png" rel="lightbox"><img src="assets/images/ARPrice_row_settings.png" alt="ARPrice - Row Settings" title="ARPrice - Row Settings"/></a></p>
<p>If you enabled toggle price then there you are able to customize rows for each toggle steps.</p>
<h4>Description</h4>
<p>You are able change the content of particular row from here. Also you can add Image or Font Awesome Icons, Material Design Icons, Typicons, Ionicons.</p>
<h4>Custom CSS</h4>
<p>You have facility to customize particular row with custom css. For better example you can add css by click on examples given bottom of the option.</p>
<p>You can navigate to top row or bottom row and next column or previous column for same option by click on arrows given below at options box.</p>
<h3>Tooltip Settings</h3>
<p>ARPrice allows you to set tooltip with various styles and effects. So here you can add tooltip content.</p>
<p class="doc_image"><a href="assets/images/ARPrice_row_tooltip_settings.png" rel="lightbox"><img src="assets/images/ARPrice_row_tooltip_settings.png" alt="ARPrice - Tooltip Settings" title="ARPrice - Tooltip Settings"/></a></p>
<p>You can also add Font Awesome Icons, Material Design Icons, Typicons, Ionicons at tooltip content.</p>
<p>If you enabled toggle price then there you are able to set tooltip for each toggle steps.</p>
<p>You can navigate to top row or bottom row and next column or previous column for same option by click on arrows given below at options box.</p>
<h3>Add New Row </h3>
<p>ARPrice also allows you to add new row from any selected row by just one click. Select any row and click on<strong> Add New Row</strong> icon. </p>
<h3>Duplicate Row </h3>
<p>ARPrice also allows you to duplicate column as well as row. Yes! here you have to select Row and click on <strong>Duplicate</strong> icon.</p>
<h3>Delete Row </h3>
<p>From here you can delete particular row, just simply select the row and click on <strong>Delete</strong> icon.</p>
<p class="doc_image"><a href="assets/images/ARPrice_add-duplicate-delete-row.png" rel="lightbox"><img src="assets/images/ARPrice_add-duplicate-delete-row.png" alt="ARPrice - Add, Duplicate and Delete Row" title="ARPrice - Add, Duplicate and Delete Row"/></a></p>
</div>
</div>
<div id="button_settings">
<h1>Footer/Button Settings</h1>
<div class="card">
<p>Here you are able to set footer content and button settings of particular package.To select footer, "Double Click" on footer. You can set text to display on button, text styling, set action performed after clicking on button. You can set image on button and also Font Awesome Icons, Material Design Icons, Typicons, Ionicons. So from here you can customize footer content and button in simple way according to your needs.</p>
<h2>Footer General Settings</h2>
<p>You are able to add footer content and icons from here.</p>
<p class="doc_image"><a href="assets/images/ARPrice_footer_settings.png" rel="lightbox"><img src="assets/images/ARPrice_footer_settings.png" alt="ARPrice - Footer Settings" title="ARPrice - Footer Settings"/></a></p>
<h3>Footer Content</h3>
<p>Add content for footer for each toggle steps if toggle price enabled.</p>
<h3>Content Position</h3>
<p>Select position here to be displayed footer content at following positions:</p>
<ul class="bottom_margin">
<li>Below Button</li>
<li>Above Button</li>
</ul>
<p>You can navigate to next column or previous column for same option by click on arrows given below at options box.</p>
<hr>
<h2>Button General Settings</h2>
<p>Here you can customize button and its content.</p>
<p class="doc_image"><a href="assets/images/ARPrice_button_settings.png" rel="lightbox"><img src="assets/images/ARPrice_button_settings.png" alt="ARPrice - Button Settings" title="ARPrice - Button Settings"/></a></p>
<h3>Button Content</h3>
<p>Change button content from here for each toggle steps if toggle price enabled. Also you can add Font Awesome Icons, Material Design Icons, Typicons, Ionicons.</p>
<h3>Button Width</h3>
<p>As you can see in picture, you are also able to change button width from slider given here. Here you can set minimum width 80px and maximum height 200px.</p>
<h3>Button Height</h3>
<p>Also you can change button height from slider given here. Here you can set minimum height 30px and maximum height 60px.</p>
<p>You can navigate to next column or previous column for same option by click on arrows given below at options box.</p>
<hr>
<h2>Button Image Settings</h2>
<p>Here you are also able to set image as button background. Please select image from here.</p>
<p class="doc_image"><a href="assets/images/ARPrice_button_image_settings.png" rel="lightbox"><img src="assets/images/ARPrice_button_image_settings.png" alt="ARPrice - Button Image Settings" title="ARPrice - Button Image Settings"/></a></p>
<p>You can navigate to next column or previous column for same option by click on arrows given below at options box.</p>
<hr>
<h2>Button Link Settings</h2>
<p>You can add custom button script like "PayPal" or other shortcodes to perform various action on button click.</p>
<p class="doc_image"><a href="assets/images/ARPrice_button_script_settings.png" rel="lightbox"><img src="assets/images/ARPrice_button_script_settings.png" alt="ARPrice - Button Script Settings" title="ARPrice - Button Script Settings"/></a></p>
<h3>Button Link </h3>
<p>ARPrice allows you to manage redirection on button click and also you will be able to set whether link open in current window or in new window. </p>
<h3>Button Script ( Third Party Shortcode / Script Integration )</h3>
<p>ARPrice also facilitates you to add any script, shortcode of any plugin or any third party script to pricing table button.</p>
<p> ARPrice Supports <code>wooCommerce</code>, <code>s2Member</code>, <code>ARForms</code>, <code>PayPal Forms</code> , any script or shortcode which will return any button, link, form, etc. It also allows you to display button which is return by your shortcode OR you can hide pricing table's default button.</p>
<p><strong>For example,</strong> If You want to use shortcode of s2Member subscription button, Just pick your s2Member button shortcode and add it to button script, After clicking on this button at front view, it will redirect to checkout page of s2Member.</p>
<h3>Hide Default Button </h3>
<p>ARPrice also provides facility to display button which will return by your shortcode. For that you have to hide default button of pricing table. whenever you have set hide default button, it will display button returned by your shortcode. </p>
<h3>Open in new tab or New window</h3>
<p>Please check whether you want to open link in new tab or new window.</p>
</div>
</div>
<div id="paypal_integration">
<h1>PayPal Integration</h1>
<div class="card">
<p>ARPrice also supports paypal. Add "<code>Buy Now</code>" button code to button script and accept payment through PayPal.</p>
<p class="doc_image"><a href="assets/images/ARPrice_paypal_supports.png" rel="lightbox"><img src="assets/images/ARPrice_paypal_supports.png" alt="ARPrice - PayPal Integration" title="ARPrice - PayPal Integration"/></a></p>
</div>
</div>
<div id="woocommerce_integration">
<h1>WooCommerce Integration</h1>
<div class="card">
<p>You can add wooCommerce "<code>Add To Cart</code>" shortcode to button script. If you want to display wooCommerce button instead of pricing table default button then just select 'Hide Default Button' and save. it will display Button return by wooCommerece shortcode.</p>
<p class="doc_image"><a href="assets/images/ARPrice_wooCommerce_Supports.png" rel="lightbox"><img src="assets/images/ARPrice_wooCommerce_Supports.png" alt="ARPrice - WooCommerce Integration" title="ARPrice - WooCommerce Integration"/></a></p>
</div>
</div>
<div id="arforms_integration">
<h1>ARForms Integration</h1>
<div class="card">
<p>You can add shortcode of ARForms Popup in button script to open form in popup. you can add any beautiful form of ARForms to open in popup.</p>
<p class="doc_image"><a href="assets/images/ARPrice_ARForms_Supports.png" rel="lightbox"><img src="assets/images/ARPrice_ARForms_Supports.png" alt="ARPrice - ARForms Integration" title="ARPrice - ARForms Integration"/></a></p>
</div>
</div>
<div id="template_preview">
<h1>Pricing Table Preview</h1>
<div class="card">
<p>ARPrice pricing table provides real time preview of pricing table. It also provides facility to view template in responsive layout. After making necessary changes, you will able to view your template preview either of 3 ways:</p>
<ul class="large_bottom_margin bottom_margin">
<li>As you have seen at Template Selection section you will able to preview original provided template from list of templates</li>
<li>Also you can preview your saved template from list of templates you have saved.</li>
<li>At template editor you will have given a<strong> Preview Button </strong>which will provide you instant preview. There is no need to save your changes before looking at Preview.</li>
</ul>
<p class="doc_image"><a href="assets/images/ARPrice_preview.png" rel="lightbox"><img src="assets/images/ARPrice_preview.png" alt="ARPrice - Desktop Preview" title="ARPrice - Desktop Preview"/></a></p>
<p>You will able to look your template at 3 views given below:</p>
<h4>Desktop View</h4>
<p> You can preview desktop view by clicking on "Desktop" icon. </p>
<h4>Tablet View</h4>
<p> You can preview table view by clicking on "Tablet" icon. </p>
<h4>Mobile View</h4>
<p> You can preview mobile view by clicking on "Mobile" icon. </p>
</div>
</div>
<div id="publish_pricing_table">
<h1>Publish Your Pricing Table</h1>
<div class="card">
<p>ARPrice facilitates you to display pricing table into your page or post by just shortcode. You just need to place shortcode retrieved from ARPrice plugin, where you want to display pricing table.</p>
<p class="doc_image"><a href="assets/images/ARPrice_shortcode.png" rel="lightbox"><img src="assets/images/ARPrice_shortcode.png" alt="ARPrice - Shortcode" title="ARPrice - Shortcode"/></a></p>
</div>
</div>
<div id="import_export_templates">
<h1>Import/Export Templates</h1>
<div class="card">
<p>ARPrice pricing table provides you to export your templates as well as to import previously exported templates.</p>
<h2> Export Templates</h2>
<p>Here you will have list of all default templates as well as your clone templates. You will be able to select multiple templates and export them. You will get text file after exporting templates which will be used to import them again.</p>
<p class="doc_image"><a href="assets/images/ARPrice_export_templates.png" rel="lightbox"><img src="assets/images/ARPrice_export_templates.png" alt="ARPrice - Export Templates" title="ARPrice - Export Templates"/></a></p>
<hr>
<h2>Import Templates</h2>
<p>Here you will be able to import your previously exported templates from ARPrice. </p>
<p class="doc_image"><a href="assets/images/ARPrice_import_templates.png" rel="lightbox"><img src="assets/images/ARPrice_import_templates.png" alt="ARPrice - Import Templates" title="ARPrice - Import Templates"/></a></p>
<p class="alert alert_info"><i class="ts_icon ts_icon_info_circle"></i> You can import only text file exported previously from this plugin only.</p>
</div>
</div>
<div id="global_settings">
<h1>Global Settings</h1>
<div class="card">
<p>If you wish to set css class or width at responsive view globally which apply to all your templates then ARPrice pricing table provides you global settings option.</p>
<h2>Global Custom Css</h2>
<p>Here you will be able to add global css class according to your requirements which will be applied to all your templates globally.</p>
<p class="doc_image"><a href="assets/images/ARPrice_global_custom_css.png" rel="lightbox"><img src="assets/images/ARPrice_global_custom_css.png" alt="ARPrice - Global Custom Css" title="ARPrice - Global Custom Css"/></a></p>
<hr>
<h2>Responsive Settings</h2>
<p>Here you will be able to set maximum width of templates globally at mobile view, tablet view as well as desktop view.</p>
<p class="doc_image"><a href="assets/images/ARPrice_global_responsive_settings.png" rel="lightbox"><img src="assets/images/ARPrice_global_responsive_settings.png" alt="ARPrice - Responsive Settings" title="ARPrice - Responsive Settings"/></a></p>
<hr>
<h2>Add Character Sets</h2>
<p>ARPrice pricing table plugin provides facility to add <code>character sets</code> with <code>google fonts</code> according to your requirements. Here you will have number of options to choose the character sets you want to add with google fonts. </p>
<p class="doc_image"><a href="assets/images/ARPrice_global_character_set.png" rel="lightbox"><img src="assets/images/ARPrice_global_character_set.png" alt="ARPrice - Add Character Set" title="ARPrice - Add Character Set"/></a></p>
<hr>
<h2>Track button click of pricing table</h2>
<p>This option provides facility to enable or disable analytics of clicked columns.</p>
<p class="doc_image"><a href="assets/images/ARPrice_global_analytics.png" rel="lightbox"><img src="assets/images/ARPrice_global_analytics.png" alt="ARPrice - Enable Analytics" title="ARPrice - Enable Analytics"/></a></p>
<hr/>
<h2>Load JS & CSS in all pages</h2>
<p>You may face some css issues with your theme, ARPrice allows you to load css and js files at all pages where even arprice shortcode not exist.</p>
<p>If you required to enable this facility please check <strong>Load JS and CSS</strong></p>
<p class="doc_image"><a href="assets/images/ARPrice_global_load_js_css.png" rel="lightbox"><img src="assets/images/ARPrice_global_load_js_css.png" alt="ARPrice - Load JS-CSS" title="ARPrice - Load JS-CSS"/></a></p>
</div>
</div>
<div id="sources_credits">
<h1>Sources & Credits</h1>
<div class="card">
<ol class="large_bottom_margin">
<li><a href="https://fortawesome.github.io/Font-Awesome/icons/" target="_blank">Font Awesome Icons</a></li>
<li><a href="https://www.google.com/design/icons/" target="_blank">Material Design Icons</a></li>
<li><a href="http://www.typicons.com/" target="_blank">Typicons</a></li>
<li><a href="http://ionicons.com/" target="_blank">Ionicons</a></li>
<li><a href="https://maps.google.co.in/" target="_blank">Google Map</a></li>
<li><a href="https://www.youtube.com/" target="_blank">Youtube Video API</a></li>
<li><a href="https://vimeo.com/" target="_blank">Vimeo Video API</a></li>
<li><a href="https://www.screenr.com/" target="_blank">Screenr Video API</a></li>
<li><a href="https://www.dailymotion.com/" target="_blank">Dailymotion Video API</a></li>
<li><a href="https://www.metacafe.com/" target="_blank">Metacafe Video API</a></li>
<li><a href="https://soundcloud.com/" target="_blank">Soundcloud Audio API</a></li>
<li><a href="https://www.mixcloud.com/" target="_blank">Mixcloud Audio API</a></li>
<li><a href="https://www.beatport.com/" target="_blank">Beatport Audio API</a></li>
<li><a href="https://bootstraptour.com/" target="_blank">Bootstrapo Tour Guide</a></li>
<li><a href="http://tipso.object505.com/" target="_blank">Tipso</a></li>
</ol>
</div>
</div>
<div id="changelog">
<h1>Changelog</h1>
<div class="card">
<h2>Version 2.5.4 (21 October, 2016)</h2>
<ul class="bottom_margin">
<li>Added Option in general settings to enable/disable Analytics of clicked column.</li>
<li>Improved Arprice loading performance.</li>
<li>Minor CSS Fixes.</li>
<li>Other bug fixes.</li>
</ul>
<h2>Version 2.5.3 (24 August, 2016)</h2>
<ul class="bottom_margin">
<li>Improved Arprice loading performance.</li>
<li>Resolved popup block issue.</li>
<li>Minor CSS Fixes.</li>
<li>Other bug fixes.</li>
</ul>
<h2>Version 2.5.2 (18 July, 2016)</h2>
<ul class="bottom_margin">
<li>Improved CSS for some templates.</li>
<li>Improved template output in mobile view.</li>
<li>Minor CSS Fixes.</li>
<li>Other bug fixes.</li>
</ul>
<h2>Version 2.5.1 (07 June, 2016)</h2>
<ul class="bottom_margin">
<li>Added Tooltip on slider for button size.</li>
<li>Minor CSS Fixes.</li>
<li>Other bug fixes.</li>
</ul>
<h2>Version 2.5 (28 May, 2015)</h2>
<ul class="bottom_margin">
<li>Added two brand new templates for team / member showcase.</li>
<li>Added Facility to set favourite color on color picker.</li>
<li>Added facility to change button borders.</li>
<li>Added facility to disable column/button hover effects.</li>
<li>Added facility to change column borders.</li>
<li>Added facility to set default toggle tab.</li>
<li>Added facility to change images/videos toggle tab wise.</li>
<li>Added facility to change tooltips toggle tab wise.</li>
<li>Added facility to change footer content toggle tab wise.</li>
<li>Added facility to change row borders.</li>
<li>Added navigation facility to easily navigate between rows and columns.</li>
<li>Added facility to change alignement of header text, pricing text, column description text.</li>
<li>Added facility to change background colors of normal state and hover state for every column sections.</li>
<li>Added facility to change font colors of normal state and hover state for every column sections.</li>
<li>Moved all the font settings to new tab "Fonts"</li>
<li>Added cornerstone support.</li>
<li>Added facility to hide / show column particular section.</li>
<li>Added facility to set background image on every column.</li>
<li>Added facility to set number animation on pricing digits in toggle tab.</li>
<li>Added facility to change height and width of buttons.</li>
<li>Added facility to change shapes to place images.</li>
<li>Added facility to change different button styles.</li>
<li>Improved ribbons</li>
<li>Improved column shadow</li>
<li>Improved plugin loading speed in backend and frontend</li>
<li>Other bug fixes.</li>
</ul>
<h2>Version 2.1.1 (30 December, 2015)</h2>
<ul class="bottom_margin">
<li>Added Facility to copy first tab data to other tabs for toggle switch.</li>
<li>Improved Column Shadow.</li>
<li>Improved Toggle Switch.</li>
<li>Improved Ribbons.</li>
<li>Improved CSS Class Information section to add custom css on pricing tables.</li>
<li>Minor CSS Fixes.</li>
<li>Other bug fixes.</li>
</ul>
<h2>Version 2.1 (30 November, 2015)</h2>
<ul class="bottom_margin">
<li>Improved Ribbons.</li>
<li>Minor bug fixes and css changes.</li>
</ul>
<h2>Version 2.0 (18 November, 2015)</h2>
<ul class="bottom_margin">
<li>Added Toggle Switch Support.</li>
<li>Added New unique templates.</li>
<li>Brand New Admin design.</li>
<li>Added Custom color facility to add unlimited colors to templates.</li>
<li>Added New Material Font Icons Support.</li>
<li>Unique Analytics (Statistics) for all tables for table visits and clicks. </li>
<li>Added Typicons Font Icons Support.</li>
<li>Added Ionicons Font Icons Support.</li>
<li>Included New Font Awesome Icons.</li>
<li>Added Facility to open videos in lightbox.</li>
<li>Added Facility to upload custom image on ribbon.</li>
<li>Added Facility to make entire column clickable.</li>
<li>Added new tooltip options.</li>
<li>Added new column hover effects.</li>
<li>Added new column shadow effects.</li>
<li>Added facility to hide footer.</li>
<li>Added Latin Extended Support for Google Fonts.</li>
<li>Added Facility to apply border radius on columns.</li>
<li>Added new color schemes to existing templates.</li>
<li>Other minor bug fixes and css changes.</li>
</ul>
<h2>Version 1.1 (25 February, 2015)</h2>
<ul class="bottom_margin">
<li>Added Woo-Commerce Support.</li>
<li>Added ARForms Support.</li>
<li>Added S2member Support.</li>
<li>Added Facility to hide default button of pricing table while adding custom script.</li>
<li>Added CSS Class information for advanced users.</li>
<li>Improved Ribbons Quality.</li>
<li>Included New Font Awesome Icons.</li>
<li>Other minor bug fixes and css changes.</li>
</ul>
<h2>Version 1.0.1 (17 January, 2015)</h2>
<ul class="bottom_margin">
<li>Added VISUAL COMPOSER Support.</li>
<li>Small bug fixes and text changes.</li>
</ul>
<hr>
<p> If you require any assistance with using this plugin or would like personal customization, you can email me at <a href="mailto:info@reputeinfosystems.com">info@reputeinfosystems.com</a> Or from the <a target="_blank" href="http://codecanyon.net/user/reputeinfosystems">profile on CodeCanyon.</a></p>
<p>Please follow us on,</p>
<ul style="list-style: none;">
<li><i class="ts_icon ts_icon_facebook clear_blue small_right_margin"></i><a title="RepunteInfosystems Facebook" href="http://facebook.com/reputeinfosystems/" target="_blank">Facebook</a></li>
<li><i class="ts_icon ts_icon_twitter clear_blue small_right_margin"></i><a title="RepunteInfosystems Twitter" href="https://twitter.com/reputeinfosys" target="_blank">Twitter</a></li>
</ul>
<hr>
<p><strong>Thanks,</strong><br />
<strong>ReputeInfosystems</strong></p>
</div>
</div>
</div>
</div>
<div id="overlay"></div>
<a href="#" class="back-to-top"><i class="ts_icon ts_icon_arrow_large_up clear_white float_left small_right_margin"></i></a>
<script language="javascript" src="js/lightbox.min.js"></script>
</div>
</body>
</html>