Docs

[dankersruud]

Hi there!

Really loving this feature of the best page builder I’ve seen so far! I would like to change the hover icon from the Creative CTA’s, just into some other text.. Is this possible?

Thanks!

[dankersruud]

Sorry, my site: http://www.hockeybank.nl

[Paul R]

Hi,

Yes it’s possible, you can add the code below in cornerstone > settings > custom css

.x-creative-cta .x-icon-play-circle:before {
    content: "test";
}

Change test with the text that you want and change x-icon-play-circle with the icon that you want to change to text.

eg. To change lightbulb icon

You can add this code

.x-creative-cta .x-icon-lightbulb-o:before {
  content: "test text";
}

You can check the name of the icon on the link below

http://theme.co/x/demo/integrity/1/shortcodes/icons/

Hope that helps.

[dankersruud]

Works great! Thanks a lot!

One more small thing, How can I get my logo in the navbar in the centre?

Thanks!

[Zeshan]

Hi there,

You can achieve that by adding following CSS under Custom > CSS in the Customizer:

.x-navbar {
    text-align: center;
}

.x-navbar .x-brand {
    float: none;   
    text-align: center;  
    display: inline-block;
}

Thanks!

[bobbyrutz]

Hi.. I’m trying to change the lightbulb to [icon type=”facebook”].. Is this possible?

I found this thread and figured I’d try here rather than start a new thread..

Thank you!

[Rupok]

Hi @bobbyrutz

Thanks for updating the thread. You can select you own icon for the Creative CTA if you need another icon – http://prntscr.com/9c0anl

Hope this makes sense.

Cheers!

[VeritasMarketing]

Hello, im trying to do this same thing only i have an image instead of an icon. i want the image to display then show the text on roll over. is this possible?

[John Ezra]

Hi there,

Thanks for writing in! It’s not possible by default. We can try to see if we can find a workaround. Would you mind providing us with your URL and also a link to the image you want to use? Thanks!

[VeritasMarketing]

This reply has been marked as private.

[Rad]

Hi there,

When you add the Creative CTA element, it should give you an option of Graphic. That’s where you can choose between icon or image. Please choose image type then set your image.

Thanks!

[VeritasMarketing]

yes i did that, when it displays it shows the text and then the graphic on the roll over. i want to reverse that functionality.

[Rue Nel]

Hello There,

You can reverse how the creative displays the text and the image. It just that you won’t have it as smooth as the original effects since it is being overridden by a custom css. Please edit your page in Cornerstone and insert the following custom css in the settings tab, Settings > Custom CSS

.x-creative-cta>span.text {
    opacity: 0;
}

.x-creative-cta>span.graphic {
    transform: translate(-50%, -50%) scale(1) !important;
    opacity: 1 !important;
}

.x-creative-cta.slide-bottom:hover>span.text {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
}

.x-creative-cta:hover>span.graphic {
    transform: translate(-50%, -50%) scale(0) !important;
    opacity: 0 !important;
}

This code may not be working perfectly on touch devices since there is no hover events on touch devices. Touch devices relies on tap and click by which is why creative cta is trigger by a Javascript and not just css.

Hope this helps.

[VeritasMarketing]

That worked great Thank you!

[Nico]

Happy to hear that.

Feel free to ask us again.

Have a great day! 🙂

[Author]

Posts