Display widget outside sidebar?

Please Try with bellow inside functions.php

function wpsites_register_widget() {
 register_sidebar( array(
'name' => 'Bottom Widget',
'id' => 'bottom-widget',
'before_widget' => '<div>',
'after_widget' => '</div>',
) );

Copy the code and pastest as you want to show the widgets

if (is_active_sidebar( 'bottom-widget' ) ) :
dynamic_sidebar( 'bottom-widget' ); 
endif;

This is how you add a widget from your functions file.

Note: Only displays on mobiles.

//functions.php
function wpsites_register_widget() {

 register_sidebar( array(
'name' => 'Bottom Widget',
'id' => 'bottom-widget',
'before_widget' => '<div>',
'after_widget' => '</div>',
) );
}

add_action( 'widgets_init', 'wpsites_register_widget' );

add_filter( 'loop_end', 'bottom_widget', 25 );

function bottom_widget() {

if ( wp_is_mobile() && is_active_sidebar( 'bottom-widget' ) ) { 
dynamic_sidebar('bottom-widget', array(
'before' => '<div class="bottom-widget">',
'after' => '</div>',
) );
     }

}

You can change the loop_start hook to loop_end or use any other WordPress or theme specific hook.

You can also add the widget in a template file like single.php

<?php if ( wp_is_mobile() && is_active_sidebar( 'bottom-widget' ) ) : ?>
<ul id="bottom-widget">
<?php dynamic_sidebar( 'bottom-widget' ); ?>
</ul>
<?php endif; ?>

Uses wp_is_mobile() to check if browser being used on a mobile device.

You should use CSS Media Queries to style your widget for display on different sized mobile devices.

According to the codex, the first argument should be a valid widget class name and not the theme name.

<?php the_widget( 'Replace_With_Valid_Widget_Class_Name', 'widget-id=text-20' ); ?>