Integrating Wordpress Content into HTML site

Question

Im trying to integrate wordpress sidebars and other wp content into an html site.

1. site: http://example.com/test_new/index.html
2. page using to add blog content to: blog-modern
3. blog location of wp-blog-header.php and wp-load.php:
   public_html/test_new/blogspot

4. Code used on blog-modern.html page:

   <?php 
   define('WP_USE_THEMES', false);
   require('./blogspot/wp-blog-header.php'); 
   ?> 
   

5. Sample codes ive tried using:

     <?php
   // must use a variable for page id
   $id = 4;
   $p = get_page($id);
   echo apply_filters('the_content', $p->post_content);
   ?>
   
   <?php $sidebar = get_post_meta($post->4, "sidebar", true); 
   get_sidebar($sidebar); 
   ?>
   
   <?php
   $args = array(
   'numberposts' => 10,
   'offset' => 0,
   'category' => 0,
   'orderby' => 'post_date',
   'order' => 'DESC',
   'include' => '',
   'exclude' => '',
   'meta_key' => '',
   'meta_value' =>'',
   'post_type' => 'post',
   'post_status' => 'draft, publish, future, pending, private',
   'suppress_filters' => true
   );
   
   $recent_posts = wp_get_recent_posts( $args, ARRAY_A );
   ?>
   
   <?php if ( have_posts() ) : ?>
       <?php while ( have_posts() ) : the_post(); ?>
   
       <!--- enter blog post html here -->
   
       <?php endwhile; ?>
    <?php endif; ?>
   
   <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
   

6. What I keep getting no matter what I manipulate:

enter image description here