Feed at top of Homepage
-
Is there a way to put the instagram feed, at 100% width at the top of my homepage? I want to have it how this blog does…..https://www.barefootblonde.com/
-
This is the theme I am wanting to use it on….https://mailovedesign.com/primrose/
Hey whisktangofox,
For that theme, it looks like you’ll need to add the feed directly into the header.php template file. You would want to use the do_shortcode() php function like this:
<div>
<?php echo do_shortcode( ‘[instagram-feed]’ ); ?>
</div>
The php tags before an after the function are not necessary if you use the function inside a block of php code.
It’s possible you’ll need some additional CSS to get the feed to span the whole page. Let me know if you’d like help with that!
Thank you, I really appreciate your help and fast reply. Do you know where in the header coding I need to place this? or can it be anywhere?
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head><meta charset=”<?php bloginfo( ‘charset’ ); ?>”>
<meta http-equiv=”X-UA-Compatible” content=”IE=edge”>
<meta name=”viewport” content=”width=device-width, initial-scale=1″><title><?php bloginfo(‘name’); echo ‘ – ‘; is_front_page() ? bloginfo(‘description’) : wp_title(”); ?></title>
<link rel=”profile” href=”https://gmpg.org/xfn/11″ />
<?php if(get_theme_mod(‘md_favicon’)) : ?>
<link rel=”shortcut icon” href=”<?php echo get_theme_mod(‘md_favicon’); ?>” />
<?php endif; ?><link rel=”alternate” type=”application/rss+xml” title=”<?php bloginfo(‘name’); ?> RSS Feed” href=”<?php bloginfo(‘rss2_url’); ?>” />
<link rel=”alternate” type=”application/atom+xml” title=”<?php bloginfo(‘name’); ?> Atom Feed” href=”<?php bloginfo(‘atom_url’); ?>” />
<link rel=”pingback” href=”<?php bloginfo( ‘pingback_url’ ); ?>” /><?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<div id=”top-bar”>
<div class=”container”>
<div class=”menu-mobile”></div>
<div class=”meta_top”>
<!– Search –>
<?php if(!get_theme_mod(‘md_topbar_search_check’)) : ?><?php endif; ?>
<!– end Search –><?php if(!get_theme_mod(‘md_topbar_social_check’)) : ?>
<div id=”top-social”>
<span class=”text_follow”>Follow:</span>
<span class=”top_social_wrap”>
<?php if(get_theme_mod(‘md_facebook’)) : ?>” target=”_blank”><i class=”fa fa-facebook”></i><?php endif; ?>
<?php if(get_theme_mod(‘md_twitter’)) : ?>” target=”_blank”><i class=”fa fa-twitter”></i><?php endif; ?>
<?php if(get_theme_mod(‘md_instagram’)) : ?>” target=”_blank”><i class=”fa fa-instagram”></i><?php endif; ?>
<?php if(get_theme_mod(‘md_pinterest’)) : ?>” target=”_blank”><i class=”fa fa-pinterest”></i><?php endif; ?>
<?php if(get_theme_mod(‘md_bloglovin’)) : ?>” target=”_blank”><i class=”fa fa-heart”></i><?php endif; ?>
<?php if(get_theme_mod(‘md_google’)) : ?>” target=”_blank”><i class=”fa fa-google-plus”></i><?php endif; ?>
<?php if(get_theme_mod(‘md_tumblr’)) : ?>.tumblr.com/” target=”_blank”><i class=”fa fa-tumblr”></i><?php endif; ?>
<?php if(get_theme_mod(‘md_youtube’)) : ?>” target=”_blank”><i class=”fa fa-youtube-play”></i><?php endif; ?>
<?php if(get_theme_mod(‘md_rss’)) : ?>” target=”_blank”><i class=”fa fa-rss”></i><?php endif; ?>
</span></div>
<?php endif; ?></div> <!–end meta_top –>
<span class=”top_search_wrap”>
<div class=”show-search”>
<?php get_search_form(); ?>
</div><div id=”top-search”>
<i class=”fa fa-search”></i>
</div></span>
</div>
</div>
<header id=”header”>
<div class=”container”>
<div id=”logo” <?php if(get_theme_mod(‘md_show_only_promo_homepage’)) : ?>class=”promo_only_homepage”<?php endif; ?>>
<?php if(!get_theme_mod(‘md_logo’)) : ?>
<h1>“>/img/logo.png” alt=”<?php bloginfo( ‘name’ ); ?>” /></h1>
<?php else : ?>
<h1>“>” alt=”<?php bloginfo( ‘name’ ); ?>” /></h1>
<?php endif; ?>
</div> <!– end logo –>
<div class=”menu_wrap”>
<?php wp_nav_menu( array( ‘container’ => false, ‘theme_location’ => ‘main-menu’, ‘menu_class’ => ‘menu’ ) ); ?>
</div></div>
</header>
<?php if (!get_theme_mod(‘md_hide_carousel’)) : ?>
<?php if (get_theme_mod(‘md_slider_style’) == ‘fullwidth’) : $slider_style = ‘slider’; else : $slider_style = ‘carousel’; endif;?>
<?php if (get_theme_mod(‘md_show_only_carousel_homepage’)) : ?>
<?php if (is_home()) : get_template_part( $slider_style ); endif; ?>
<?php else: ?>
<?php get_template_part( $slider_style ); ?>
<?php endif; ?>
<?php endif; ?>
I think the best spot would be between <header … and <div class=”container” … For example:
</span> </div> </div> <header id=”header”> <?php echo do_shortcode( ‘[instagram-feed]’ ); ?> <div class=”container”> <div id=”logo” <?php if(get_theme_mod(‘md_show_only_promo_homepage’)) : ?>class=”promo_only_homepage”<?php endif; ?>> <?php if(!get_theme_mod(‘md_logo’)) : ?>
That should work for you! I believe it will span the whole page then but let me know if you need help getting it to do so.
Quick edit here: I’m thinking you would not want to copy and paste from the example I gave in this post since the single quote has been replaced by curly quotes. Make sure you are using the single quotes right by the enter key on the keyboard.
- This reply was modified 7 years, 8 months ago by Craig at Smash Balloon.
Ahhh! You are amazing. It worked perfectly. Thank you so so much!
- The topic ‘Feed at top of Homepage’ is closed to new replies.