Wordpress shortcode ouput via function - php

Question

What is the best approach for a shortcode to get its output from another function. echo works but it generate the shortcode before all content. before ending file there is a php switch that I am loading different functions in base of which style selected. This is the function:
staticMarkup($titleRendered, $contentRendered, $feedbackRendered, $roleRendered, $companyRendered, $image_urlRendered, $slider, $color);
<?php
add_shortcode('sample', 'sample_shortcode');
function sample_shortcode($atts)
{
global $tesio;
$markup = '';
// Attributes
$atts = shortcode_atts(array(
'style' => '',
'testio_id' => '',
'slider' => '',
'colors' => '',
'color' => '',
'wide' => 'no',
'bgcolor' => '',
'dpadding' => '',
'tpadding' => '',
'spadding' => '',
'instance' => 1
) , $atts);
wp_enqueue_script('testio-front-js');
wp_localize_script('testio-front-js', 'testio_var', $atts);
$testio_id = $explodeID = $style = $slider = $colors = $bgcolor = $vpadding = $color = $wide = $colorContrast = '';
$testio_id = $atts['testio_id'];
$explodeID = explode(',', $testio_id);
$style = $atts['style'];
$slider = $atts['slider'];
$colors = $atts['colors'];
$bgcolor = $atts['bgcolor'];
$dpadding = $atts['dpadding'];
$tpadding = $atts['tpadding'];
$spadding = $atts['spadding'];
$color = $atts['color'];
$wide = $atts['wide'];
$testioAmount = count(explode(',', $testio_id));
if (!empty($colors))
{
$colors = explode(',', $colors);
}
if (!empty($bgcolor))
{
$colorContrast = getContrast50($bgcolor);
}
static $uniqueID;
if ($testio_id !== '')
{
if ($testio_id == 'all')
{
$args = array(
'post_type' => 'testio_wp',
'post_status' => 'publish',
'posts_per_page' => - 1
);
}
else
if ($testioAmount > 1)
{
$args = array(
'post_type' => 'testio_wp',
'post_status' => 'publish',
'post__in' => $explodeID,
'posts_per_page' => $testioAmount,
'orderby' => 'post__in'
);
}
else
if ($testioAmount == 1)
{
$args = array(
'post_type' => 'testio_wp',
'post_status' => 'publish',
'p' => $testio_id,
'posts_per_page' => 1
);
}
$posts = get_posts($args);
$wrapperClass = 'staticWrap';
$wideClass = '';
$sliderClass = '';
$masonryContainer = '';
$masonryContainerClose = '';
$backgroundStyle = '';
$sliderMarkup = '';
$sliderCloseMarkup = '';
$wrapperClassExtra = '';
$dataAttr = 'data-padding = ' . $dpadding . ',' . $tpadding . ',' . $spadding;
switch ($style)
{
case 'static':
if ($wide == 'yes')
{
$wideClass = ' wide';
}
default:
break;
}
if ($testioAmount == 1)
{
$slider == 'no';
$sliderContainer = '';
}
$markup.= '<div class="testioWrap ' . $wrapperClass . $wrapperClassExtra . '" ' . $backgroundStyle . ' data-id="' . $wrapperClass . $uniqueID . '" ' . $dataAttr . '>';
$markup.= $sliderMarkup;
$markup.= $masonryContainer;
$x = 0;
$colorClass = '';
$postCount = '';
foreach($posts as $post)
{
$titleRendered = $post->post_title;
$contentRendered = $post->post_content;
$idRendered = $post->ID;
$feedbackRendered = get_field('testio_rate', $idRendered);
$roleRendered = get_field('testio_role', $idRendered);
$companyRendered = get_field('testio_company', $idRendered);
$image_urlRendered = get_the_post_thumbnail($idRendered, 'thumbnail');
if (!empty($colors))
{
$colorClass = $colors[$x % 5];
}
$x++;
$postCount++;
$freeMessage = '<div class="testio-notice"> Please get the pro version to unlock ' . $style . ' style Upgrade</div>';
switch ($style)
{
case "static":
staticMarkup($titleRendered, $contentRendered, $feedbackRendered, $roleRendered, $companyRendered, $image_urlRendered, $slider, $color);
default:
break;
}
}
$markup.= $masonryContainerClose;
$markup.= $sliderCloseMarkup;
$markup.= '</div>';
return $markup;
}
else
{
$markup.= '<div class="testio">';
$markup.= __('Please put an id to the shortcode', 'testio-wp');
$markup.= '</div>';
}
$uniqueID++;
}
?>
This is the codes inside the staticMarkup function:
<?php
function staticMarkup($title, $content, $feedback, $role, $company, $image_url, $slider, $color){
$markup ='';
$colorStyle = 'style="color: '.$color.';"';
if($slider == 'yes'){
$markup .= '<div>';
}
$markup .= '<div class="testio testioStatic" data-color="'.$color.'">';
$markup .= '<div class="leftBorder"></div>';
if($image_url !== '' ){
$markup .= '<div class="thumbnailWrapper">';
$markup .= $image_url;
$markup .= '</div>';
}
$markup .= feedbackMarkup($feedback);
$markup .= '<div class="testio-content">';
$markup .= '<p>'.$content.'</p>';
$markup .= '</div>';
$markup .= '<h3 class="testio-name" '.$colorStyle.'>~ ' .$title. '</h3>';
$markup .= '<h4 class="testio-role">' .$role. ' <span class="role-divider icon-at-sign"></span> ' .$company. '</h4>';
$markup .= '</div>';
if($slider == 'yes'){
$markup .= '</div>';
}
echo $markup;
}
?>

Answer 1

Within the staticMarkup function replace:
echo $markup;
with:
return $markup;
This will return the variable where it has been positioned/called as opposed to above all content.