3 Replies Latest reply on Feb 22, 2014 9:40 AM by hemanthR

    How to integrate Edge Animation in slideshow (not create slideshow with EA) ?

    LtAl64

      Hi,

       

      I'd like to integrate an animation I create into the theme slideshow, but can't find how :/

       

      Would greatly appreciate some help here.

       

      Cheers

        • 1. Re: How to integrate Edge Animation in slideshow (not create slideshow with EA) ?
          hemanthR Adobe Employee

          If your are creating a slide show in a html page you will need to just copy the below mentioned contents to you page  from the HMTL page exported from Animate

           

          1. The first , in the "<header> part of the page content wrapped inside the following comment tags:

          <!--Adobe Edge Runtime-->

          ...

          <!--Adobe Edge Runtime End-->

           

          Put this inside the page you are trying to add the animation to, making sure it is inside the <header></header> tags in your page.

           

          2. The second ,  inside the <body> tags of the html file exported by animate and is wrapped inside a <div></div> tag.  It will look something like this:

          <div id="Stage" class="EDGE-54038123"></div>

          Put this at the position where you want the animation to play in your page

          1 person found this helpful
          • 2. Re: How to integrate Edge Animation in slideshow (not create slideshow with EA) ?
            LtAl64 Level 1

            Thanks a lot for a reply.

             

            However, I can't find the right place to add the second so as it works. Could you please help me out ? :/

             

            Here is the code of the section-slideshow.php, where should I add it ? :

             

            <?php

            // Get Slides

            global $gpp, $post;

            $slides = $gpp['slide_show'];

            $images = explode( ',', $slides );

            ?>

            <?php

            //    Homepage Slideshow

            if ( '' <> $gpp['slide_show'] && isset($gpp['slideshow_enabled']) && $gpp['slideshow_enabled'] == 'yes' || '' <> $gpp['slide_show'] && isset( $gpp['slideshow_enabled'])  && $gpp['slideshow_enabled'] == 'yes' ) { ?>

             

            <div id="home-slider-wrap">

            <div id="home-slider">

                    <div class="flexslider home-slider">

                <ul class="slides">

                            <?php

                            foreach( $images as $id ) {

             

                                $attachment_caption = get_post_field('post_excerpt', $id);

                                $attachment_title = get_post_field('post_title', $id);

                                $attachment_button = get_post_meta( $id, '_gpp_slider_button_title', true );

                                $attachment_url = get_post_meta( $id, '_gpp_custom_url', true );

                                ?>

                                <li>

             

            <div class="slide <?php if ( empty( $attachment_title ) ) echo "slide-no-title" ?>">

            <?php echo wp_get_attachment_image( $id, "slide", 0 ); ?>

             

             

                                        <?php if ( ! empty ( $attachment_title ) || ! empty ( $attachment_caption ) ) { ?>

                                            <div class="flex-caption">

                                                <?php if ( ! empty ( $attachment_title ) ) { ?>

                                                    <h2 class="home-slide-title">

                                                        <?php echo $attachment_title; ?>

                                                    </h2>

                                                <?php } ?>

             

                                                <?php if ( ! empty ( $attachment_caption ) ) {

                                                    echo '<p class="slider-caption">' . $attachment_caption . '</p>'; } ?>

             

                                                <?php if ( ! empty ( $attachment_button ) ) { ?>

                                                    <h3 class="slide-button"><a href="<?php echo $attachment_url; ?>"><?php echo $attachment_button; ?></a></h3>

                                                <?php } ?>

                                        <?php } ?>

                                            </div>

                                    </div>

                                </li>

                            <?php } ?>

                        </ul> <!-- .slides -->

                    </div> <!-- .flexslider -->

                </div> <!-- #home-slider -->

            </div>

            <?php } ?>

            • 3. Re: How to integrate Edge Animation in slideshow (not create slideshow with EA) ?
              hemanthR Adobe Employee

              I am not very sure how  the flexslider works nor that php code in the page.But by guess is ,you could try inserting edge animate stage div  as another list <li>  item.