Embed an adobe edge animation into CMS?

I'm looking to create a dynamic map for my organizations' website which can be clicked and open a new link from various parts. The map will either be produced with Edge Animate or maybe Muse (or both depending). Or I can strictly code the HTML?
Here's the shtick - we don't have FTP back-end access. I'd love to be able to get into the source view of the CMS and embed what I need right in that frame - is that even possible? I might be able to link outside of the CMS and place potential sub-folders elsewhere.
I am coming from a hefty design background and the extent of my coding is CSS and HTML - the easier way to do this the better.
Thank you mucho!
- S.

Hi Martin,
I take it you use DW to edit your BC site, and since you have access to the code directly there are a few steps you need to take in order to make you banner show on your site.
(Yes, no import feature that will do the following actions autmatically but if you follow the steps you should have your banner on your site in a few minutes.)
1st - When you use Edge you have the possibility to publish your site project, which is then saved under a folder you define.
2nd - Take the project folder (copy) and upload it (paste) into your site (at the root level or where you find it convenient)
3rd - Add an iframe like this: <iframe src="/path/your_project.html" width="500" height="200" frameborder="0" scrolling="no"></iframe> configuring the path to your .html file which will run the animation, the width, height, etc as you need them.
Add the iframe where you need the banner to show up, a page or template.
I hope this answers your question.
Cheers,
Cristian

Similar Messages

How to integrate Edge Animation into a Joomla-CMS page?

I tried to integrate an Edge animation into a Joomla site, but there appears just a white page...

Hi,
I guess I have two answer on two levels. The wordpress plugin (EdgeSuite) allows you to place compositions inline or use iframes, so it is not really plugin vs. iframes.
EdgeSuite brings various benefits (if you ask me):
First of all, it comes down to just uploading stuff, place it, done. No ftp upload, filehandling or whatsoever.
More over that the plugin enables sharing of core edge libraries. E.g. if you place two compositions on a page without modifying them, all the edge libraries (edge.js, jquery, yep, easings...) will be loaded twice as they sit in different directories. Same with viewing compositions on different pages, each composition loads its own set of libraries. 10 different compositions results in 10x loading of all libs. Edge Suite on the other hand alters the path for the resources and places them in one directory. Libs are only loaded once, for the whole page.
If you have a simple website cluttering your webspace at root level might be an option. If you are using a CMS and have 10 compositions that is just awful. EdgeSuite places all composition files in a clean file structure within subfolders, no cluttering.
That's just from the top of my head.
The iframe topic is a bit more difficult. Personally I think iframes are mostly bad practice. It's like in the early days of the web with table layouts and framesets. There are cases where iframes make total sense and are the best way to go and that's why EdgeSuite can also render iframes. But I personally only want to "see" an iframe when there is no other option. If you can do it inline, do it inline. Bad SEO, loading times, semantic fragmentation... security aspects, sandboxing on the other hand are just a couple of the most common arguments. Most of the arguments don't directly apply to the context of Edge Animate, but still... decide for yourself
Hope that answers your question to some degree.

How do I insert my Edge Animation into Wordpress as an animated/interactive graphic

How do I insert my Edge Animation into Wordpress as an animated/interactive graphic?

Hi ColleenSyron,
Can you check out this video: http://tv.adobe.com/watch/create-like-crazy-with-adobe-edge/episode-5-spice-up-your-wordpr ess-site-with-edge-animate/
Thanks,
Preran

Convert/save/export Adobe Edge animation as an animated gif?

Does anyone know a way to convert/save/export an Adobe Edge animation file into an animated gif. I've created a simple logo animation and the client now wants it as a animated gif to add to there email signature. Is this possible or an I going to have to recreate it in another programme

Hi resdesign.
Thanks for your comment, this helped. Would be nice if there was a more direct way though, but this has done exactly what I need. Thanks again

Testing Adobe Edge Animation

Greetings! Has anyone been able to download and test Adobe Edge Animation? Its link takes me around the promotion page again, with no option to download it. Any guidance will be greatly appreciated!!

Thank you very much Ken for your prompt reply and guidance!
The problem is that when I go into the "Creative Cloud Apps", the icon for Edge Animate does not appear... Could this be because I have a free account? (it is announced that I can test it for free).
Thank you again for your help.
All the best,
susan

I need help making Adobe Edge animation appear correctly on iphones, ipads and android phones.

I need help making Adobe Edge animation appear correctly on iphones, ipads and android phones. It currently looks fine on desktops and androids. I am using wordpress with a responsive theme (Canvas). I will need you to document The url is http://adamhtc.org.s183459.gridserver.com.

Thanks George, interesting thought. I looked on Adobe's site and they "advertise" fillable forms for the iPhone and Android markets, but on the Windows Phone tab, that is mysteriously missing. lol Maybe it will come later? Meanwhile, I'll google to see if there are any PDF viewers that can handle it now. Thanks for the reply. :-)

Adobe edge animation not playing properly on Google Chrome

hi, just noticed this. finishing up my website http://www.thomasdrotardesign.com/work.html
i've just noticed that the edge animation plays the beginning of the animation then disappears completely except for a font here and there on Google Chrome.
it plays perfectly across all the other browsers. any idea what is going on here.
there is nothing nested. it is a straight time line. i am building it on a mac osX 10.9.4

DISCOVERY the reason adobe edge animation and google don't play well together is because if you use any sort of filter on your typography this will not appear on the chrome browser. sad but true. once i removed all the blur filters off my animations they started playing perfectly on chrome. this is too bad in that chrome is the largest used browser out there. thank you Redesign for your suggestion.

Why my adobe edge animation taking load time too much

Hi
why my adobe edge animation taking load time too much.
Plsease guide me.

Hi, Rohan-
Can you upload your file for us to take a look at? It's hard for us to tell what's going on without taking a look.
Thanks,
-Elaine

Adobe Edge Animator

hi Perform as I can purchase only Adobe Edge animator ?

[Changed the response by moderator]
Hi Gonzalo,
Unfortunately, purchasing edge animate as single app is not available now.
You will have to opt for creative cloud complete plan.
However with the complete creative cloud application you will be entitled for all CC application including online services.
Please check this one.
Software and services for creative professionals | Adobe Creative Cloud

Adobe Edge animation glitching html page and SVG disappearing

Hi all,
I am having an issue with an Adobe Edge animation that I am making for a client - I am fairly new to Edge so this may be an easy fix!
There is an SVG named chassis (Looks like a brown tadpole) that halfway through the animation - disappears and then glitches the webpage by drawing a white background that overlaps everything...
I have set the background in Edge to transparent so I don't know why this is happening, even in the 'Preview in browser' option it happens.
Here is the site where the animation is embedded - http://louisreed.co.uk/tiddlybot (Scroll down a little bit)
Any help or suggestions welcome.
Thanks!
Louis

Hi Louis ,
Can you try out one thing. We suspect this issue is caused because of the anti-scaling which we apply.
Just try to disable anti scaling.Follow the steps below :
This scale factor can be changed from:
1. Close Animate
2. Open the preference folder:
a. Windows: C:\Users\{username}\AppData\Roaming\Adobe\Edge Animate\4.0.0\
b. Mac: /Users/{username}/Library/Prefrences/Adobe/EdgeAnimate/4.0.0/
3. Open the AppPrefs.xml file in a text editor.
4. Search for the Current line in AppPrefs.xml:
<key>SvgAntiScaleFactor</key>
<float>10</float>
Update this to:
<key>SvgAntiScaleFactor</key>
<float>1</float>
5. Launch Animate.
However note: This setting will work only for new animate content that you create after this setting is applied - i.e it will work only for newly pasted SVG’s in a new composition.
Exiting Animate compositions opened after applying the setting(Step 5 above) will still show the same problem. You will need to delete the SVG and copy-paste again.
Do let us know if this solution helps in your case too.
Thanks and Regards,
Sudeshna Sarkar

Adobe edge animation shows unwanted vertical scrollbar in firefox only

anybody have any idea how to lose a vertical scrollbar on a site where i built a responsive adobe edge animation. on all the other browsers the overflow: hidden works perfectly. only in firefox do i get a scrollbar showing up. little help please. the website is http://www.drotardesign.com/dd/about.html
d

got it - this is how you get rid of it, and thank you Moses for your kind words. Corel was right, these are the attributes that fix it. You need to load it as an iframe
just so you know, the only way to get rid of the scroller in Firefox is to load the RESPONSIVE ADOBE EDGE ANIMATION as an iFrame with these attributes:
<div class="center1">
<div class="center1Edge">
<IFRAME src="http://www.drotardesign.com/dd/animations/edgeAbout/edgeTop.html" width="100%" height="100%" scrolling="no" frameborder="no"></IFRAME>
</div>
</div> 
your css will be this:
/*EDGE ANIMATION*/
.center1 {
display: block;
width: 25%;
overflow:hidden;
height:400px;
padding-bottom:0%;
.center1Edge {
width: 100%;
height: 100%;
/*left: 0px;*/
}

Integrating edge animations into Premiere to add audio

I want to add and synch an audio track to an edge animation. Is there a known workflow for getting edge animations into video (mp4) format so that I can then add audio?

Hi Jim, there is currently no built-in way to convert the html/javascript output of Edge Animate, to mp4 video.
What is your end goal? Are you trying to add audio to an Edge animation, which will live as html on the web? Or is your end goal a video piece?
If your end goal is a video piece, you could use screen capture software to record your Edge animation in-browser, then import that video to Premiere.
Depending on your use-case, it might make more sense to use a much more advanced, purpose-built animation application like After Effects as your animation tool, rather than Edge Animate.

What is Adobe Edge Animator

I am having many issues with photoshop cs6 as well as lightroom 4.2. one PS app crash report from photoshop said ( according to the lightroom forum help) 'The dynamic link library faulted in your earlier post belongs to Adobe Edge Animator'.
I have no idea what this is.. does it ship with cs6?

sorry.. I guess I am too frustrated. I have been having CS6 problems plus lightroom 4.2 problems. CS6 has been crashing while I am working. I am using a wacom intuos 3 tablet. New drivers have not been issued since august.
I am trying to document errors , and am trying to deal with this.,
computer is an i7 windows 64 bit-- 3.5GHZ- 32 gigs ram.. 7800 series ATI graphics..
someone on the lightroom forum posted that question about 'did I have the adobe edge animator' becasue they saw that listed in an error report that I posted . I think the error reports were from lightroom, but I dont see how this can be part of photoshop or lightroom for that matter. ( unless lightrooms web module has something to do with it. ( Ive never used that)
sooooo I am asking if that is part of CS6, which you answered.
I dont know how to post my snagits here.

Inclusion of an edge animation into Dreamweaver which was created outside of Dreamweaver

I have created an animated banner that I would llike to insert into a Div on an existing web page. Here is what was created:
Can some one give me an example of how to insert this animation into a web page div container? I see no examples on how to do this anywhere.
Thank you!

If you are having problems opening your files in Edge
There is script that does not belong or is incorrect...
http://pharmacure.businesscatalyst.com/Index_Desktop_Animation_1.html
Here is what your file looks like:
<!DOCTYPE html>
<html style="height:100%;">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled</title>
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<link href="/StyleSheets/ModuleStyleSheets.css" type="text/css" rel="StyleSheet" />
<script type="text/javascript">var jslang='EN';</script>
<script type="text/javascript" charset="utf-8" src="Index_Desktop_Animation_1_edgePreload.js"></script>

<style>
.edgeLoad-EDGE-311633456 { visibility:hidden; }
</style>

</head>
<body style="margin:0;padding:0;height:100%;">
<div id="Stage" class="EDGE-311633456">
</div>
</body>
</html>
There are several items in your code that were not generated by Edge.
For one your <html> tag has script in there that does not belong...

Adobe edge animation button not working in muse

Ok so I went and created a button in adobe Edge that when clicked scrolls your browser to the top of the page since I couldn't create what I was looking to do in muse( I can create anchors to bring me to the top of the page but I dont like that i have to relink the button for each page and that clicking on the button acts as a page change so when you click the back button it brings you back down to the bottom of the page vs the previouse page). Anyways the button works perfectly fine when previewing it in adobe Edge but when I bring it into Muse and try to use it the function to bring you to the top of the page stops working, the mouse states still work though so it doesn't seem to be completly broken. Any ideas as to what I'm doing wrong or what I can do to fix this?

I just tried to host it to a temp businesscatalyst site and the .oam file isn't even showing up on the temorary page. Getting more and more confused.

Embed an adobe edge animation into CMS?

Similar Messages

Maybe you are looking for