Add an image on the Header


#1

Hi,

I have another question.

I would like to add a small image on the menu bar (or header) next to - where it says (on the Demo page): HOME, ABOUT THE TEST, LEVEL 1, LOREM IPSUM. The small image will be right justified.

How is that possible?

Thanks.


#2

Hi

You can do this by following a couple of steps.

  1. Upload the image you want to show in the media library.

  2. Add the below code and css in child theme’s functions.php and style.css file

This goes to functions.php file


function se_add_search_box_to_menu( $items, $args ) {
    if ( $args->theme_location === 'main' )
        return $items . '<img src="http:-...wp-content/uploads/2014/07/logo.jpeg" />';
 
    return $items;
}
add_filter( 'wp_nav_menu_items', 'se_add_search_box_to_menu', 10, 2 );

Get the url of the image uploaded to the media library and use it as the image source.

and the below css goes to style.css


#menu-newmenu > img {
    float: right;
}

Hope it helps!!

Thanks


#3

Matty,

Thanks for your reply.

When I go to “appearance… editor”… I only see style.css in my child’s theme. I do not see the functions.php.


#4

You need to create the functions.php and upload it via FTP. Have you done that?


#5

Matty/Charlie,

The image in the link below shows what happened. The text with the image appeared on top of the page.

Thanks.

http://manilamail.com/images/img_ask.png


#6

Hi B

It seems you are not doing it right.

first let us know if you using a child theme? if yes then like charlie has mentioned, have you added a functions.php file to the same

If this looks like a confusion, you can seek help from a developer here

Thanks


#7

Matty,

I have a child theme. I also created the functions.php. I will review the steps again to see what I missed.

Thanks.


#8

You are Welcome B :slight_smile: