1 Reply Latest reply on May 8, 2015 1:22 AM by jaevinguerra

    Inserting Adobe Edge files into my html page

    sh6ixs Level 1

      Hello all


      I have a pressing problem of inserting a series of animations I created in Adobe Edge into my portfolio website.

      I have 6 files to insert, which are a sequence of short animations.


      When I publish each adobe edge file, I understand you need to insert the Adobe Edge Runtime code into the head section and the Edge Class code into the body section.


      What I'm not clear about is where I should save html, edge.js and edgeActions.js files. Should these be saved in the main folder where the index.html file is saved??

      And where should all the images be saved??

      If I attempt to move these files into sub folders, which appear to make sense to me, the animation does not work.

      What I'm confused about is you also need to save an 'edge.5.0.1.min.js' and an 'jquery-2.0.3.min.js'  file into my javascript folder. But each time I publish an edge file, I need to save these files with the same name. And I'm not sure where these files should be saved.


      Hope I'm making sense here. I am new to web development and I'm hoping I can display these animations on my portfolio website.


      Has anyone encountered such issues when attempting to insert adobe edge files into an html page??





        • 1. Re: Inserting Adobe Edge files into my html page
          jaevinguerra Level 1

          When you publish your edge animate project, go to the "published" folder and extract all the files from the following folder entitled "web", and place them (just as they are) in the folder where your index.html file is. Once you add the Adobe Edge Animate runtime code to your index.html file the animation should load. Keep in mind the edge file Is already linked to the image and js files in the exact form which they appear after opening up the "web" folder. Thus any moving of the files without regard to the others will break the link. For example: You can't put the .js file into another folder post-publishing because the html file for your project is linked to the .js file exactly where it was when the publishing was done. Thus it will keep looking for that file in that location unless specified otherwise.

          An example of how you could organize your files: when you open up your Web folder it should be organized something like this

          • -Images
          • -example.js
          • -exampleproject-edge.html


          Once the files are placed into the location of the index file they would be organized something like:

          • -Images
          • -example.js
          • -exampleproject-edge html (NOTE: This html file becomes irrelevant after adding the runtime code to the index file)
          • -index.html


          Once this is done, you can add your other projects similarly. You'll have to manually put all the images used for each project into a single "images'"folder.

          Hope this helps clarify things a bit!