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 CustomButtonSingleCarWidget extends \Tangibledesign\Listivo\Widgets\Helpers\BaseListingSingleWidget
    {
 
        public function getKey(): string
        {
            return 'custom_single_button';
        }
 
        public function getName(): string
        {
            return 'Custom Single Button';
        }
 
 
        protected function render(): void
        {
            parent::render();
 
            $listing = $this->getListing();
            if (!$listing) {
                return;
            }
 
            $field = lst_fields()->find(function ($field) {
                return $field->getId() === 6671;
            });
 
            if (!$field instanceof \Tangibledesign\Framework\Models\Field\TextField) {
                return;
            }
 
            $value = $field->getValue($listing);
            if (empty($value)) {
                return;
            }
            ?>
            <a
                    class="listivo-primary-button listivo-primary-button--icon listivo-primary-button--height-61"
                    href="https://anydomain.com/?vin=<?php echo esc_attr($value); ?>"
            >
                <span class="listivo-primary-button__text">
                    Button TEXT
                </span>
 
                <span class="listivo-primary-button__icon">
                    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
                         stroke="currentColor">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                              d="M9 5l7 7-7 7"/>
                    </svg>
                </span>
            </a>
            <?php
        }
    }
 
    $widgets[] = CustomButtonSingleCarWidget::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() === 6671;
PHP

4. If you want customize this button for example show the value of this file you can use this code:


  <a
                    class="listivo-primary-button listivo-primary-button--icon listivo-primary-button--height-61"
                    href="tel:<?php echo esc_attr($value); ?>"
            >
                <span class="listivo-primary-button__text">
                    Call: <?php echo esc_attr($value); ?>
                </span>
 
                <span class="listivo-primary-button__icon">
                    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
                         stroke="currentColor">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                              d="M9 5l7 7-7 7"/>
                    </svg>
                </span>
            </a>
PHP


It is enough to replace one code with another. 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:



After that put into place you want display this button: