[194rocParticipant]

WP version: 4.2.3
THeme version X child renew 4.0.5
website: http://www.castello.it

Hello there,

is there a chance I could insert a button linked to the product shown in the slider.

What I am trying to accomplish here, if practical, is having a button aside the image shown at that time in the slider, but only if the product shown is present in the woocommerce product list.

The button should redirect the customer to the cart page containing the product shown.

It is an impossibile task for my knowledge or it is outside the scope of support ?

Could I receive a hint or just address me in the right direction in order to achieve the topic.

Thank you very much for your answer.

Best regards,

Roberto

[LelyModerator]

Hello Roberto,

Thanks for posting in.
You can use the Button shortcode in Revolution slider:theme.co/x/demo/integrity/1/shortcodes/buttons/
On Rev slide > Add Layer > Text/HTML : paste the button shortcode there.
Unfortunately, there’s no automatic way to check if the products is available on woocommerce product list to hide such button. You might want to consult a web developer for this.

Hope this helps.

[194rocParticipant]

Thanks for The replay.

I guess than that it is not possible to auto-populate the slider with the product images of woo commerce…
Thank you for your advices and patience.
Best regards
Roberto

[John EzraMember]

You’re most welcome Roberto, take care!

[194rocParticipant]

Sorry to bother you again, I tried what you suggest me, but when I Paste the shortcode in the text/html area, on a new layer, it is not recognized by revolution slider, that suggest me his own button.

http://prntscr.com/7yqpmt

What can be done to insert renew code button on it ?

Sorry cancel the last…
It doesn’t show the button on rev preview, but it works fine on the browser view.
Unfortunately the color and the size of icon (shopping cart) are not correct.

http://prntscr.com/7yqskg

How can be edited ?

Thanks for the help,

best regards,

Roberto

[Paul RModerator]

Hi Roberto,

Please add a class to your button.

eg.

[button class="my-button" type="flat" shape="rounded" size="large" href="#example" title="Disponsible"]Round Button[/button]

You can then add this under Custom > CSS in the Customizer.

body .rev_slider .my-button {
    color: red;
    border-color: red;
    background-color: blue;
    padding: 0.714em 1.286em 0.857em;
    font-size: 21px;
    border-radius: 0.225em;
}

You may change the values(red,blue,21px..) to achieve your desired look.

Hope that helps.

[194rocParticipant]

Thanks for the great help, but the icon is way too little compared with the button size.

http://prntscr.com/7yrgd9

Is there a way to set up the size of the icon ?

Thanks for the patience.

Roberto

[Paul RModerator]

Hi Roberto,

You can add this code.

body .rev_slider .my-button .x-icon:before {
    font-size: 35px;
}

Change 35px to achieve your desired size for the icon

Hope that helps.

[194rocParticipant]

Yep…!!!

it works just great…

Now I am going to put some orders in the brand-slider…

Thanks a lot.

Roberto

[ZeshanMember]

You’re welcome!

[194rocParticipant]

Hello there,

I was considering the thread closed, but then I remembered that I could insert the shortcode [add_to_cart id=”xxxx”] to the slider.

This way I got as output also the price of the image shown in the slider.

Said that, I received in the previous post of this thread the custom css to modify size font and image of the button.

Would be possible to replicate that css for the [add_to_cart id=”xxxx”] shortcode ?

http://prntscr.com/809o3u

How would it be ?

Thanks for the help, I tried several options but none of them is working ?

Best regards,

Roberto

[ChristopherModerator]

Hi there,

Please add one item in slider and provide us with URL, currently you have some products and slider doesn’t stop on mouse hover so it’s hard to inspect elements.

Thanks.

[194rocParticipant]

Sorry about that.

At the address http://www.castello.it/mimi , the first image, that now has the stop on mouse over, is a big ring that I try to inspect with this result:

http://prntscr.com/80c7fz

So similarly to the previous post I try to add this ccs but it doesn’t work.

/*modifica le caratteristiche del pulsante shortcode disponibile nello slider dei brand*/
body .rev_slider .product woocommerce add_to_cart_inline {
color: white;
border-color: black;
background-color: grey;
padding: 0.914em 1.286em 1.857em;
font-size: 21px;
border-radius: 0.225em;
}

Hopefully I gave all needed informations to solve the issue.

Thanks a lot,

Roberto

[ZeshanMember]

Hi Roberto,

That button is a native shortcode of WooCommerce plugin. It could be possible to style that for revolution slider plugin with more deep CSS customization, but this would be outside the scope of support we can offer. You may wish to consult a developer to assist you with this. You can contact our trusted partners: https://community.theme.co//custom-development/

Thanks for understanding. Take care!

[194rocParticipant]

Understood.

Thanks anyway.

To The next topic

Best regards,

Roberto

[Author]

Posts