Change Rollover/Hover/Overlay – icon of product picture.

  • Hi Guys,
    when you click on the product-picture of of a product on its products page than it opens bigger in a lightbox. Thats fine, but i want to symbolize a bit more to the user what will happen, when he clicks on the picture. Thus i would like to add a tiny symbol under the picture or change the rollover/houver/overlay-symbol to a more obverse one, for example a magnifier.
    Right now the Mouse-Arrow changes to a Mouse-Hand, when you hover over the picture, but I would like a symbol to appear on the picture (plus symbol or something similar).

    Hope you guys can follow me.
    Thanks a lot!!
    Cheers, Ben

Viewing 3 replies - 1 through 3 (of 3 total)

  • @benswordpress22 yup, just write some CSS to put up the symbol you’d like. If you have font awesome (or one of the other libraries) already configured you can use their symbols. If not, you can just use an image.

    W3Schools.com has tutorials on various aspects of CSS.

    Thread Starter benswordpress22

    (@benswordpress22)

    thanks @anphira, but I more or less knew that… My problem is that I don’t know where to insert this CSS-Code. ??
    Can you help me there?

    @benswordpress22 the new WordPress 4.7 includes custom CSS in the customizer. There are a number of blog posts and also the official WordPress release notes for 4.7 on the topic.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Change Rollover/Hover/Overlay – icon of product picture.’ is closed to new replies.