Forum has been created to help all our customers in properly working our theme. We offer complete help with configuration theme and make default look, just like on our Be|theme demo. We don`t offer theme customization.

Before creating a new discussion, please:
1. Check on forum if discussion hasn`t been created before. Use the forum Search on the right.
2. Read carefully the documentation included to package.
3. If you didn`t find what you need and would like to post a new question click the "Start a New Discussion" button on the right.
4. You can post on forum only after registration (you need purchase code to register) .

NOTE!!! If you are starting a new topic and have got problems with your site and you want us to check what`s wrong please always give url to your site because without that we can`t check what`s wrong. Each case may be different because of your installed plugins, servers or other things.

IMPORTANT!!! Along with your inquiry, please attach the address of the page which concerns the question. This will cause the time to answer on your question will be much shorter. If you do not want to publish your address publicly in the forum, please send a private message. Thanks!

Linked Images - Remove Rollover / Hover / Crop Effect


I love BeTheme but by default, you have an annoying design issue - whereby a linked image:
1) Crops the top and bottom of an image by approx 20px
2) Has a very intrusive and distracting hover effect of a different colour rolls up with a link icon.   

I've figured out how to remove this hover layet - but what code stops the images from being cropped. 

Unlinked they display fine.  With links they are not appearing properly and very distracting too. 

I'd really appreciate if you can tell me how I can disable this outright - so I can have ordinary linked images, maybe with a very minor fade effect (like 10%) on hover.  That would be subtle and better. . 


  • Please sign in to see answear!
  • edited May 2015

    So far I added this custom CSS:
    .image_frame .image_wrapper .mask { display: none !important; }
    .image_frame .image_wrapper .image_links { display: none !important; }
    .image_frame:hover .image_wrapper img, .image_frame.hover .image_wrapper img { top: 0px; }
    How can I remove the mask hiding the about 15px at the bottom of the linked images?

    Thank you,

  • Please sign in to see answear!
  • edited April 2015
    The images are cropped at the bottom. If you inspect the image you will see the CSS code 
    margin-bottom: -15px !important;
    if you disable this code in the inspector panel, the image is shown completely.
    Where can I change the or add CSS to show the image completey in general?
  • Please sign in to see answear!
  • edited February 2016
    Where do I put the CSS?

    I put the line in Betheme option/Custom CSS & JS. And I still have the roll over on the images.
  • You can put it in the Custom CSS section in the theme options. 
  • Please sign in to see answear!
  • I was looking for a solution for this too!
    This is perfect, thank you all!
Sign In or Register to comment.