Uploading Files to the Remote Server

There are several methods for uploading your files to your remote server. Expand the Site panel out a little bit more so you can see the full panel. There are a series of icons above the files Files panel the far right one is the Expand icon.   Click that.    This is what comes up. Connect to your remote server by clicking. This can be found on the left panel. It can also be found in the files panel.     The left pane is the live site and right pane is the local site. . There are a couple different ways upload to the remote site or to download from it to the local site. First, select a file or series of files, and click    The down arrow gets files from the remote server and the up arrow sents files to the remote server. Anytime you upload or download a file, Dreamweaver is going to ask if you want to get any of the dependent files. Dependent files would be files that are linked to the page such as CSS files or images, script. etc. Sometimes you want the dependent files to upload or download, and sometimes you don't. Moving your files to and from the remote and local site makes it easy to maintain your files and keep your pages current.

Adding Remote Servers

Today we're going to talk about adding remote servers to your Dreamweaver site. There are several ways to open up the Site Setup dialog box and add a remote server. One would be to go up to the menu and go to Sites > Manage Sites. You can go to the Application toolbar, find the Site pull-down menu and choose Manage Sites. The easiest way is to go to the Files panel and double-click the name of your current site.

Click on Servers on the left-hand side and click the plus symbol .That will bring up the server dialog box.

Name the server; you can name this anything you want. I named this one Project.  Dreamweaver can connect to the site to various protocols.   The default is FTP and that is the standard protocol for most web hosting companies.  Each account is going to have its own specific information.  Contact your hosting company to get your sites information.  Type in the FTP address you got from the hosting company.  I typed in ftp.dddaaa.com, Of course this is a dummy address.   Enter in a username. Again I just typed in dummy information.  This is also the information that you get from your hosting company.  Finally enter in your password and the folder name where your information will be stored. You can choose to have Dreamweaver save this password or not.  Test the server connection. If the information correctly, Dreamweaver will give you a message that says Dreamweaver connected to your web server.

Click OK. Dreamweaver connected to my server, found the information.

Next, we'll take a look at using our remote server to upload files.

Managing Sites In Dreamweaver

Managing your sites in Dreamweaver is extremely easy. One of the easiest ways access Site Management is to use the menu.

 

You can also go to the Files panel, grab the pull-down menu, and go to the link for Managing Our Sites.

We can create a New site, edit an existing one, duplicate it, or we can remove it entirely. 

We are going to edit a site. I am going to select my VFW site and click the Edit button. 



This will bring up the site dialog box.

If we want to change or add some information we will to click on the Advanced Settings category on the left-hand side.

There are a couple of things that we can do here.

The first thing is to define where the Default Images folder is. You want to do that because if Dreamweaver ever has to create some graphics for you based on some widgets that you placed on the page, for example, or some of the other objects that you can place on a page, Dreamweaver now knows where to place those images.

Click the Browse icon. It takes you into the root directory find the _images directory and double-click that, then the Select button.

I can also choose whether I want to make my Links Document or Site Root relative.  We will leave it as document relative. We can also set a Web URL. We do not have that information yet so we will leave that blank.

We also have options for Templates and where to place any Spry Assets, such as External JavaScript in CSS files necessary for any Spry widgets we add to our site. We won’t change any of these right now. Once we are finished making the changes, we are going to click Save, and it's going to re-cache our site.

We can click done, and we are finished with our editing process.

Next time we will talk about how to set up remote servers .



How to Imbed a Video From You Tube on your Web Page

This week I learned how to imbed a You Tube vide on a web page.  First you go to the video you want to imbed.  I made a video based on last week’s blog to use for this demonstration.

Select Share/Share or embed this video and select embed.

Select and copy the code.

Open your page in split view in Dreamweaver.  Paste the code where you want the video to be.

Here is a screen shot of the page in the browser.

Wasn’t that easy?  It is even easier to insert it on this page.  All I had to do was :

And here it is:

I didn't put any sound in because I just made it for this page.

How to Embed a Google Map on Your Web Page

This week I learned how to imbed a map into a web page.  This is a very easy thing to do.  First you go to Google Maps and enter the address you want to imbed.  I entered the address to my son-in-law’s barber shop.

Click on link icon as shown below.

Copy the code as shown below.

Open your page in Dreamweaver in code view and paste the code as shown.

This is how it looks in design view.

This is how it looks in the browser.  When you click on the View Larger Map link you are taken to the Google Map site and the map is full size.

Wan't that easy. Next week I will show you how to imbed a youtube video.

Using Widgets on Web Pages

This week in my Web 2 class we learned all about Widgets.  Widgets are Widgets are pieces of HTML, CSS and JavaScript that provide advanced functionality to web pages.  External Widgets are third party applications that enhance certain website user experience.

Adobe has an added feature built into Dreamweaver that lets you download different kinds of widgets to use on your web pages.   Some of the widgets available are Menus, buttons, gradients, and photo viewers.

The one I used is called the Spry Image slide show.  I opened a new page from my template and went to Insert, Widget

I then selected the Widget browser

Here are some of the selections that are available.  I chose the Spry Image Slideshow.



After it loaded onto my page I went into code view and changed the names of the images to the one’s I wanted to use.

Here are the images I used.  These are photos I took for my photography landscape assignment.