1. You need to install Child Theme for Listivo

2. Open functions.php via some code editor (I use VS Code) and paste this code:

add_filter('tdf/widgets', function ($widgets) {
    class CustomButtonSingleModelWidget extends \Tangibledesign\Framework\Widgets\Helpers\BaseModelSingleWidget
    {

        public function getKey(): string
        {
            return 'custom_single_button';
        }

        public function getName(): string
        {
            return 'Custom Single Button';
        }


        protected function render(): void
        {
            parent::render();

            $listing = $this->getModel();
            if (!$listing) {
                return;
            }

            $field = tdf_fields()->find(function ($field) {
                return $field->getId() === 8244;
            });

            if (!$field instanceof \Tangibledesign\Framework\Models\Field\TextField) {
                return;
            }

            $value = $field->getValue($listing);
            if (empty($value)) {
                return;
            }
            ?>
            <a href="<?php echo esc_attr($value); ?>">
                <?php echo esc_attr($value); ?>
            </a>
            <?php
        }
    }

    $widgets[] = CustomButtonSingleModelWidget::class;

    return $widgets;
});
PHP


3. After that go to Wp-Admin > Listivo Panel > Custom fields and take ID for text field:




In my case it's "5728" and the next change at this line:


return $field->getId() === 8244;
PHP


It is enffdfdfdough to replace one codedf with anothefgfgdfgdr. This example shows that the phone number entered into our text field is a button that automatically opens the connection options.


5. Edit single listing template via elementor and find this widget: