TF Numbers: animated counting of numbers from zero to x – working with pdb

hello and good day,

i try to combinne pdb with – TF Numbers works with numbers counting. it counts numbers from zero to a certain number.

see the demo:
https://www.ads-software.com/plugins/tf-numbers-number-counter-animaton/
https://themeflection.com/docs/tf-numbers/
https://themeflection.com/plugins/wordpress/tf-numbers/index.html

i want to get an interaction of TF-Numbers with pdb: i want to fetch the values of pdb-database to get them displayed in the theme: Guess that i need the PDB-API for achieving that.

Considering the custom data, basically TF Numbers is reading the numbers from the input fields. we can modify that: with some customization work and modify the shortcode output to connect the custom data with the plugin. Well: The way of implementing it will depend on the participants-database API. we can use the data of the API.

So in the next few weeks i try to figure out how it works: i try to combinne pdb with – TF Numbers works with numbers counting.

i found some api-documents of the tf number-plugin.
now i figure out which api-specs of the pdb are needed.

see here the api-documents of the tf number-plugin.

Developer API: https://themeflection.com/docs/tf-numbers/

TF Shortcodes is easy to extend, and you have few filters on your disposal that will help you to add even more elements and options. All goes easily and can be achieved quick.

Filters; Available filters are:

add_аction( 'tf_add_option', 'function-callback', 10, 1 ); // adding option fields
add_action( 'tf_elements_reg_fields', 'function-callback', 10, 2 ); // add custom element field inside number
add_filter( 'tf_custom_styles', 'function-callback' );  // adding custom styles that will apply values from above fields
add_filter( 'tf_layouts_order',  'function-callback' ); // order the display of the numbers section
add_filter( 'tf_add_options', 'function-callback' ); // DEPRICATED , use tf_add_option action instead
add_filter( 'tf_add_element', 'function-callback' ); // DEPRICATED use tf_elements_reg_fields action

Adding Option Fields

add_аction('tf_add_option', 'function-callback', 10, 1 );

To add custom option field to TF Random Numbers, you need to follow simple markup (same as for cmb2 field):

<?php

  function tf_add_custom_ops($options)
  {
    $options->add_field( array(
            'name'  => 'Option Name',
            'id'    => '_op_id',
            'type'  => 'text'
      ) );
  }

  add_аction('tf_add_option', 'tf_add_custom_ops', 10, 1 );
?>

For more information on how to add field, read more in cmb2 metaboxes documentation. Applyng New Options

add_filter( 'tf_custom_styles', 'function-callback' );

Now, after you have added new option fields, it's time to apply them.
You will need to include arrays that will hold following values:

    selector - css class, or id of the element to which styles will be applied
    values - An array that will hold following values:
        property - CSS property that will be applied (like color, background, font-size, etc.)
        and id - Now this is the id of the field from which value will be used. This is the id of your field you previously created.

Example:

<?php

    function tf_apply_custom_ops()
    {
        $user_style =  array(
            0 => array( // array per selector, I will be using only one selector here, but you can add as many as you like
                'selector' => '.count-title',
                'values' => array( 
                    0 => array(
                      'property' => 'text-transform',
                      'id' => 'nov_id'
                    ),
                    1 => array(
                      'property' => 'text-decoration',
                      'id' => 'dec_id'
                    )
                )
             )
          );

          return $user_style; //return created array
    }

    add_filter( 'tf_custom_styles', 'tf_apply_custom_ops' );

 ?>
   

• This topic was modified 6 years, 11 months ago by apolloman.