[Austin AbellParticipant]

Hi there!

How can I add a blog header image to match this page on the blog page? I tried looking off multiple posts on adding a header page, tried lots of different things but couldn’t make it work.

This page –> https://glassjacobson2.wpengine.com/blog/
Look like this page –> https://glassjacobson2.wpengine.com/our-mission/

Thanks!
Austin

[Austin AbellParticipant]

This reply has been marked as private.

[Austin AbellParticipant]

Also, could you help me get my featured image on those blog posts? Thanks!

[FriechModerator]

Hi Austin,

Thank you for writing in! Please add the code below on your child theme’s functions.php file.

function custom_banner() { 
  if (is_home()) { 
   echo '<div class="custom-banner"><img src="IMAGE URL HERE" title="custom banner" alt="custom banner"></div>';
  } 
}
add_action('x_before_view_integrity__landmark-header','custom_banner', 9999);

Replace the IMAGE URL HERE with your actual Header Image URL.

Regarding the feature image, please remove this from your Blog page > Settings > Custom CSS

.entry-featured {display:none}

Hope it helps, Cheers!

[Austin AbellParticipant]

Great, thanks!

1. is there any way to make it full width? It has white space on my big 1920X1080 screen.
2. Can I add text over top of it?

As for the featured image.. what code would I put in to take the featured image off the individual blog post page only and not the main blog page?

Thanks,
Austin

[Austin AbellParticipant]

For example, have the featured image off here https://glassjacobson2.wpengine.com/blog/

and off here https://glassjacobson2.wpengine.com/should-plan-sponsors-offer-the-ability-to-get-a-401k-loan/

[Austin AbellParticipant]

And for the individual blog post page, I’m trying to get it to match this style.

https://glassjacobson2.wpengine.com/tax-planning-preperation/

So like a 269px height with text over top.

[RadModerator]

Hi there,

Please change your code to this

function custom_banner() { 
  if (is_home()) { 
echo '<div class="custom-banner"><h1 class="h-custom-headline h-responsive h1" style="color: rgb(255, 255, 255); font-weight: 600; font-size: 45px;"><span>OUR MISSION</span></h1></div>

<style>
.custom-banner {
background: url(https://glassjacobson2.wpengine.com/wp-content/uploads/2017/03/Looking-Glass-Blue.jpg);
    background-color: hsl(230, 100%, 30%);
    padding: 5.53% 0px;
text-align: center;
}
</style>';
  } 
}
add_action('x_before_view_integrity__landmark-header','custom_banner', 9999);

Hope this helps.

[Austin AbellParticipant]

That’s brilliant!! Thank you so much 🙂

last thing to add is a little icon above “Through The Looking Glass”, width 100px with margin of 10 at the bottom.

Like this page: https://glassjacobson2.wpengine.com/investment-advisory/

Is that possible?

[Austin AbellParticipant]

On here https://glassjacobson2.wpengine.com/blog/.

And also, is there any way to take off the featured image from the individual blog post pages?

[JadeModerator]

Hi Austin,

Would you mind pointing out specifically where the “Through the Looking Glass” section is? I tried looking for it but I can’t seem to find it.

To take off the featured image for individual blog posts, please add this code in the customizer:

.single-post .entry-featured {
    display: none;
}

Hope this helps.

[Austin AbellParticipant]

Thanks so much!!

Through the looking glass is on this page. https://glassjacobson2.wpengine.com/blog/

I would like an image above it, with width of 100px and margin bottom of 10px, like this page:
https://glassjacobson2.wpengine.com/investment-advisory/

[JadeModerator]

Hi Austin,

Please add this code:

.blog .custom-banner h1:before {
    content: url(https://glassjacobson2.wpengine.com/wp-content/uploads/2017/02/Wealth-Management-White-1.png);
    width: 100px;
    clear: both;
    display: block;
    margin: 0 auto 10px;
}

Please replace https://glassjacobson2.wpengine.com/wp-content/uploads/2017/02/Wealth-Management-White-1.png with the URL of the image you want to use and resize the actual image to 100px.

Hope this helps.

[Austin AbellParticipant]

THANK YOU SO MUCH JADE!!! I had to tweak a little bit but it’s exactly what I was trying to get. You guys are the best. Thanks!!!!!

https://glassjacobson2.wpengine.com/blog/

[Prasant RaiModerator]

Thanks for the good words. It means a lot to us. Feel free to ask us again. Have a great day! 🙂

[Author]

Posts