i’m not able to use it

  • iv m

    (@ivanomartiello)


    7 years ago

    hi, very beautiful plugin ! i would like very much to use it, but i’m not able to do it. i instlled plugin and activate it. In my theme i use visual composer and i would like very much to achieve this result here in the first part of the page https://www.downloads.eleopard.in/animate-it-demo-wordpress/. You put it a transparent shape, with red image and text “Animate It! Easy CSS3 Animations for WordPress
    Animate It! is a WordPress Plugin designed and developed to provide an efficient and user friendly solution to apply beautiful CSS3 animations.” how did you do it?
    i tried to put in the content area between the shortcodes, an image (how do you get transpaent shape?), and a text, then i customize options plugin and saved, but i didn’t have that effect. so can you please explain to me step by step how did you achieve it? ?? sorry for my english i’m italian guy ?? thanks a lot!

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author eleopard

    (@eleopard)

    Dear Ivan,

    Thanks for the good words ??

    You can easily achieve the animation on https://www.downloads.eleopard.in/animate-it-demo-wordpress , and Visual composer makes it even better!

    A side note: You can see Animate It! button in the Text editor element on Visual composer, so you can use the short-codes.
    (sceen: https://adobe.ly/2HQDzIS)

    We can do this using the editor short-codes as well. Its juts that below steeps seem easier and quicker to me.

    Now, for the animation Just a few steps:

    1. Add RAW HTML Module to you Post/Page.

    2. Paste the following in it (Change the text as you wish):

    <div class="about-extension  animated flipInX delay1">
	<h3>
		<img class="animated flipInY delay2" src="https://www.downloads.eleopard.in/images/animateit-demo/animateit-icon.png" alt="" />
	</h3>
	<h3 class=" animated bounceIn delay3">
		Title here
	</h3>
	<p class=" animated bounceIn delay4">
		Description here. Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
	</p>
</div>

    3. Click on Cog Icon on the Page to add the following CSS:
    (Screenshot: https://demo.az-themes.com/alice/documentation/_include/img/009_vc_custom_css.png)

    .about-extension {
    background: rgba(255,255,255,0.2);
    border-radius: 0;
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 50px;
    text-align: left;
    color: #ffffff;
    max-width: 780px;
    margin: 0 auto;
}
.about-extension img{
	float: left;
    margin: -12px 20px 10px 2px;
    max-width: 112px;
    height: auto;
}
.about-extension h3{
    color: #ffffff;
}

    4. Save.

    Now, I have additionally added a dark background image and padding to the row using the Design options in Row Settings.

    Let me know if this works for you.

    • This reply was modified 7 years ago by eleopard.
    Plugin Author eleopard

    (@eleopard)

    Oh and you can see the demo using Visual composer here:
    https://beyond-digital.wpdevcloud.com/post-for-ivan/

    This is test website of ours using Visual Composer.

    Thread Starter iv m

    (@ivanomartiello)

    thank you very much for your support ad great work, i will test it soon, but i have an important question….i will use your plugin if i can be able to animate , only if is it possible when a user is in the view area of text or image animated. so when i select “scroll” it doesn’t work for me, i changed percentage also, but it works only when the page load…so what the meaning of scroll function? thank you!

    • This reply was modified 7 years ago by iv m.
    Plugin Author eleopard

    (@eleopard)

    Dear Ivan,

    I am sorry but I am not able to understand.
    Can you send me a link to your page, and explain the issue again?

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘i’m not able to use it’ is closed to new replies.