Display featured image above title using simplehooks

Community Forums Forums Design Tips and Tricks Display featured image above title using simplehooks

This topic is: resolved

This topic contains 7 replies, has 2 voices, and was last updated by  angewi 2 years, 7 months ago.

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
  • #29895


    My first time posting here so hello everyone and thank you for all the hints and tips that have been so very helpful.

    My lack of experience/knowledge with php/simple hooks has me stuck, so I would be very grateful for a nudge in the right direction…my gut feel is that I may need to be in the child theme templates rather than simple hooks.

    There are two “business divisions” and each has their own logo and set of pages, so the aim is to show the relevant logo at the top of each page’s title/content.

    I thought it could be achieved by uploading the logos as featured images on each of the pages, (making sure I’d set a thumbnail size in the media library), and using if code in simple hooks in “genesis_before_post_title”.

    I can get straight text in there, and even an image when I hard code the image url by using the if(is_page() ) condition, (you can see this on the site) but when I try to add in the genesis_get_image and the array codes I get nothing returned.

    I’m using a dummy site as a safe place to test when building a new site, it’s using the Corporate theme and Genesis Simple Hooks. The dummy site URL is http://www.webexit.co.uk/angepp

    The code I am using in simple hooks

    if (is_page() {
    genesis_get_image( array(
    ‘format’ => ‘html’,
    ‘size’ => ‘thumbnail’,
    ‘num’ => 0,
    ‘attr’ => array( ‘class’ => ‘alignright’ )
    ) ); }

    Thank you in advance for any pointers in the right direction and if I’ve missed out any info or not explained anything clearly enough please let me know!



    Better using a custom function.

    Paste this PHP code at the end of your child theme functions.php file.

    Change the genesis hook and conditional tag if needed.

    Hard to clearly understand what you need. Is it 2 images in different pages? Please link to the 2 pages.

    Exactly which hook location do you want to display the images?

    You can also use CSS code to display different header images using the page i.d from the source code:

    PHP code is more powerful and flexible.



    Ah brilliant, thank you Braddalton.


    The site header banner will stay the same, so I am looking to use the “genesis_before_post_title” hook to have the image displayed.

    An example can be seen on this page – http://www.webexit.co.uk/angepp/division-a/. I need to right align the image, but it sits in the right location – just above the page title)

    So for the page Division B and all their child pages, I’ll use the featured image with division A’s logo

    For the page Division B and all their child pages, I’ll show division B’s logo


    Does this explain things more clearly?



    Another way to do this is to install this plugin http://wordpress.org/extend/plugins/wp-display-header/



    You can align the image when you insert it into a new post before you copy the images HTML code and also use the advanced image settings or add CSS declarations to the class.



    Hi Braddalton, yes I’m happy when adding images in posts. For these pages we’d wanted to get the logo for each division shown above the page content and page title, but not be the header as the company logo will be shown then.

    The hook location I was focusing on was “genesis_before_post_title”.



    An  update, sorry it took so long!

    Thanks to Braddalton for getting me a big step ahead. I used the code suggested with a slight change to only show the image on specific pages.

    function wpsites_image_before_title() {
    if(is_page( array( 8, 10, 18 ) ))
        echo ‘
    <div class="header-banner"><img alt="" src="image url alt=" /></div>
    add_action(‘genesis_before_post_title’, ‘wpsites_image_before_title’);

    My next steps is to right align the image and get this to include an “or” so it shows a different image on the second division’s pages.



    Got it completed and it’s working nicely.

    1. Made two new page templates, one for each division.
    2. Made two functions,  just amended the one above to look at the page template and if for division A returns division A logo, the second function looks and if for division B returns B logo
    3. Used the stylesheet to float it right so it appears very nicely on the page.

    I should use an if, else if, else coding to put my two functions into one, but that’s for another day :)

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.