Cost Calculator - WordPress Plugin

Contents

1. I installed the plugin, but I don't see it in the Dashboard

2. I can’t upload plugin. It’s saying it is invalid. What went wrong?

3. I don’t have installed Visual Composer. How to edit the shortcode without it?

4. Importing Demo

5. How to translate plugin

6. I want to add custom CSS statements to style my calculator. Where should I add them?

7. How to remove the 'Next' button

8. How do I get 1.000,00 format for the total value?

9. How to update a plugin

10. How to set initial value for Text item?

11. How to set the initial value for Select item?

12. How to set initial value for Slider item?

13. How to set initial value for Switch item to True?

14. Can I redirect users to another page after submiting message?

15. How to redirect users to another page after the "Next" button?

16. How to add additional fields to contact form part of Cost Calculator?

17. Will I loose content with updating the plugin?

18. How to change the e-mail address from Wordpress?

19. How do I remove the bar with Total and leave contact form?

20. Contact form visible by default

21. How can I round up the total value and remove .00?

22. Translate Datepicker

23. How to edit clients email?

1. I installed the plugin, but I don't see it in the Dashboard

When you finish installation and activate the plugin, the Cost Calculator will appear as Visual Composer element. When you navigate to the page editor you will see the Cost Calculator suggested on element list.



If you are not using the Visual Composer as a page builder, than the best option is to install our demo pages in order to see how all Cost Calculator are set. Please refer to the following article: Importing Demo.

2. I can’t upload plugin. It’s saying it is invalid. What went wrong?

Please unpack plugin folder and upload to your wp-content/plugins using FTP. The archive contains not only plugin but also the other files. 

If you want to upload in admin panel, you need to unpack plugin folder (bt_cost_calculator) and pack it again as zip and then upload that zip.

3. I don’t have installed Visual Composer. How to edit the shortcode without it?

You can find the explanation on how to import all our demos In Cost Calculator documentation. 

You should be able to see see how to set calculator shortcodes (demos will work even without Visual Composer, you just need to remove unnecessary VC shortcodes from the content) once you import the demo.



4. Importing Demo

The best way to start is to install demo content. If you want to install demo content please do the following:

Go to ‘Tools > Import > WordPress’ and install WordPress Importer plugin if it is not already installed.


    

When it is installed, choose xml file from demo_data folder and click ‘Upload file and import’. On the following screen make sure that ‘Download and import file attachments’ is checked. Click ‘Submit’ button and wait until import is finished.

You should see imported demo pages in WordPress.

5. How to translate plugin

The procedure is standard – you can find the .pot file in the plugin’s languages folder. 

Please use PoEdit - https://poedit.net/ to translate the .pot file and create respective .po and .mo fies.

You should upload .po and .mo files created using PoEdit back to plugin's languages folder. 

Please name .po and .mo files e.g. bt_plugin-nl_NL.po and bt_plugin-nl_NL.mo (nl_NL is the language code for dutch) and place them in /wp-content/plugins/bt_cost_calculator/languages/. 

For other languages code, please refer to the following link: Internationalization.

You can set the site language of your WordPress installation on Settings > General. WordPress will automatically use the right language files if they exist. 


6. I want to add custom CSS statements to style my calculator. Where should I add them?

If you use Visual Composer you should click on Page Settings button in the upper right corner of Visual Composer's interface on relevant Page Edit Form:

The Page Settings dialog will be displayed.
Please enter Custom CSS statements in the Custom CSS settings field.



If you do not have Visual Composer, please add the statements to your main CSS file or, alternatively, use third party plugin like: https://wordpress.org/plugins/simple-custom-css/.

7. How to remove the 'Next' button

From the latest plugin update (Version 1.2.1), 'Next' button can be removed in Cost Calculator settings.

In order to hide ‘Next’ button, deselect the ‘Display Next Button and Contact Form’ field.


8. How do I get 1.000,00 format for the total value?

The best way to change the total format from e.g. 1,000.00 to 1.000,00 is to modify plugin’s code.

Please locate line 546 in bt_cost_calculator.php in plugin’s folder. It should have the following code:

total = total.toFixed( 2 ).replace( /(\d)(?=(\d{3})+\.)/g, '$1,' );

Replace the noted line with the following statements:

var n = total, c1 = 2;
var d = ",";
var t = ".", s = total < 0 ? "-" : "";
var i = parseInt(n = Math.abs(+n || 0).toFixed(c1)) + "", j = (j = i.length) > 3 ? j % 3 : 0;
 
total = s + (j ? i.substr(0, j) + t : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + t) + (c1 ? d + Math.abs(n - i).toFixed(c1).slice(2) : "");

It should change the format of your total.

In addition, if you want to allow users to enter the numbers in text fields in the format with comma as a decimal separator, please locate the following code segment:

var bt_parse_float = function( x ) {
    r = parseFloat( x );
    if ( isNaN( r ) ) r = 0;
    return r;
}

and replace it with:

var bt_parse_float = function( x ) {
    r = parseFloat( x.toString().replace( ',', '.' ) );
    if ( isNaN( r ) ) r = 0;
    return r;
}


9. How to update a plugin

If you have not customized the calculator, please download the latest version and rewrite the old files on the server with the new ones. The calculator files should be in /wp-content/plugins/bt_cost_calculator/ of your WordPress installation.

If you have customized the code, you will need to reapply the changes prior to upload of new version.

10. How to set initial value for Text item?

From the latest plugin update (Version 1.2.1) , initial value can be set in Cost Calculator Item Settings.

In order to set initial value for Text item, you need to add the starting value you want to 'Initial value' field.




11. How to set the initial value for Select item?

From the latest plugin update (Version 1.2.1) , initial value can be set in Cost Calculator Item Settings.

In order to set initial value for Select item, you need to add the index of the item you want to display as initial, in 'Initial select list index' field.

For example, if you have three items in Select field, and you want the second one to be initial, you would add number 2 to the field.



12. How to set initial value for Slider item?

From the latest plugin update (Version 1.2.1) , initial value can be set in Cost Calculator Item Settings.

In order to set initial value for Slider item, you need to add the value between min and max values, in 'Initial value' field.

For example, if you have items from 0 (zero) to 200 in your slider, and you want the initial value to be 2 items, you should add 2 to the field.



13. How to set initial value for Switch item to True?

From the latest plugin update (Version 1.2.1) , initial value can be set in Cost Calculator Item Settings.

In order to set initial value for Switch item, you need to add 'On' value to 'Initial value' field.

For example, if 'On' value is 1, you should add number 1 to the field.


14. Can I redirect users to another page after submiting message?

The latest plugin update (Version 1.2.1) contains the field for URL that you want your users to be redirected to.

In order to redirect users to another page after submitting the form, add the URL to ‘Optional URL for confirmation’ field.



15. How to redirect users to another page after the "Next" button?

Please find the following lines in bt_cost_calculator/bt_cost_calculator.php:

c.find( '.btContactNext' ).click(function() {
                    $( 'html, body' ).delay( 1000 ).animate({
                        scrollTop: ( $( this ).closest( '.btQuoteBooking' ).find( '.btTotalQuoteContactGroup' ).offset().top - 30 )
                    }, 400 );
                    
                    var contact_group = $( this ).closest( '.btQuoteBooking' ).find( '.btTotalQuoteContactGroup' );
                    
                    $( this ).closest( '.btQuoteBooking' ).find( '.btTotalQuoteContactGroup' ).addClass( 'btActive' );
                    $( this ).closest( '.btQuoteBooking' ).find( '.btQuoteBookingForm' ).removeClass( 'btActive' );
                });

and change them with:

c.find( '.btContactNext' ).click(function() {
                    window.location = 'http://www.google.com';
                });

Please edit the url according to your needs.

16. How to add additional fields to contact form part of Cost Calculator?

If you like to add additional fields to contact form part of Cost Calculator, please do the following:

1. Open bt_cost_calculator.php file in the code editor.

2. Locate the following piece of code:

$output .= '<div class="btQuoteItem' . $m_message . ' btQuoteItemFullWidth"><textarea class="btContactMessage btContactField" placeholder="' . __( 'Message', 'bt_plugin' ) . '"></textarea></div>';

and add above it the following:

$output .= '<div class="btQuoteItem"><input type="text" class="myText btContactField" placeholder="' . __( 'myText', 'bt_plugin' ) . '"></div>';

This will create the new field in the form with the placeholder text myText. Change it according to your needs (edit placeholder="' . __( 'myText', 'bt_plugin' ) statement)

3. Locate the following piece of code:

'message' : c.find( '.btContactMessage' ).val()

and add above it the following:

'mytext' : c.find( '.myText' ).val(),

it will ensure that the value of the newly created field gets propagated to backend upon form submission

4. Locate the following piece of code:

$message = $_POST['message'];

and add above it the following:

$mytext = $_POST['mytext'];

5. Locate the following piece of code:

if ( $message != '' ) $message_to_admin .= '<div style="padding:.5em;"><b>' . __( 'Message', 'bt_plugin' ) . '</b>: ' . stripslashes( $message ) . '</div>' . "\r\n";

and add above it the following:

if ( $mytext != '' ) $message_to_admin .= '<div style="padding:.5em;"><b>' . __( 'MyText', 'bt_plugin' ) . '</b>: ' . $mytext . '</div>' . "\r\n";

It will include the value of your field into the email body.

17. Will I loose content with updating the plugin?

With new plugin update you will not loose any content, but it will effect and overwritte any changes in the bt_cost_calculator.php code that you've made. The best way is to manually repeat modifications with new update.

18. How to change the e-mail address from Wordpress?

In order to change the sender name, if the visitor and admin are receiving an e-mail from "Wordpress", we suggest you to avoid code customization and to install a third party plugin which will allow this. For example this one: WP Simple Mail Sender.


19. How do I remove the bar with Total and leave contact form?

In order to remove Total bar and leave Next button please add the following css statements to the page:

.btQuoteTotal {
    display: none !important;
} .btQuoteBooking .btQuoteBookingForm.btActive .btTotalNextWrapper {
    padding-right: 0px;
} .btQuoteBooking .btContactNext {
    margin: auto;
} .btQuoteBooking .btQuoteBookingForm .boldBtn {
    float: none;
    margin: auto !important;
}

20. Contact form visible by default

If you want the form to be open by default, please add the following css statements to the page:

.btQuoteBooking .btTotalQuoteContactGroup {
    opacity: 1;
    filter: alpha(opacity=100);
    max-height: 1000px;
}

.btQuoteBooking .btQuoteBookingForm.btActive .btContactNext {
    display: none;
}

.btQuoteBooking .btQuoteBookingForm.btActive .btTotalNextWrapper {
    padding-right: 0px;
}

21. How can I round up the total value and remove .00?

The best way to change the total value from e.g. 2500.00 to 2500 is to modify plugin’s code.

Please locate line 546 in bt_cost_calculator.php in plugin’s folder. It should have the following code:

total = total.toFixed( 2 ).replace( /(\d)(?=(\d{3})+\.)/g, '$1,' );

Replace the noted line with the following statement:

total = Math.round(total);

It should round up your result to an integer without decimal points.

22. Translate Datepicker

First of all, edit bt_cost_calculator/bt_cost_calculator.php file in Plugins folder and locate the following line:

c.find( '.btContactDate' ).datepicker({

Then add the next codes above that line:

$.datepicker.regional['tr'] = {closeText: "kapat",
            prevText: "<geri",
            nextText: "ileri>",
            currentText: "bugün",
            monthNames: [ "Ocak","Şubat","Mart","Nisan","Mayıs","Haziran", "Temmuz","Ağustos","Eylül","Ekim","Kasım","Aralık" ],
            monthNamesShort: [ "Oca","Şub","Mar","Nis","May","Haz", "Tem","Ağu","Eyl","Eki","Kas","Ara" ],
            dayNames: [ "Pazar","Pazartesi","Salı","Çarşamba","Perşembe","Cuma","Cumartesi" ],
            dayNamesShort: [ "Pz","Pt","Sa","Ça","Pe","Cu","Ct" ],
            dayNamesMin: [ "Pz","Pt","Sa","Ça","Pe","Cu","Ct" ],
            weekHeader: "Hf",
            dateFormat: "dd.mm.yy",
            firstDay: 1,
            isRTL: false,
            showMonthAfterYear: false,
            yearSuffix: "" };
        $.datepicker.setDefaults( $.datepicker.regional['tr'] );

Edit required Labels according to your needs.

23. How to edit clients email?

In order to change the clients email than you should locate the bt_cost_calculator.php file and find function bt_cc_callback() in the code. The email formatting starts from the line:

$message_to_admin = ...