Return to previous page

I was given this code to position hover button in the right and change its background color but its

This topic has 26 replies, 3 voices, and was last updated 2 years, 2 months ago ago by Kazi Sabit

Kazi Sabit

Participant

October 1, 2022 at 05:18

I was given this code to position hover button in the right and change its background color but its background color is not changing.

Please, contact administrator
for this information.

#335524 Copied Theme version: 8.3

25 Answers
Tony Rodriguez

Support staff

October 1, 2022 at 07:03
Hello, @Kazi Sabit,

Actually, You added a different code that’s why it is not working.

The code we shared with you is below code.
```
.et-mobile-panel .et_column:nth-child(3)>a span.et_b-icon{
width: 50px !important;
text-align: center !important;
background: red !important;
border-radius: 50px !important;
height: 50px !important;
margin-top: -30px !important;
border: solid 2px white !important;
}
.et-mobile-panel .et_column:nth-child(3)>a span.et_b-icon span.et-svg{margin-left:10px !important;}
.et-mobile-panel-wrapper .et-wrap-columns{overflow:visible !important;}
```
And we share this code with you in this topic: https://www.8theme.com/topic/how-to-make-cat-button-look-bigger-then-the-rest-and-change-background/#post-335219

But you used the code of this topic: https://www.8theme.com/topic/can-i-bring-hover3-buttons-menu-top-under-the-price-vertically-horizontally/#post-328196

So it’s a misunderstanding from your side. Please try to use the above code that I shared with you I hope your issue will be resolved.

Regards 8Themes Team.
#335539 Copied
Kazi Sabit

Participant

October 1, 2022 at 07:19

I am talking about hover menu. This code i already used in mobile menu.

Check the screenshot

Please contact administrator
for this information.

#335541 Copied
Tony Rodriguez

Support staff

October 1, 2022 at 08:25
Hello, @Kazi Sabit,

Alright, Please navigate to the Dashboard >> XSTORE >> Theme Options >> Theme Custom CSS >> Global CSS >> and then paste the below code at the bottom of the CSS box.
```
.products-grid.row-count-6 .product-view-mask2 .footer-product .button{background:red !important;}
.footer-product .et-wishlist-holder a{background:red !important;}
.view-color-white .footer-product .show-quickly{background:red !important;}
```
Then save settings and check back to your site after clearing the browser cache.

The result will appear like this: https://postimg.cc/MMKVSbt9

Note: in the above code the word “red” is the color you can change it with the color name you want to set.

Regards 8Themes Team.
#335544 Copied
Kazi Sabit

Participant

October 1, 2022 at 09:30

The hover menu is covering my picture (thumbnail) I wanted the hover menu to be right edge as much as possible so that it covers the thumbnail as less as possible like before (checkout my 1st screen shoot) It happens in the mobile view only desktop view is fine.

Please contact administrator
for this information.

#335548 Copied

Kazi Sabit

Participant

October 1, 2022 at 09:43

.footer-product {
background-color: #e1e1e1 !important;
right: 5px;
}
.product-view-mask2 .footer-product .show-quickly:before,
.product-view-mask2 .footer-product .button:before,
.product-view-mask2 .content-product .wishlist-fragment a:before, .product-view-mask2 .content-product .yith-wcwl-add-button a:before {
font-size: 14px !important;
}

This code was working fine. Just background color not changing. Can you work on this code and see why not changing color?

#335549 Copied

Tony Rodriguez

Support staff

October 1, 2022 at 09:47

Hello, @Kazi Sabit,

Please provide me the login access to your site in the below-listed format in the private content area and allow permission to debug your site which includes deactivating all the third-party plugins and on-site Customization as well so that I will check and assist you accordingly.

WP Admin URL:
WP Admin Username:
WP Admin Password:

Note: Please take the complete backup of your site first.

Regards 8Themes Team.

#335551 Copied

Kazi Sabit

Participant

October 1, 2022 at 09:51

Please contact administrator
for this information.

#335552 Copied

Kazi Sabit

Participant

October 1, 2022 at 09:52

Rose gave me that code

#335553 Copied

Tony Rodriguez

Support staff

October 1, 2022 at 10:12

Hello, @Kazi Sabit,

Thanks for the login details. I have set the hover menu to the right side with the edge as you can see in this result image: https://postimg.cc/tZnrVXjL now please check back to your site after clearing the browser cache.

This is the code I added to make the hover menu to the right side: https://postimg.cc/dZ1GT6rD

Now, regarding the color issue, the thing is the code I shared with you this once: https://postimg.cc/BPGdS8Kh is working on your site but in the code, I set the red color as you can see in the image I underline the word red you can replace the word “red” with the color you want.

Regards 8Themes Team.

#335554 Copied

Kazi Sabit

Participant

October 1, 2022 at 10:58

I looking for transparent background. I have pit the code in the mobile css. Please don’t put it in global. Only mobile change enough.

How do i set background transparent

#335558 Copied

Kazi Sabit

Participant

October 1, 2022 at 11:00

Not fully transparent. About 90% transparent of white color.

In previous code given by ROSE i could change the color just by putting color code.

#335559 Copied

Kazi Sabit

Participant

October 1, 2022 at 11:04

And can you set 1 color code for the whole hover menu insted of 3 different background color for 3 button? Just like ROSE’s code

#335560 Copied

Kazi Sabit

Participant

October 1, 2022 at 17:22

Hello brother? Any update?

#335565 Copied

Kazi Sabit

Participant

October 2, 2022 at 04:16

How do i set color to semi transparent?

#335575 Copied

Tony Rodriguez

Support staff

October 2, 2022 at 09:14

Hello, @Kazi Sabit,

1. I have set the background transparent of white color on your site as you can see in this result image: https://postimg.cc/xJJqgw7v now please check back to your site after clearing the browser cache.

This is the code I added to make the hover menu background transparent: https://postimg.cc/Lnk92t1F
You can change the background transparent as per your needs.

Note: The opacity property can take a value from 0.0 – 1.0. The lower the value, the more transparent.

2. I have set a Single color code for the whole hover menu background color for 3 buttons as you can see in this result image:https://postimg.cc/sB9bqmQv now please check back to your site after clearing the browser cache.

This is the code I added to make the hover menu background color: https://postimg.cc/s1Z42XmJ You can change the background color as per your requirement.

Further, you can read this article: https://24ways.org/2009/working-with-rgba-colour/

Regards 8Themes Team.

#335592 Copied

Kazi Sabit

Participant

October 2, 2022 at 09:41

Brother i said Background Color transparent. But when i reduce transparent value the icon color disappeared. I dont want icon button to be transparent rathe Only the background transparent.

Please contact administrator
for this information.

#335596 Copied

Kazi Sabit

Participant

October 2, 2022 at 09:53

1. Background
2. Icon color

If i change transparency, it changes transparency for both which kind of fades the icon color. I wanted to change the transparency only for the background (1).

#335597 Copied

Tony Rodriguez

Support staff

October 3, 2022 at 06:10

Hello, @Kazi Sabit,

Alright, I have just set the background color to transparent. Check this image to know about the CSS code I added in the theme option to solve your issue: https://postimg.cc/dkT3629t and here is the resulting image from my personal mobile phone: https://postimg.cc/4YdJwvfk now please check back to your site after clearing the browser cache.

Regards 8Themes Team.

#335624 Copied

Kazi Sabit

Participant

October 3, 2022 at 06:20

I jave no transparency control now? I cant increase or decrease transparency?

#335626 Copied

Kazi Sabit

Participant

October 3, 2022 at 06:21

I set transparent vulue to 1 (from 0.1) nothing chages.

#335627 Copied

Kazi Sabit

Participant

October 3, 2022 at 06:40

I tried to change transparency intensity. Now it went back to no transparent again.

Please contact administrator
for this information.

#335631 Copied

Tony Rodriguez

Support staff

October 3, 2022 at 07:37

Hello, @Kazi Sabit,

It is a request that please try to understand.

First, you want to set the transparent, and one of our agents has shared the code to make it but you said that this code makes the icon transparent too, this is how it works transparently on the main div will work all the content on the box including box background too. So you said that I just only want to make the background transparent not the icon and I made it for you and share the result of it that now the background is only set to transparent and the icons appear and work fine.

Now you came back and asked that I cannot control the transparency so what does this means you can set the color or make it transparent only controlling it will affect the icons too. So that’s why I set the background to transparent only as per your request. If you will change your requirement every time so how can I help you?

I hope it makes sense to you and you understand my point.

Regards 8Themes Team.

#335649 Copied

Kazi Sabit

Participant

October 3, 2022 at 08:01

I shared previous code given by ROSE. You could seet how simple that was. Why would I look for buttons to ne transparent? It is common sense! If the button is transparent how people would see that. I wanted the background transparent but of course I must have the control over its intensity. I didn’t change my requirement every time! You need explanation of every single word. Maybe your rookie. Its ok.

Are you clear about what I am looking for?

Background transparent (Not button)
Need have control over intensity of the transparency (of the BACKGROUND)

#335651 Copied

Rose Tyler

Support staff

October 3, 2022 at 12:33

Hello,

Check now – https://prnt.sc/-XCSeuTvEyU8 > https://prnt.sc/F2n-l6ROOYAc

Regards

#335670 Copied

Kazi Sabit

Participant

October 3, 2022 at 14:44

Perfect. Thank you ROSE. You’re just awesome.

#335684 Copied
Tagged: background, button, color, hover, position, templates, woocommerce, wordpress
Viewing 26 results - 1 through 26 (of 26 total)

The issue related to '‘I was given this code to position hover button in the right and change its background color but its’' has been successfully resolved, and the topic is now closed for further responses

I was given this code to position hover button in the right and change its background color but its

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection