Home Forums Weaver Xtreme Theme Extra button in menu area

Topic Resolution: Resolved

This topic contains 9 replies, has 2 voices, and was last updated by  merlojh 3 months, 1 week ago.

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

    merlojh
    Participant

    In the menu area next to the right of the CONTACT button I would like to put a button that says STORE with a colored background that takes you to that page. What is the best way to do this? John

    http://www.singingtreeproject.org

    #58328

    scrambler
    Moderator

    You could create a link button using the “Plus” Link button tool, then insert its shortcode in the menu Add Right HTML box

    #58329

    merlojh
    Participant

    Thanks I will give it a try! John

    #58391

    merlojh
    Participant

    I have got the button on the top right of menu so how do I position it so it is in line with the rest of the menu? So if I want the second button as a rollover I just make another button that looks different as the second button and link it to the page I want it to go to? John

    http://www.singingtreeproject.org

    #58392

    scrambler
    Moderator

    .wvrx-menu-right {margin-top:1.5em;}

    Your button does not link to anything right now by the way, because you probably have not defined one

    So if I want the second button as a rollover

    Do you want two button side by side, or do you want a different image for the existing button when hovering the button.

     

     

    #58393

    merlojh
    Participant

    A rollover a different image in same place (not side by side) maybe different color text etc. No have not set up a page to link it to. John

    #58394

    scrambler
    Moderator

    you should be able to create the hover effect using the rules below

    .weaver-buttons img:hover {opacity:0;}

    .weaver-buttons:hover {background-image:url(hoveriImageURL);}

     

    #58415

    merlojh
    Participant

    It seems to distort when I rollover although they are the same size. How do you get the little finger instead of the arrow? Thanks John

    #58416

    scrambler
    Moderator

    “It seems to distort when I rollover although they are the same size”

    The background is repeated, change the second rule to the one below

    .weaver-buttons:hover {background:url(hoveriImageURL) no-repeat;}

    How do you get the little finger instead of the arrow

    Your button does not link to anything, because you did not specify a URL to link to in the link button definition, so as is it is useless. As soon as you define a link, the cursor will become a hand when over it, and it will actually open the linked page when you click on it

    #58420

    merlojh
    Participant

    That works thanks for the help! John

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

You must be logged in to reply to this topic.