Fireworks CS5 buttons don't export into Dreamweaver S5 correctly

I'm very new to fireworks, I've created a design layout in Fireworks CS5 which I've sliced up but when I export the design to Dreamweaver CS5 HTML, the buttons which I've created in Fireworks lose their functionality apart form seeing them as a link,. On the Dreamweaver side I insert Fireworks HTML into a div tag. Its probaly something very simple (hopefully) that I'm missing, any help?

Any pointers?? Please advise. Thanks.
Yes. Don't allow Fireworks or any graphics editor to create HTML for you. Use Graphics apps for Images ONLY. Save images to your DW Local Site folder. Use DW to build your HTML code, rollovers and menus.
Insert > Spry > Spry Menu.
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

Similar Messages

NEED HELP. Created Website Template in Photoshop CS5, but cant center it into Dreamweaver CS6

I created a website layout template in Photoshop cs5 once i opened it into Dreamweaver i was trying to Align it to Center but it would not go center still stays to the left. I know that something is not right i am missing something and i am new to this not much experience with Dreamweaver, can someone please tell me how to fix this issue in a way a beginner would understand, i greatly appreciate the help.

Did you export HTML from PShop? Graphics apps generated code is not suitable for real web pages. It's really only acceptable for quick comps to show the client before you undertake the real work of building the layout in DW with HTML & CSS code.
To center pages, you need 3 basic things.
A valid doc type declaration on the first line of your code.
A stated width in px, % or ems.
A margin-left and margin-right of auto.
Copy & paste this code into a new, blank document in DW. Save and preview in browsers.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>HTML5, centered 1-col layout</title>
<style>
body {
    margin:0;
    padding:0;
    background: #696;
    font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
    font-size: 100%;
#wrapper {
    width:90%;
    margin:0 auto; /**with width, this is centered on screen**/
    padding:1%;
    background: #FFF;
</style>
</head>
<body>
<div id="wrapper">
<h3>Heading 3</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vitae libero lacus, vel hendrerit nisi! Maecenas quis velit nisl, volutpat viverra felis. Vestibulum luctus mauris sed sem dapibus luctus. Pellentesque aliquet aliquet ligula, et sagittis justo auctor varius. Quisque varius scelerisque nunc eget rhoncus. Aenean tristique enim ut ante dignissim. </p>
<h3>Heading 3</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vitae libero lacus, vel hendrerit nisi! Maecenas quis velit nisl, volutpat viverra felis. Vestibulum luctus mauris sed sem dapibus luctus. Pellentesque aliquet aliquet ligula, et sagittis justo auctor varius. Quisque varius scelerisque nunc eget rhoncus. Aenean tristique enim ut ante dignissim. </p>
</div>
</body>
</html>
Nancy O.

Having problems getting my fireworks made button to work in Adobe Dreamweaver CS6

Hello, I am currently using a trial version of Adobe CS6 Fireworks and Dreamweaver and I am wondering why my button that I have created with an up, an over and a down state is not working in dreamweaver properly...when I preview my button in Fireworks all is in order and it works fine but when I click copy Fireworks Html of the button, when I paste it into dreamweaver and preview it, dreamweaver doesen't seem to show the over or down states...any help would be much appreciated.

When you created animated buttons in Fireworks and exported/imported them into Dreamweaver CS3, CS5 all worked well.
This is because CS3 and CS5 automatically added the required preload JavaScript to the hed tag of the document.
In CS6, this is not happening!
That is the major reason that your buttons do not work if you are used to doing it the way that we have for years.
As a test, I added the Head tag code that the old versions of CS generated in Dreamweaver and immediately my buttons worked.
It must be a program error in CS6 and I wonder if Adobe will be producing a fix for this?
The Head code is below:
<script type="text/javascript">

</script>

Help exporting into Dreamweaver

I created a header and a left navigation menu using
Fireworks. I want to import the images into Dreamweaver in order to
make them into a template for my site. Can you anyone get me
pointed in the right direction on how to go about doing so? Thanks
in advance for any help.

Map all styles to tags and then use the export to HTML command.
Bob

Exporting into Dreamweaver

Hello Everyone,
I have to start by saying, "I'm not an InDesign user, I'm the Dreamweaver user".
I'm part of a High School Education Foundation and we are working on designing and distributing a newletter via. Our newsletter designer uses InDesign and I use Dreamweaver/Joomla to publish our website.
Question - will InDesign "export" a file into the HTML or other format that can be uploaded to a web server? If yes, is the formating of the newsletter maintained in the exported HTML file?
If yes, can someone please direct me to a tutorial on how to configure the export to Dreamweaver (HTML) wizard?
Thanks for your help and have a great day,
Todd

Map all styles to tags and then use the export to HTML command.
Bob

Attaching links to buttons exported into dreamweaver CS3 ?

Hi everyone,
I want to create five seperate buttons in Fireworks CS3 and then export them over to Dreamweaver CS3.
Does the links for the buttons have to be attached in Fireworks first, or can I create the buttons export them into my Dreamweaver site and then attach the links?
The reason I'm asking is because the links in question are external links for five other sites and social network sites, and I do not have the URL's yet. However I would like to get started.
Thanks in advance.

I want to create five seperate buttons in Fireworks CS3 and then export them over to Dreamweaver CS3.
Does the links for the buttons have to be attached in Fireworks first, or can I create the buttons export them into my Dreamweaver site and then attach the links?
You are best to create the buttons in Fireworks, export them to an images folder in Dreamweaver, then attach the links that way.
Before you begin work, ensure that you define a site and have all your working files inside of one folder to which the site definition points to,
(Just mentioning this very important step in case you are new to using Dreamweaver :-)
Define a site:
http://kb2.adobe.com/cps/140/tn_14028.html
Do not ever export any html written by a graphics program :-)

Embed Adobe Bridge CS5.5 web image gallery into Dreamweaver site

Please help! I have been reading forums and trying to find the answers to my problem for days! I have created an image gallery in adobe bridge cs5.5 and have used an iframe to embed the gallery into my dreamweaver site. When I preview my site the gallery works, but after I've uploaded the gallery to the server the gallery no longer works. I have read multiple adobe forums with no success. Please help! Thanks!

I'm not sure I completely understand your problem, because linking to a Lightroom gallery is actually very simple.
Design your Lightroom gallery and upload it to your server. Just do it directly from LR. Let's suppose you have uploaded it into [your webroot folder]/galleries/test/.
Don't rename any of the index files.
Check it has actually worked, by visiting http://celestialapple.zxq.net/galleries/test/index.html with your browser.
Create a link to the gallery on your home page. The source code for the link is <a href="/galleries/test/index.html">Other Photoshop gallery</a>
And that's it already.
Cheers,
Michael

How to export a lightroom web gallery into dreamweaver

I would like to know how to integrate a slideshow 'gallery flash lightroom" into a dreamweaver CC page which already exists
I'm not an IT person. So if you have a simple way...
I don't find any bottom "export into dreamweaver" in Lightroom...
So if someone can tell me how to proceed.
Thanks per advance.
Florence

Thanks for your answer.
Yes. I can open the web gallery page into dreamweaver : I have nammed this page metaphoris.html
But I don't want to use this page as a page in my web site.
I would like to integrate the content (just the slideshow) into the body of an existing page
nammed Artgallery.html
If you know
- which part of the code I have to copy and paste into my page (if it's the right thing to do?)
- and if I have to relocate some files r(essources? images?)
Thanks per advance ;-)
Florence

CS5 Issue with PDF exporting to Illustrator?

Hi all,
I'm having issues exporting PNG files to PDF files from Fireworks CS5. When I export, they're suddenly saving and needed to being opened in Illustrator - which I don't want them to do or have the AI file extension. Is there a setting I can change? I need a "traditional" PDF so I can send to a client who does not have Illustrator.
This issue just started today, and I'm not sure where the source of the change is.
Thanks and I look forward to hearing from you!
Regards,
Darryl

I very much appreciate your help. As you recommended, I tried the conversion without OCR (useful post is here http://forums.adobe.com/docs/DOC-3062) but again with result "the conversion failed because the file is taking too long to process". This option makes the conversion easier but doesn't help in this particular case. This document doesn't contain any pictures so the recognition wasn't so processing expensive to help shorten the time of the conversion.
We are talking about long (hundreds of pages) but simple document formatted as a table. I expected that the conversion to Excel sheet is simple. If the service is so complicated, why don't use some spool, take requests and send notifications about the result. You can have hours for conversion, I don't care.
And, if the service is so sensitive, maybe some list of limitations and to-do's in case of problems could be helpful - the best on the home page of the product to be informed before making the order. It isn't possible to spend many hours on discussions and forums and read about the troubles of another people to find the solution. Maybe could be a fair solution to give a possibility to try your tool for free with some limitations (number of pages, number of documents or something similar).
I am grateful that we found a solution and I can cancel my order and get my money back. Unfortunately, this service doesn't fit my needs.

Fireworks buttons into Dreamweaver

Hello,
I have made some simple buttons in Fireworks that I would like to export and place in Dreamweaver. The buttons are symbols with an up and over state, but additionally I have added pop-up menus to each button. I know how to export and place buttons into Dreamweaver without the pop-up menus... just insert them as rollover images. But after adding the pop-up menus and exporting the button as images, html, and slices I don't know what to do to get them to work in Dreamweaver. Just inserting the html doesn't work... the buttons just appear as a stagnant image. There appears to be some JavaScript that was generated when I made the buttons... do I have to do something with that?
If anyone can think of a way to get my buttons to work interactively in Dreamweaver I would really appreciate it! Thank you so much!

Here's the reason why Alec suggested (and I totally agree) that the FWs built dropdown menus shouldn't be used.
http://www.losingfight.com/blog/2006/08/11/the-sordid-tale-of-mm_menufw_menujs/
http://apptools.com/rants/jsmenu.php
http://apptools.com/rants/menus.php
There is a new alternative which are the Spry Menus, but even those aren't something that I'd choose for a navbar for a site of mine.
Here's a tutorial that helps you build a complete CSS driven dropdown menu - user friendly, easily to build and definitely SEO friendly.
http://htmldog.com/articles/suckerfish/dropdowns/
Nadia
Adobe® Community Expert : Dreamweaver
http://twitter.com/nadiap
Unique CSS Templates |Tutorials |SEO Articles
http://www.DreamweaverResources.com
http://csstemplates.com.au/

Problem with exporting Fireworks mock-up into Dreamweaver

Hallo everyone,
I’m beginner in Fireworks and Dreamweaver. Right now I am working on a mock-up of a web-site in Fireworks. Just for practice, I created very simple structure in Fireworks CS5 (two rectangles with one line of text in 3 different languages placed into one rectangle). When I exported created page into Dreamweaver CS5 as Html and Images, it looked nice (obviously, since it is Html and Images). Then I tried to export the page as CSS and Images. The strange thing is that the page looks fine when displayed in Firefox, but the text breaks into two lines when displayed in Explorer or Opera. Moreover, the design of the page in Dreamweaver doesn’t replicate the Fireworks’ mock-up and looks not as nice as in Fireworks. For you reference I am including the Html and CSS code that was created by Fireworks. Does anybody have an idea what is happening and what should I do to prevent this kind of problems when trying exporting more complicated Fireworks mock-ups?
Sincerely yours,
Arti
This is the code created by Fireworks CS5:
Html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
               <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
               <title>index_ALA_20110129</title>
               <link rel="stylesheet" type="text/css" href="./index_ALA_20110129.css" media="all" />
               
</head>
<body>
<div id="main">
               <div id="hor_line">
               </div>
               <div class="clearFloat"></div>
               <div class="welcome">
                                             <p class="lastNode">いらしゃいませ
                              </p>
               </div>
               <div class="clearFloat"></div>
               <div id="blue_box">
               </div>
               <div id="green_box">
                              <div class="pass_***">
                                                            <p class="lastNode">パスワードを入れてください
                                             </p>
                              </div>
                              <div class="clearFloat"></div>
                              <div class="pass_eng">
                                                            <p class="lastNode">please enter password
                                             </p>
                              </div>
                              <div class="clearFloat"></div>
                              <div class="pass_rus">
                                                            <p class="lastNode">введите ваш пароль пожалуйста
                                             </p>
                              </div>
                              <div class="clearFloat"></div>
               </div>
               <div id="Div">
               </div>
</div>
</body>
</html>
And this is CSS:
@charset "utf-8";
body {
               background-color: #fff;
               font-size: 62.5%;
               margin: 0;
               padding: 0;
body * {
               font-size: 100%;
h1, h2, h3, h4, h5, h6 {
               font-weight: normal;
p {
               margin-bottom: 1.1em;
               margin-top: 0;
#main p.lastNode {
               margin-bottom: 0;
a:link img, a:visited img {
               border: none;
div.clearFloat {
               clear: both;
               font-size: 0;
               height: 0;
               line-height: 0px;
li.clearFloat {
               clear: both;
ul.symbolList {
               display: inline;
               float: left;
               list-style-type: none;
               margin: 0;
               padding: 0;
.AbsWrap {
               position: relative;
               width: 100%;
.rowWrap {
               width: 100%;
#main {
               margin: 0 auto 0 0;
               width: 1000px;
#hor_line {
               margin-left: 45px;
               margin-top: 80px;
               display: inline;
               float: left;
               margin-bottom: 0;
               border: 11px solid #ccc;
               width: 887px;
               padding-top: 1px;
               height: 1px;
               height: 2px;
               overflow: hidden;
.welcome {
               font-family: 'ＭＳＰゴシック', Arial, Helvetica, sans-serif;
               font-size: 400%;
               font-weight: bold;
               text-align: left;
               text-decoration: underline;
               color: #900;
               line-height: 120%;
               padding-bottom: 2px;
               padding-top: 1px;
               margin-left: 50px;
               margin-top: 58px;
               display: inline;
               float: left;
               margin-bottom: 0;
#blue_box {
               margin-left: 44px;
               margin-top: 16px;
               display: inline;
               float: left;
               margin-bottom: 0;
               background-color: #03c;
               width: 417px;
               padding-top: 0px;
               height: 290px;
html > body #blue_box {
               height: auto;
               min-height: 291px;
#green_box {
               margin-left: 57px;
               margin-top: 16px;
               display: inline;
               float: left;
               margin-bottom: 0;
               background-color: #9f9;
               width: 406px;
               padding-top: 0px;
               height: 290px;
html > body #green_box {
               height: auto;
               min-height: 291px;
.pass_*** {
               font-family: 'メイリオ', Arial, Helvetica, sans-serif;
               font-size: 230%;
               font-weight: bold;
               text-align: left;
               color: #006;
               line-height: 120%;
               padding-bottom: 2px;
               padding-top: 1px;
               margin-left: 31px;
               margin-top: 42px;
               display: inline;
               float: left;
               margin-bottom: 0;
.pass_eng {
               font-family: Arial, Helvetica, sans-serif;
               font-size: 220%;
               font-weight: bold;
               text-align: left;
               color: #39576b;
               line-height: 120%;
               padding-bottom: 2px;
               padding-top: 1px;
               margin-left: 31px;
               margin-top: 45px;
               display: inline;
               float: left;
               margin-bottom: 0;
.pass_rus {
               font-family: Arial, Helvetica, sans-serif;
               font-size: 180%;
               font-weight: bold;
               text-align: left;
               color: #006;
               line-height: 120%;
               padding-bottom: 2px;
               padding-top: 1px;
               margin-left: 31px;
               margin-top: 62px;
               display: inline;
               float: left;
               margin-bottom: 0;
#Div {
               margin-right: -95px;
               margin-top: 108px;
               display: inline;
               float: right;
               margin-bottom: 0;
               border-left: 1px solid #ccc;
               height: 1px;
               width: 1px;
               height: 1px;
               overflow: hidden;

Hi Jim_Babbage,
Thanks for your response. I am sending you the original PNG file.
Looking forward to your solution,
Arti

Best Strategy for Exporting Fireworks into Dreamweaver

I created a navigation bar in Fireworks and now I want to export it into Dreamweaver.
So I Went to Edit->Copy HTML Code (hotkey for this is Ctrl+Alt+C)
Now, what's the "best choice" from the dialog choices: AIR HTML, Dreamweaver HTML, Generic HTML, GoLive HTML, AIR XHTML, Dreamweaver XHTML, Generic XHTML or GoLive XHTML for a cross browser "professional" website?
I only tried the "Dreamweaver HTML Option" and itseemed to work nicely in my rookie opinion.
I think this technique might be at a performance cost to my graphic design or the website speed. So should I use a different strategy for exporting Fireworks to Dreamweaver? I have the CS5 package so can use any of those programs for support.
Thanks,

INHO, the best way to export from Fireworks to Dreamweaver is to first define your site in Dreamweaver, and then export the Fireworks document to the assets folder. Place your cursor when you want the navbar to be on your HTML page and choose Insert > Image Objects > Fireworks HTML.

Problems exporting rollover 'states' into Dreamweaver, and loss of font formats

Hi
I am quite new to Fireworks and am having a little difficulty with some aspects of it.
I am building a miltiple page site, and am exporting using the the 'export CSS and Images' option from Fireworks CS4 to Dreamweaver CS4.
I have applied some 'swap image behaviour' to the links on the Master Page.
However When I try to export to Dreamweaver I get the following message:
"Only sliced images from the current state will be included in this export. Hotspot and behaviour attributes will be ignored."
Obviously I want the states (swap image) functionality to be exported so that the javascript rollovers work. Any ideas how to resolve this?
Also, when I export the pages into Dreamweaver, I have noticed that the font formatting is lost e.g. <h1> format style etc So an orange <h1> font title, with black outline, will not retain that formatting in Dreamweaver (it actually renders as white, which is the same as the <p> font elements.). I do know how to alter the CSS to render a different colour in Dreamweaver: but its the character outline that I cannot reproduce by manipulating the CSS (I don't know how to anyway....).
Also, once a 'Master' page has been created, will all other pages within the document automatically inherit the functions and settings as per the Master Page. Or do I need to link each page to the Master Page in order for them to inherit its functionality and settings? I'm particuarly thinking about the states/rollover issue again here i.e. Will I need to set under/over states on each individual page or do I just need to set it once on the Master page?
Thanks for your help.

Q1: There. Is no way to resolve this in Fireworks. You'll have to export the other states manually and build the rollovers in dreamweaver.
Q2: Again, *if* there us a widely supported CSS option fir text outlining you have tomanually apply it to the code in Dreamweaver.
Q3: Hyperlinks and graphics on the master page should be applied to all child pages.
Fireworks is not a true web page editor. Keep this in mind. It is a graphics tool fulirst and foremost. The CSS and HTML features are not nearly as robust as Dreamweaver. Hope this helps

Using Contribute CS5 to edit site created w/Dreamweaver - PayPal button size issues

I'm using Adobe Contribute CS5 to edit my web site that was built with Dreamweaver on a Mac. I have a PC with Windows XP, 1G of ram, a 40G hard drive (used only for programs and operating system) a 1 terabyte external hard drive for all files, etc. I use MSN Explorer for my browser.
I have done extensive editing and everything works fine except for when I edit or add PayPal buttons. The site was built using "tables" for most everything as well as all of my price lists. When I add a button or edit button properties, that row of cells doubles in height, in the "editing window" they look okay but when I publish the page they take on the doubled height.
I contacted Contribute tech support and they say Contribute is working properly and the problem is with how the button code was written in Dreamweaver. The tech said even though the button looks like it is the proper size, the code tells it to take up more space thus giving me the cell height problem. My standard price lists do not have any lines defining rows and columns but on one page I have been experimenting with I have given the table a line value of 1 to enable me to see what is going on, you can view this page at; http://www.hopscrimshaw.com/birds/owls1.htm
My Webmaster and I parted ways a few years ago so seeking help there is not an option, she won't return phone calls, reply to e-mails, etc.
Any help solving this problem would be very much appreciated.
Thanks, PapaHop

I am also having this problem and any answer would be greatly appreciated. The code <p style="margin-top: 0; margin-bottom: 0;"> </p> gets added whenever text edits are made. This seems to create spaces on the page which pushes content out of alignment. The code gets put into the navigation, the text and anything above the text being edited, jpeg sliders, images, etc.

Fireworks CS5 Invlaid page name error on export

I've been using CS3 up until today on my Window 7 machine. I decided to install CS5 today and have run into issues when trying to export slices from Fireworks.
I right click on the slice, select export selected slice as usual, select the image I want to overwrite or simply type in a new file name and click save...
I get this on my screen:
Invalid page name. Done not use the following characters: \ / : * ? " " < > |
I haven't used any of these characters and never do!
it doesn't matter even if the filename contains only letters, I still get this error.
I can't export anything and therefore I can't work.
I've searched on google and not had any relevant search results.
Can someone help??
Many thanks
Evie

PirateJonno wrote:yup, see here: http://appdb.winehq.org/objectManager.p … n&iId=1015. It's a good idea to check there before trying to install something. I can personally confirm that the sims 3 works though.
Thanks for that ... When you say Sims 3, is that the name, or does it have another title.
Cheers,
Bernie

Fireworks CS5 buttons don't export into Dreamweaver S5 correctly

Similar Messages

Maybe you are looking for