Posts in Category "Adobe.com"

Using jQTouch in Dreamweaver

Posted on April 7, 2010 by Randy Edmunds | Comments (1)

I was playing around with a Web Site developed using jQTouch (which is very cool, BTW) in Dreamweaver and I quickly realized that I could not see anything in Design View. jQTouch web sites consist of a single HTML file and each "page" is a <div> which is a direct descendent of the <body>. The site interaction is implemented with a combination of CSS and (unobtrusive) JavaScript.

I know that the Design View does not execute JS, so it will not render the styles applied via JS in jQTouch, and will not look like browsers (starting with CS4 you can use Live View for that), but it’s sometimes helpful to see the static content and to be able to select elements for navigating to them in Code View for editing.

So, I created a Design-time Style Sheet with the following CSS rules and attached it to my page:

* {
display: inherit !important;    /* override display:none */
font-family: Arial !important;  /* Windows: no Helvetica */
}
body > div {
visibility: hidden !important;  /* hide divs (except if selected) */
}

Now I get a list of the "pages" in the AP Elements Panel. They are all hidden (so all of the AP Elements don’t render on top of each other), but when I choose the one I want to edit, I see the static content in Design View (which displays selected AP Elements even if hidden) and the markup is selected in Code View. Here’s how it looks in DW CS4:

dw_jqtouch_dtss.png

CS5 is coming

Posted on March 24, 2010 by Randy Edmunds | Comments (6)

Creative Suite 5 is coming! Sign up for our launch event http://bit.ly/cs5signup.

Displaying Styles in Design View

Posted on June 25, 2009 by Randy Edmunds | Comments (2)

In Dreamweaver CS3, a feature was introduced to allow CSS style rendering to be turned OFF in Design View:

  View > Style Rendering > Display Styles

This allows you to quickly view the semantic structure of a page. It’s also helpful when marking up or editing content inside elements that are not accessible in Design View for whatever reason.

Originally, this setting persisted until changed. But, many users turned off this setting without knowing what it was, and later would go crazy trying to figure out why their styles weren’t rendering. So starting in CS4, this setting is always reset to ON when DW is restarted (which is a natural action to take when things don’t make sense).

You can change it to default to OFF as follows:

1. Place the following code in a file called myStartup.htm :

<html>
<head>
<script language="JavaScript">
dw.cssStylePalette.setDisplayStyles(false);
</script>
</head>
<body>
</body>
</html>

2. Place a copy of this file in the Configuration/Startup folder so that it gets executed every time you start DW.

Notice that I gave it a generic name in case you want to add any other commands to be executed at every startup.

CS4 Code Printing Improvements

Posted on June 10, 2009 by Randy Edmunds | Comments (4)

Starting with Dreamweaver CS4, code now prints with Syntax Coloring.
The exception to this is that background colors are not printed. Code printing recognizes the “Syntax Coloring” Code View setting in the:
  View > Code View Options
menu for turning off coloring.
The “Line Numbers” setting is also recognized when printing.

Making Feature Requests

Posted on April 22, 2009 by Randy Edmunds | Comments (0)

Are you interested in requesting a new feature for Dreamweaver, or any other Adobe product?
First of all, read this excellent article by Garrett Dimon (that I found on John Nack’s blog) about suggestions for making feature requests. As someone who regularly reads Feature Requests, this article hits the mark on every point.
Then use the Adobe Feature Request Form to submit your request to the appropriate Adobe product team.

Thank you in advance for keeping the great feedback coming!

Note: none of the comments for this post have been about this post (they have all been Feature Requests), so I turned off comments for this post. Please follow the link to the Adobe Feature Request Form to submit your request to the appropriate Adobe product team!

 

Dreamweaver on Adobe TV

Posted on March 25, 2009 by Randy Edmunds | Comments (5)

Adobe TV has many videos for learning about Dreamweaver. Start with the following link:
http://tv.adobe.com/#pd+Dreamweaver
Use the settings on the right to narrow down the list for your interests according to Release (CS3, CS4, Other), Skill Level (Beginner, Intermediate, Advanced), and Topics (Tutorials, Demos, Tips and Tricks, and Inspiration).
Also, use the dropdown list at the top to sort the videos By Date, Alphabetically, Highest Rated, or Most Popular to help sift through the list.

Extending Dreamweaver: Getting Started

Posted on February 25, 2009 by Randy Edmunds | Comments (9)

Dreamweaver was designed to be highly extensible. After deciding that you’d like to add or streamline some functionality in Dreamweaver, how do you get started?
The extension may have already been written by someone else, so first, check the Adobe Exchange. Also, search the internet because there are many third party extensions that are not uploaded to the Adobe Exchange.
The easiest way to create your first extension is to open the History Panel (Window > History), select 1 or more steps, right-click and select “Save as Command…”. This creates a Command in the User Configuration folder Commands sub-folder which on WinXP is usually something like:
C:\Documents and Settings\[username]\Application Data\Adobe\Dreamweaver CS4\en_US\Configuration\Commands
Note that the “Application Data” folder is hidden by default, so you may need to enable displaying of hidden folders in the Folder Options of the File Explorer.
Next, look around in the Application Configuration folder for code samples. On WinXP, it’s usually here:
C:\Program Files\Adobe\Adobe Dreamweaver CS4\en_US\Configuration
Some tools provide an interface for users to extend it, but don’t actually use it themselves. Dreamweaver uses it’s own extensibility layer extensively (warning: pun attempt), so you’ll find an example of almost all thousand or so JS API calls.
DW extensibility UIs are written in HTML, CSS, and JavaScript, so you already know how to do it. They are rendered with our proprietary rendering engine, so not all HTML/CSS/DOM is supported, and the rendering maybe different from current browsers, so you have to play around with it a bit.
Some aspects of the extensibility UI rendering is controlled by the DOCTYPE. Our proprietary rendering engine (note to wikipedia: it’s not Opera) has evolved over the years, so be sure to target the desired DW version number in your DOCTYPE. So, to create a Property Inspector to target Dreamweaver Version 8 and above, use:
<!DOCTYPE HTML SYSTEM "-//Macromedia//DWExtension layout-engine 8.0//pi">
Note that starting with version 10, the DOCTYPE was changed to use “Adobe”:
<!DOCTYPE HTML SYSTEM "-//Adobe//DWExtension layout-engine 10.0//dialog">
There are online Extending and API docs here:
http://help.adobe.com/en_US/Dreamweaver/10.0_Extending/index.html
http://help.adobe.com/en_US/Dreamweaver/10.0_API_Ref/index.html
Finally, be sure to upload your extension to the Exchange if you’d like to share it with others.

Split Code View

Posted on January 20, 2009 by Randy Edmunds | Comments (4)

DW CS4 has a new split code view. Use: View > Split Code from the main menu.
You might not have found it because a button was not added to the toolbar with the Code, Split, and Design buttons for the sake of avoiding confusion. The good news is that the markup to add the button was left in the Configuration/Toolbars/toolbars.xml file, but simply “commented out”. So, you can “uncomment” the markup if you’d like that button on your toolbar.

Dreamweaver Extensibility is alive and well

Posted on January 7, 2009 by Randy Edmunds | Comments (0)

The Adobe Exchange has extensions for Dreamweaver and other Adobe products:
http://www.adobe.com/cfusion/exchange/
A few years ago, the number of uploads and downloads of DW extensions on the Exchange slowed to a crawl because the web site was, uh, a bit challenged. OK, it sucked. But the web site has been redesigned, so please give it another look. I currently see 1,408 extensions for DW.
Also, there are many Dreamweaver extensions written by third party developers that do not get uploaded to the Exchange, so be sure to search the web for more. There are too many good developers to list them all here, and I don’t want to play favorites :)

New Captivate simulations on the Spry framework for Ajax

Posted on October 16, 2007 by gfox | Comments (3)

We’ve published new Captivate simulations by Mark Fletcher on the Spry framework for Ajax. These interactive tutorials simulate the Dreamweaver environment and guide you through how to use the Spry widgets, panels, effects, data sets, and more.
You can find them here.
Sincerely,
George Fox
Adobe Developer Connection