How to hook/add php and html before/after category title

// How to add/insert php/code and/or text/html before and after the single_category_title() tag in WordPress in archive.php/category.php

//
// BEFORE CATEGORY TITLE
//

//   *** Add Shortcode for php code before category title ***
function code_before_cat_title_custom_shortcode() {
// start php code
return 'CODE BEFORE';
// end php code
}
add_shortcode( 'code-before-cat-title', 'code_before_cat_title_custom_shortcode' );

// *** Insert the php code AND the html before the category title ***
add_filter( 'single_cat_title', 'code_before_single_cat_title' );
function code_before_single_cat_title( $text2 ) {
    $append2 = '';
    $append2 .=  do_shortcode('[code-before-cat-title]' );
    $text2 = '</h1><p style=margin-top:-30px;>' .  $append2 . '</p><p>Some text/html can be inserted after the top code here</p><h1 class="page-title"> Performance: ' .  $text2 . '</h1><p>Some text/html can be inserted after the category title here</p>';
    return $text2;
}

//
// AFTER CATEGORY TITLE
//

// *** Add Shortcode for php code after category title ***
function code_after_cat_title_custom_shortcode() {
// start php code
return 'CODE AFTER';
// end php code
}
add_shortcode( 'code-after-cat-title', 'code_after_cat_title_custom_shortcode' );

// *** Insert the php code AND the html after the category title ***
add_filter( 'single_cat_title', 'before_after_code_single_cat_title' );
function before_after_code_single_cat_title( $text ) {
    $append = '';
    $append .=  do_shortcode('[code-after-cat-title]' );
    $text = $text . '</h1><p>Some text/html can be inserted before the bottom code here</p>' .  $append . '<p>Some text/html can be inserted after the bottom code here</p>';
    return $text;
}