How to create a clickable static call us button that links to a new setting in general

I recently had an admin setting created on my website that allows me to input a contact number to display on the front end via a shortcode.

Now I am now trying to use this field to also create a clickable and static call button for mobile devices only that appears on the bottom of their screens.

There are plugins like WP Call Button that achieve this, but I am trying to keep my website as light as possible. Any help would be much appreciated!

I think I may need another 2 admin fields created that act as a text label as well as the hyperlink function? e.g. tel:035555555?

enter image description here

Here’s the code that was created (thanks again Walter) for my general settings:

/**  * Class for adding a new field to the options-general.php page  */ class Add_Settings_Field {      /**      * Class constructor      */     public function __construct() {         add_action( 'admin_init' , array( $  this , 'register_fields' ) );     }      /**      * Add new fields to wp-admin/options-general.php page      */     public function register_fields() {         register_setting( 'general', 'phone_number_custom', 'esc_attr' );         add_settings_field(             'custom_phone_number',             '<label for="custom_phone_number">' . __( 'Phone Number' , 'phone_number_custom' ) . '</label>',             array( $  this, 'fields_html' ),             'general'         );     }      /**      * HTML for extra settings      */     public function fields_html() {         $  value = get_option( 'phone_number_custom', '' );         echo '<input type="text" id="custom_phone_number" name="phone_number_custom" value="' . esc_attr( $  value ) . '" />';     }  } new Add_Settings_Field(); 

How to create shortcodes that pull custom field data from general settings