Learn to Style Tags with CSS!

Learn all about styling tags and how to write CSS code in Dreamweaver. By the end of this tutorial you will have a good understanding of how to write CSS, how CSS works, and how you can write your CSS code in Dreamweaver.

Tags :: CSS Coding:: Basics:: Automatic:: Styles

Spry Collapsible Content Panel!

In this tutorial we will learn about a very cool widget in Dreamweaver CS4 that will allow you to create a very cool and easy to edit Collapsible Panel which basically allows a user to click and tab and a content box drops down below it and the user it able to click the tab and retract the box so it is just the tab again. It is really a cool way to display some content and adds a neat little effect to your website.

Div Tags :: CSS Coding:: Spry:: Collapsible Panel:: Content

Fixed Rounded Corner Box with CSS!

Hey guys! In this tutorial we will take a look at creating a fixed width, rounded corners text box using two simple images we create in Photoshop. You will learn a little about writing CSS code and working with images and CSS as well as some other cool useful tips and tricks.

Div Tags :: CSS Coding:: Rounded:: Fixed Corners:: Content

14 Steps to Using Div Tags!

This is a tutorial straight from the Tutvid.com newsletter! We will take a look at a whole bunch of the things you want to be sure to know when starting to use Divs. Learn all about placing and using Divs as well as styling them with CSS in Dreamweaver!

Div Tags :: CSS Coding:: tips:: Basics:: IDs

How to use Lightbox 2!

I have received a ton of requests for Lightbox2 tutorials. I have gone ahead and created one using Dreamweaver and by the time you watch this video you will be able to setup and edit your very own LightBox 2 JavaScript Photo Gallery.

JavaScript :: HTML :: Coding:: Basics:: Image Gallery

Define Local Root Folder or Dreamweaver Site!

Defining your site or local root folder as Dreamweaver calls it is the one thing you absolutely want to be able to do. Defining this root folder is the first step to using Dreamweaver very effectively and allowing Dreamweaver to manage your site for you and keep all of the links-everything from images to other pages-updated as you move pages, elements, and files around in your site. Defining a root folder takes a lot of the headache out of managing a website and allows you to properly use Dreamweaver.

Local Root :: Define a Site:: Managment:: Basics:: Links

CSS Website Drop Shadow

Let's learn how to create a drop shadow that runs along your site, and, if your site expands, expands with it! We will start in Photoshop where we will create a nice little drop shadow graphic and then it's off to Dreamweaver for some CSS and Div-tacular fun... yep that was certifiably lame, but enjoy the video anyway!

Drop Shadow :: Links :: Wrapper:: Divs:: CSS

Pixy Style CSS Rollovers!

Rollovers are hot, and CSS rollovers are hot-ter. Creating rollovers using CSS prevents you from having issues as far as people not having JavaScript enabled and from having to worry about JavaScript and your rollovers. The beauty of Pixy style rollovers is they are automatically preloaded due to the way we set them up so you will not have any flashing or issues showing up when people rollover your buttons. Learn how to build them in Dreamweaver here!

Pixy :: Links :: Navigation Bar:: Rollovers:: CSS

Linking to Download-able Files!

This is a pretty hotly requested tutorial which I finally sat down and hammered out. How do I setup a link to download a file onto the users computer? That is essentaill what we answer in the following video. It is pretty quick, easy, and simple to do. Using the combination of WinZip and Dreamweaver to create a fool-proof way to set it all up.

Zip Files :: Links :: Prompting Download:: Display:: Browser

Spry Drop Down Menus in Dreamweaver CS4!

Spry drop down menus make creating drop down menus cake work in Dreamweaver! In this video we will create and edit our drop down menu and then edit the CSS to create a truely customized drop down menu. Learn how to use and edits the generic CSS style sheet Dreamweaver gives you spry drop down when you first insert it into the page. We will cover Spry and CSS in Dreamweaver in this video tutorial!

Spry :: Styling :: Fly out:: Pop Up:: Rollovers

The Basics of XML: Write a simple XML document!

In this video we will quickly run over XML, what it is, and what it is used for. We will then sit down and write out our very first XML document just a simple list of six people. We will use Dreamweaver, but really any text editor is fine. We will cover creating writing the actual language, adding attributes, as well as how we create our own tags and just some basics to get you going writing your own XML document.

XML :: Coding :: Data Organization:: Nodes:: Basics

Spry Tooltips in Dreamweaver CS4!

One of the coolest new features in Dreamweaver CS4 is the addition of Spry ToolTips. Those of you that have used Spry anything know it is a breeze to create Spry objects and with a little CSS knowledge it is easy to edit too! We will discuss creating, add content to, and styling with CSS tooltips.

Spry :: Styling :: CS4 New Feature:: Pop Up:: Rollovers

Online Photography Thumbnail Gallery in No Time Flat!

Here it is, finally creating a tutorial with a little foresight as far as using what we make here for many other tutorials. We will create a simple metal type panel with these six thumbnails sitting on it. Using CSS to style the panel and the thumbnails we are able to create a really nice clean effect as well as giving out thumbnails rollovers and all of this is done very easily and is also super easy to update! Check it out, follow along using the files at the site!

Styles :: Classes :: Divs :: Centering :: Margins

Create a Fully CSS Website Layout!

In this video we will start with a folder of images and in about 30 minutes construct a very simple 2 column layout using CSS to style our page! We will learn all about using divs, creating CSS rules, targeting divs, creating a background, and so much more! Start learning to harness the raw power of Cascading Style Sheets to create, layout, and style your web pages today!

Styles :: Rules :: Divs :: Floating :: Clearing

Creating and Placing a Favicon onto Your WebSite!

In this video we will take a look at the different ways to export the needed .ico file and get a favicon up on the web for your site very soon!

XHTML :: Header :: Icon :: Page Design:: Training

CSS and Styling Images in Dreamweaver!

In this video we will cover CSS classes and the creation and application of them. We will apply page-wide class styles as well as being a bit more specific with the selectors we use. Great for beginners and Intermediates alike!

Classest :: CSS Styles:: Creation :: Tag Selector:: Images

Using CSS Class Styles to Style Text and Links!

This video will cover using advanced selectors and classes alike to style your links and create rollovers and lots of other little tips and tricks!

CSS :: Selectors :: Stlying :: Classes :: Basic Styles

Creating Cool and Interesting Repeating Backgrounds with CSS!

So many Web 2.0 style sites, matter of fact many sites in general have these backgrounds that seems to go on forever but have one unique end and seem to fade off to an image or color that appears to go on forever. This is simply an illusion and really can be done very easily with CSS and a 1px wide image! We will start with a blank Photoshop doc and first create our background then bring it into Dreamweaver and make our background using CSS.

CSS Styling :: Layout :: X Repeat:: Tiling :: XHTML

FTPing to Upload Your Pages and WebSite to the Web!

Learn all about uploading your first website in dreamweaver! Learn the basics of uploading in general and things you should keep in mind and do when you are uploading your files and web pages. We will use a live (free) host I setup for this video and upload to that so you can get an idea of how it all works and how you can get your site up and running!

FTP :: Uploading :: Live Web:: Page Upload:: Files

Validating a Form Using Dreamweaver's Behaviors!

In this video we will cover form validation. Form validation is a super important aspect of forms in dreamweaver and in all of web design for that matter. Form validation insures you recieve emails with valid information(for the most part) and helps users understand when they need to submit more information about themselves when they use your web form!

JavaScript :: PreBuilt :: Scripts :: Behaviors :: Validate

Creating Transparency with an SWF file and Dreamweaver

Take that SWF file with lots of open space(be it an animation walking around or maybe that slick semi opaque video(or something like that...?), or maybe the more practical drop down menu) and place it on a div that floats above your site and allows you to see whatever is underneath of it! A pretty useful technique!

Attributes :: WMODE :: DHTML :: CSS :: Overlay

Build and Layout a Web Form using Dreamweaver!

In the following video we will build a web based form using html. We will cover using Labels, Text Fields, Text Boxes, Radio Button Groups, Checkboxes, The Clear and Submit buttons, Drop down Menus, as well as many of the properties you can edit while building the form. The form will be ready to be linked with a PHP file for use when you are finished with this video. Get ready to learn a whole lot!

Forms :: Layout :: Interactive :: Web Design:: Submit

Writing a Simple PHP Email Processing Script in Dreamweaver!

In the following tutorial we will start with a few html files - which are available for download here on the site - and we will build an Email Handling PHP script that sends info from your web form to your email! It is pretty easy PHP so enjoy learning and Have fun! I am using Dreamweaver CS3, but you can use pretty much any version of Dreamweaver, just follow closely and try not to make mistakes.

Handler :: Mailto :: Form Process:: Variables :: Coding

Importing PSD Layouts into Dreamweaver!

We will export a web layout made in Photoshop and build an editable website layout in Dreamweaver. We will then convert the page to a template for future use and ease of editing. While this is far from being the "ideal" way to layout a website it is a popular way to at least get started in Dreamweaver.

Photoshop :: Web Layout:: Site Design:: Export :: XHTML

Using AP Divs and CSS Styles in Dreamweaver

In the following video we will learn all about creating layers or as they are called in CS3 AP Divs. Learn about applying properties to custom CSS rules and using stacked Divs to create interesting effects with images. This is a good beginner's guide to Divs and CSS in general.

CSS Rules :: Divs :: Positioning :: Styles :: Drawing

Embedding Sound and Movie Files in Your Web Page/Site!

In the following tutorial we will learn how to import and attach mp3, mov, and wmv files to your website both by embedding and linking the files. Learn the advantages and disadvantages of both methods! Have fun and learn something!

Mp3 :: Mov and WMV:: Live Web:: External Links:: Attributes

Build an Auto-Expanding Web Text Box

Learn how to create a web text box that get bigger or smaller depending on how much text you place in it! Also, as a bonus, make a header that spans the users screen no matter what size!

Expandable :: Tables :: Automatic :: Content Sensitive:: Field

Create a Nice Easy to Edit Tabbed Navigation Bar in Dreamweaver!

Learn how to build a tabbed navigation bar using Dreamweavers Navigation Bar builder. We will give our buttons an over and down state as well. Learn a whole bunch of little tips along the way!

Nav Bar :: Navigation :: Builder :: Editor :: Tabs

Creating Usable Sharp Flash Buttons In Dreamweaver!

Learn all about Flash buttons inside of Dreamweaver, how to make them, edit them and use them in different ways!

Flash :: SWF Buttons:: Editable :: Pre-Built:: Tutvid

Using Custom Fonts and Creating Headings Using Flash Text!

Learn how to use Flash text so you don't have to worry about users having the font you use installed on their computer! Flash Text in Dreamweaver!

Flash :: Custom :: Headings :: TypeFace :: Training

Importing Flash SWF Files and placing them in your WebSite!

In this video we will learn how to export an SWF file and put onto your website! A simple yet vital task if you wish to place SWF files onto your web page.

SWF File :: Flash Integration:: Adding :: Exporting :: Importing

Creating all kinds of HyperLinks!

This is a video tutorial on creating Hyperlinks to your local site as well as sites already out on the web, Targeting those links so they open a new window or take over the window you are using, and creating email links so people can email you right from your site!

Links :: Hyperlinking :: Emailing :: Setup :: Web Design

The Basics of Creating a Web Page in Dreamweaver

Learn how to Insert text and images, as well as change page properties and aligning your placed objects into some kind of order. This is a good tutorial to get yourself started using Dreamweaver with.

Basics :: Laying Out :: Build a Page :: Web Site:: Tutvid

Create Basic Rollovers in Dreamweaver

Learn how to create Web button rollovers quickly and easily in Dreamweaver! This is a very easy and very editable technique that Dreamweaver has which makes creating and editing rollovers a breeze.

JavaScript :: Replacement :: HTML :: Multi-State :: Training

Create a Site: Define a Local Root Folder

Learn how to Define the Local Root folder, sometimes called the Local Site folder. Defining a "Site" in Dreamweaver is the best way to start building your websites. This tutorial is an absolute must if you are just getting started with Dreamweaver or Web Design in general.