Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #10563

    I’ve got a pic all ready to go, I just don’t know how to get the photo up in the header next to it’s sub menu link! also how to make the pic an active link.

    #68512

    bump

    #68513

    You can add the link html code in header.php – I’d add it directly before following code line:

    <ul class="social_bookmarks">

    If you’re familiar with php you can also “hook” into the menu function . A very basic code would be:

    function add_login_logout_link($items, $args)
    {
    if(is_user_logged_in() && $args->theme_location == 'avia1')
    {
    $newitems = '<li><a title="my link" href="http://myurl.com"><img src="my-image.jpg" alt="" /></a></li>';
    $newitems .= $items;
    }
    return $newitems;
    }
    add_filter('wp_nav_menu_items', 'add_login_logout_link', 10, 2);

    #68514

    I got the pic and link to work but how can i position it where I want in the header? right now it’s crowding the social network icons. I want it on the way left.

    http://revamp.metropolitandetail.com/

    #68515

    Hi Metropolitandetail,

    Since you already have the link there, I would suggest customizing it directly by adding the following to your custom.css or Quick CSS and then removing the image link from your header.php.

    If you ever redo the menu, you’ll need to change that menu id(the 1118) to the correct number and when you make the site live, you’ll need to change the image URL to the new location if it changes, but that is pretty simple to do.

    #menu-item-1118 {
    padding-left: 22px;
    background-image: url('http://revamp.metropolitandetail.com/wp-content/themes/corona/images/skin-minimal/cart.jpg');
    background-repeat: no-repeat;
    background-position-y: 11px;
    }

    #68516

    Hey, so when I try your code, it is no longer a hyperlink after removing is from header.php

    also your padding moves the CART text, not my cart image which I wish to be on the RIGHT of the cart text about 1 space

    http://revamp.metropolitandetail.com/

    also, for future reference, how did you determine the image was item# 1118?

    #68517

    Hey!

    adding a text indent should work better:


    #menu-item-1118 {
    padding-left: 1px;
    background-image: url('http://revamp.metropolitandetail.com/wp-content/themes/corona/images/skin-minimal/cart.jpg');
    background-repeat: no-repeat;
    background-position-y: 11px;
    text-indent: 22px;
    }

    the #menu-item-(id) can be checked when viewing the source code of the menu

    #68518

    you are a god send! I’m trying to put the cart image on the RIGHT of the cart text though. Can’t seem to get it.

    #68519

    Hi!

    try this instead

    #menu-item-1118 {
    background-image: url("http://revamp.metropolitandetail.com/wp-content/themes/corona/images/skin-minimal/cart.jpg");
    background-position: 25px 12px;
    background-repeat: no-repeat;
    padding-right: 12px;
    }

    Best regards,

    Chris

    #68520

    yes!! Thank you!!

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

The topic ‘add shopping cart pic next to cart link in header/sub menu?’ is closed to new replies.