Modifying Theme to resemble old blog

I've uploaded the "Responsive theme." Does anyone know how I can make the changes to the theme as shown in the attachment, so that I can get it to resemble my old blogger format: bikinibodymommy.blogspot.com???

    Paul Barthmaier

    Hi there and welcome to the WPMUdev Support Community!

    It looks like you found a nice theme there! It is odd that they have the social icons in the footer, but the navigation looks to be in the typical place. I'm not sure how to move the navigation. It feels right to have that above the Call to Action box. In other themes, perhaps even this one, you would have a slider here. Placing the nav below that seems odd. And keep in mind, this will only be on the homepage. Other posts or pages wouldn't have this box with the call to action or slider.

    As for moving the social icons, would be a custom edit of the header requiring you to move or copy the following from the footer and placing it in the correct spot in the header. And you'd want to do all of this in your child theme.

    <div class="grid col-380 fit">
             <?php $options = get_option('responsive_theme_options');
    
                // First let's check if any of this was set
    
                    echo '<ul class="social-icons">';
    
                    if (!empty($options['twitter_uid'])) echo '<li class="twitter-icon"><a href="' . $options['twitter_uid'] . '">'
                        .'<img src="' . get_stylesheet_directory_uri() . '/icons/twitter-icon.png" width="24" height="24" alt="Twitter">'
                        .'</a></li>';
    
                    if (!empty($options['facebook_uid'])) echo '<li class="facebook-icon"><a href="' . $options['facebook_uid'] . '">'
                        .'<img src="' . get_stylesheet_directory_uri() . '/icons/facebook-icon.png" width="24" height="24" alt="Facebook">'
                        .'</a></li>';
    
                    if (!empty($options['linkedin_uid'])) echo '<li class="linkedin-icon"><a href="' . $options['linkedin_uid'] . '">'
                        .'<img src="' . get_stylesheet_directory_uri() . '/icons/linkedin-icon.png" width="24" height="24" alt="LinkedIn">'
                        .'</a></li>';
    
                    if (!empty($options['youtube_uid'])) echo '<li class="youtube-icon"><a href="' . $options['youtube_uid'] . '">'
                        .'<img src="' . get_stylesheet_directory_uri() . '/icons/youtube-icon.png" width="24" height="24" alt="YouTube">'
                        .'</a></li>';
    
                    if (!empty($options['stumble_uid'])) echo '<li class="stumble-upon-icon"><a href="' . $options['stumble_uid'] . '">'
                        .'<img src="' . get_stylesheet_directory_uri() . '/icons/stumble-upon-icon.png" width="24" height="24" alt="StumbleUpon">'
                        .'</a></li>';
    
                    if (!empty($options['rss_uid'])) echo '<li class="rss-feed-icon"><a href="' . $options['rss_uid'] . '">'
                        .'<img src="' . get_stylesheet_directory_uri() . '/icons/rss-feed-icon.png" width="24" height="24" alt="RSS Feed">'
                        .'</a></li>';
    
                    if (!empty($options['google_plus_uid'])) echo '<li class="google-plus-icon"><a href="' . $options['google_plus_uid'] . '">'
                        .'<img src="' . get_stylesheet_directory_uri() . '/icons/googleplus-icon.png" width="24" height="24" alt="Google Plus">'
                        .'</a></li>';
    
                    if (!empty($options['instagram_uid'])) echo '<li class="instagram-icon"><a href="' . $options['instagram_uid'] . '">'
                        .'<img src="' . get_stylesheet_directory_uri() . '/icons/instagram-icon.png" width="24" height="24" alt="Instagram">'
                        .'</a></li>';
    
                    if (!empty($options['pinterest_uid'])) echo '<li class="pinterest-icon"><a href="' . $options['pinterest_uid'] . '">'
                        .'<img src="' . get_stylesheet_directory_uri() . '/icons/pinterest-icon.png" width="24" height="24" alt="Pinterest">'
                        .'</a></li>';
    
                    if (!empty($options['yelp_uid'])) echo '<li class="yelp-icon"><a href="' . $options['yelp_uid'] . '">'
                        .'<img src="' . get_stylesheet_directory_uri() . '/icons/yelp-icon.png" width="24" height="24" alt="Yelp!">'
                        .'</a></li>';
    
                    if (!empty($options['vimeo_uid'])) echo '<li class="vimeo-icon"><a href="' . $options['vimeo_uid'] . '">'
                        .'<img src="' . get_stylesheet_directory_uri() . '/icons/vimeo-icon.png" width="24" height="24" alt="Vimeo">'
                        .'</a></li>';
    
                    if (!empty($options['foursquare_uid'])) echo '<li class="foursquare-icon"><a href="' . $options['foursquare_uid'] . '">'
                        .'<img src="' . get_stylesheet_directory_uri() . '/icons/foursquare-icon.png" width="24" height="24" alt="foursquare">'
                        .'</a></li>';
    
                    echo '</ul><!-- end of .social-icons -->';
             ?>
             </div><!-- end of col-380 fit -->

    Cheers,
    Paul

    Paul Barthmaier

    For making a child theme you can consult the codex:

    http://codex.wordpress.org/Child_Themes

    Quickly, though, a child theme is minimally a folder in your site's themes folder with a style.css which has the following structure:

    /*
    Theme Name: YOUR THEME Child Theme
    Version: 1.0
    Description: A child theme for YOUR THEME.
    Author:
    Author URL: http://www.yourURL.com
    Template: parent-theme-folder-name-here
    */
    @import url("../parent-theme-folder-name-here/style.css");

    You will, of course, need to change your details in the above structure. Notice, there are 3 important bits of info:

    1. the child theme is given a name, which is what will appear in the backend when selecting a theme.
    2. The parent theme's folder is named as the Template
    3. Info from the parent theme's css is brought in using the @import

    Hope this helps!