Explore the Premium Content

Interface Widgets: Datagrid (part I)

Whether you use the web for shopping or banking, blogging or content management, every once in a while you stumble across an interface widget that makes you wonder: “how the heck do they do it?”

One of those widgets is the datagrid that looks and behaves like your datagrid /spreadsheet in a desktop application: scrollable with static headers, selectable rows and editable cells, sortable columns and other “desktop-like” features.
In this and the following articles of the Interface Widgets series you will learn how to create a datagrid like this in Dreamweaver from scratch.

Read More

Moving from Library items to Includes in Dreamweaver

In the beginning there were Library items

One of the great things about using Dreamweaver is its ability to collect together all your images and code and make it available for you to reuse throughout your site.

Library items are a great example of this, they enable you to place code/design that you will use on a number of pages into a single file, then reference it from each page.

You simply have to update the Library file and Dreamweaver will update all the pages you have placed that Library item on.

Whilst Library items bring a benefit in this respect, the fact you have to upload every page that includes the Library item following an update can be time consuming, especially when using the Library item for the Navigation, which means every page in your site has to be uploaded again.

The ideal situation would be a file, which included your design/code and was ‘linked’ to from each page, but when you updated it, you did not have to upload every page, just the one file you had worked on.

 

Read More

Customising Dreamweaver Menus

One of the joys of Dreamweaver MX 2004 is its flexibility. With a little extra knowledge you can customise it so that it fits your particular workflow. You can hide the panels you don't like, record commands to speed up your common tasks and  customise the menus.

In this tutorial we'll be looking at  how you can alter the structure of the main Dreamweaver menus, allowing quicker access to the features you use, and moving those you don't to somewhere un-obtrusive.

Read More

Building Your Own Dialogs

In my last article I looked at the History panel and some basic bits of web developer knowledge and moved onto creating some commands that we could use to speed up our productivity. We then turned them into buttons on our Insert Bar.

This time we're going to take the basics one step further, and create our own dialog box. We'll use this dialog to get special details about the kind of code the user wants to insert. We'll then use some JavaScript to check our form values are correct, then build the code and insert it for the user.

Our sample dialog will be used to insert a standard (X)HTML layout made up of various <div> tags and a <ul> list for our navigation. Since creating the same set of nested divs over and over again is a bit dull, we'll use our new extension to speed up our productivity.

The code for this simple extension is available for download.

Read More

Insert Bar Object Extensions the Easy Way

Dreamweaver MX 2004 has some rather neat little features hidden away in the interface. One of these is the History panel. Hit Shift and F10 and a rather drab little panel will open up and record every change you make whilst you're writing away in Design Mode.

Not very special you might think, but aside from speeding up your workflow when stepping back and forward through undo commands, the History panel is the first step towards creating your own commands to speed up annoying repetitive formatting tasks.

Combine this with the merest understanding of XML, HTML and JavaScript, and you're well on the way to customising your Dreamweaver installation and creating a rather grand sounding (but really not that difficult to implement) Insert Bar object extension.

Read on for a quick delve into a quick and easy way to improve your Dreamweaver MX 2004 productivity.

Read More

The Dreamweaver MX 2004 Results Panel

As you'll already know Dreamweaver MX 2004 makes web site building easy, productive and fun. In fact it's so powerful you might not know your way round all the tools it places at your disposal, so in this article Matt Machell is going to take you on a guided tour around the client-side HTML tools available in the Results Panel.

He's going to show you how to effectively Search and Replace around your site, use the feedback from the Validator, Browser Check and Link Checker and appreciate Site Reports.

Read More

Using the DMX Layout View

Stepping Stones is a new series building on the recent Cornerstones series. In our first article Molly is looking at the Layout view - a special view that Dreamweaver MX supplies you with as an aid to table design.

Read More

Cornerstones: Simple Server Side Includes

Most sites have fixed items that appear on every page such as navigation, menus, and footers with copyright notices. Server Side Includes allow you to move these portions into individual files, and give a command in the main HTML or XHTML document that tells the server to include the content of those files where the include statements are, making it much easier to make site-wide updates to those commonly editied portions of your page. This tutorial shows you how to use Server-Side includes with Dreamweaver MX or MX 2004. Read More

Cornerstones: DMX Forms

Forms are one of the most important aspects of web interactivity. Without forms, we wouldn’t be able to use the web to shop, make hotel and airline reservations, and contact companies and individuals via their sites. Dreamweaver MX makes it especially easy to implement forms.

Of course, forms can get very complex, depending upon how detailed your needs are. What’s more, processing forms can be handled in numerous ways—often relying on server-side scripts to process. In this article, I’ll focus on how to create a form using the most common techniques and leave advanced and server-side information to future or related articles. The point here is to get you familiar with Dreamweaver’s form options and commonly used form components.

Read More

Intro to Frames in Dreamweaver MX

There's a lot of controversy over the use of frames on the Web. Some sites benefit enormously from a frameset user interface, whereas some designers maintain that frames are always a usability and accessibility nightmare. As usual, the truth is in the middle - and, as usual, Molly cuts through the B.S. to give beginners the low-down on what Frames are good for, what they're bad for, and how to make framed sites in Dreamweaver MX and MX2004. Read More

Minding Your &lt;table&gt; Manners

Beginners often mistakenly believe that tables in web pages are evil. But they're not; for tabular data, they are the perfect structure - and those tasked with updating or maintaining legacy sites, knowing how to use tables in Dreamweaver is a vital skill. Here, Molly takes the newcomer to Dreamweaver on a tour around Dreamweaver's table-handling functions, and explains what's good, what's bad - and what's just plain ugly. Read More

Working with Images

Images are used on the web as everything from navigation buttons to photo galleries. They can be used as decorative bullets in lists or for animations and advertisements.  Images can be placed in the background of any page element when using CSS, allowing for numerous interesting visual techniques and contemporary design. Images can also have behaviors applied to them, and with the effects available in the graphics applications and in Dreamweaver, images can provide your site visitors with a rich visual and interactive experience.

 

Molly show some of the basics of adding  images to your HTML pages, using Dreamweaver as your development tool.

Read More