-
Posts
-
Hello,
Can you please tell me, what is the easiest way to place CTA button into the slider http://imgur.com/a/drx1R
NB: and is it possible to only show it on desktop?
Thanks.
Hey pimroll,
You can simply edit your slider and add button under captions tab.
Please enable the custom css class field: http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/ then edit your slider and give it a custom CSS class and add following code to Quick CSS
@media only screen and (max-width: 990px) { .your-custom-class .avia-slideshow-button { display: none !important; }}Best regards,
YigitHello Yigit,
Understood but from where can I get the CTA button code to insert it into the slider caption section?
Thanks.
Hi,
If you are looking to design your own custom button using css there are many resources available please google “CSS button generator” the follow the steps provided by Yigit to make your own button.
If you like some button inspiration please check the link below
Best regards,
VinayHello Vinay,
I was thinking about how to add already existing CTA button code (which is in my footer at the moment) into header slider caption.
So how can I get the code for that?
Thanks!
Hey!
Enable debug mode for page elements which will allow you to copy the shortcode for page elements.
Copy the shortcode for the button and check in the slider options where you can insert the slider/image captions and add the button shortcode there.
If you still have issues please post your wordpress login details with admin role so we can check the backend settings.
Cheers!
VinayHello Vinay,
Thanks, managed to add the code into the functions php and also the code into the slider but do you know, if its possible to remove the underline from the CTA button text?
http://dreammarketing.ee/delfi-reklaam/
Thanks.
Hello Vinay,
And also how to hide the CTA button in the Mobile view since it looks very akward.
Yigit gave me this code:
@media only screen and (max-width: 990px) {
.your-custom-class .avia-slideshow-button {
display: none !important;
}}But it is still showing fo me.
Hi,
You had some errors in your Quick CSS. I fixed them and added following code to bottom
#top .avia-caption-content a { text-decoration: none; }Please review your website now
Best regards,
YigitHello Yigit,
I made an hard refresh but for me the CTA button is still visible via mobile: http://imgur.com/a/0YjH3
Hello Vinay,
Did you changed something in the code so the line disappeared now?
Is it possible to add cutom colour to the fullwith easy slider caption button colour? I would like to add my own custom colour there but I cannot find it in the Debug code below.Thanks.
Hi,
To hide the slider buttons in mobile view please add the below css
@media only screen and (max-width: 767px) { #top .avia-caption-content .avia-button-center, #top .avia-caption-content .avia-slideshow-button { display: none; }}Best regards,
VinayHello Vinay,
It seems to be working now and the CTA is hidden in the mobile view.
Is it possible to add cutom colour to the fullwith easy slider caption button colour? I would like to add my own custom colour there but I cannot find it in the Debug code below.
Hello Vinay,
I deleted the big CTA button because I need only 2 smaller buttons but for me it still shows in the mobile view.
Hi,
You can increase the height of the slider on mobile view which will create more space for the caption and buttons.
@media only screen and (max-width: 767px) { .avia-slideshow-inner, .avia-slideshow-inner img { height: 400px !important; } .avia-slideshow-inner img { min-width: 1200px !important; margin-left: -600px !important; } }Adjust the values as needed.
Best regards,
Ismael
- You must be logged in to reply to this topic.