Hi Janine,

I created a drop down menu with Dreamweaver CS3 ( I am waiting to upgrade soon. )

Your directions were great. When I F12 the page to preview it, it looks awesome!

However, when I upload the page, does not look the way it should or function at all.

I have searched the internet high and low for answers to no avail.

Do you have any suggestions, or a quick fix?

Thank you so much for you help.

Shari

Hi Shari,

When you create a drop-down menu with the Spry features in Dreamweaver, Dreamweaver generates the HTML and CSS code, as well as the scripts that make it all work.

Those scripts are usually saved in a folder with a name like SpryAssets and you need to upload the scripts for your drop-down menu to work.

Look in the Files panel for a new folder created by Dreamweaver that has .js files in it (these are JavaScript files). Upload the entire folder to your server with the HTML page that has your drop-down menu and everything should work on the server, just like it does on your hard drive.

You can learn more on my site about creating a drop-down menu in Dreamweaver, as well as editing a drop-down menu in Dreamweaver.

Hope that helps you solve the problem,

Janine

Something tells me you’re not an idiot, but there are a few reasons that your new site may not be showing up. Here are a some things to check.

1. Make sure you uploaded your site to the right place. On many web servers, if you use the FTP info they send, you enter the main folder on the server where they keep your email, web folder, etc, but you need to then open the web folder and upload your files into that folder. It’s often called something like htdocs, or webdocs, or it could be named the URL of your site. It depends on your server, but the key thing to know is that you need to upload the files for your new site into that folder for them to become visible at your URL.

On a related note, a good way to make sure you’re in the right folder is to look for the pages of your old site, make sure you find the main page of the site, and then replace it with the main page of the new site and all of your other files.

2. Make sure you named the main page of your site correctly. On most servers, the main page of your site should be named index.html, but some servers are set up for default.html. It’s often okay to use .html or .htm — they work the same. However, if the main page of your old site is called, say, default.htm and you upload the new version with a main page named index.html, you won’t see the new page if the server is still ‘serving’ the old default.htm page.

Whatever the main page of your old site was called, assume that’s what you should name the main page of the new site and make sure you replace the old page with the new page.

I hope that helps and I wish you all be best with your newly redesigned site.

Janine

I strongly recommend Appearance (CSS). That option will cause Dreamweaver to create CSS styles that correspond to the Page Properties settings, which is the recommended way to define page properties today. To see how this works, create a new blank page, set the page properties with the CSS option selected, and then you can study the styles DW automatically creates by looking for them in the CSS Styles Panel.

If you choose Appearance (HTML) DW uses the HTML attributes, which are no longer recommended.

Janine

Skype automatically highlights any phone numbers displayed in a web browser to make it easy to ‘click to call’ the numbers. Just because you see this formatting on your computer, doesn’t mean other people see it.  Skype formatting on phone numbers is specific to each person’s computer, not to the general formatting of a web page.

That means you can’t really control whether other people see phone numbers on your web pages with skype formatting, but you can remove it on your own computer. I for one, found they formatting — and the way skype changed the size and display of phone numbers — annoying!

It can also be problematic that if you copy and paste a phone number that skype has highlighted, you get a bunch of skype code when you paste it, which means you have to delete a bunch of unecessary characters if you do something like copy and paste a number from a web page into an email message.

So how do you get rid of skype formatting on phone numbers?

The easiest way is to uninstall the skype “click to call’ app. That doesn’t mean you have to uninstall skype, you can still use skype to make call, chat, etc, you’ll just keep skype from formatting numbers on your computer — but you can still copy and paste numbers into skype to make it easy to call any number you see on your screen. Uninstalling Skype Click to Call just removes the program that creates Skype shortcuts.

On a windows computer, you can uninstall the skype click to call feature the same way you’d uninstall any program.

1. Click on the start button

2. Choose Control Panel

3. Choose Uninstall a Program

4. Select Skype Click to Call (make sure you don’t remove the actual Skype program unless you really want to get rid of Skype completely)

5. Click the Remove button.

As soon as the program is removed from your computer, the Skype formatting should go away with it.

Note: You may need to vary these steps slightly, depending on the version of Windows you are using,

One of the things that makes it hard to ‘get’ the hierarchy or specificity of CSS that was written by someone else is that there are so many different ways to write CSS. I sometimes compare it to the art of writing prose. Not everyone who has learned to spell and understands the basics of grammar, can write like Stephen King or Gabriel Garcia Marquez or William Shakespeare.

Even if you haven’t read those authors, you can quickly appreciate that Marquez was a master at magic realism, which is quite different from the science fiction and horror that Stephen King is famous for in books like Carrie and The Shining. To further complicate matters, the way many of us write CSS has changed over time. William Shakespeare is still considered a master, but few teachers would recommend you write the way he did anymore. Similarly, even well-written CSS, if it’s a few years old, may read like Old English today.

ThemeForest and Woo Themes are considered some of the better sources for templates and WordPress themes, but as soon as you find yourself reviewing someone else’s CSS, you have to take into consideration that every author has their own style, that there are many ways to create the same design effects with CSS, and that if you really want to write the cleanest, best code possible, you’ll spend hours on the details — in much the way a great writer can spend an afternoon looking for just the write word.

The more you learn about CSS, the better you’ll get at writing (and reading) it, but at the end of the day, some of the differences in style sheets come down to, well, style.

You can learn more about the basics from my CSS training videos.

Janine

Hello Janine,

I have watched all of your Dreamweaver and CSS training videos numerous times and worked all of the projects, and I am getting the hang of css styles and rules, etc.

However, I have noticed that the pre-made CSS templates in Dreamweaver have <style> in the CSS panel, which I presume is an “internal” style sheet.  You keep saying in your training that adding an “external” <style.css> to the html page is better, but where do these “external” style sheets come from?

Is there a basic external style sheet you can attach?  Can you change the internal style sheet that came with the template to an external style sheet?

Thanks,

Tom

Hi Tom,

Yes, you can change an internal style sheet into an external style sheet. Here’s what you do.

1. Create a new CSS file by choose File > New, then in the New dialog, choose Blank Page on the left, and choose CSS, and then choose Create.

2. Save that file by choose File > Save, and name it style.css, or main.css (or something like that)

3. Open the HTML page that has the internal styles (the ones that are in the <styles> tags), and attach the new blank external style sheet to that HTML page. You can do that by choosing Format > CSS Styles > Attach Stylesheet.

Now you should see the blank external style sheet in the CSS Styles panel, just above or below the list of styles in the page.

4. To move the styles into the new blank style sheet, just click and drag them in the styles panel from the internal style sheet to the external one, as you see in this screenshot.

Note, you can Shift+Click, or Cmd + Click, to select multiple styles and drag them all at once.

After you move all of the styles into the external style sheet, save the CSS file, and you can then attach that new external CSS file to any or all of the other pages in your site to apply the sames styles to every page.

If you already have internal styles on a page that are the same as the styles in the external style sheet, make sure to delete them — having duplicate styles can cause conflicts.

I hope that helps you finish your site.

Janine

Janine,

I just watched your class on E-Commerce on Kelby Training.  It was an excellent class for someone like me, but  I am experiencing a little difficulty in adding the Google checkout to my site. I have no problems adding the code for the items, but that 2nd piece of code that you said to put at the bottom of every page is causing me problems. I am using iWeb and I am not quite sure where to insert that code, or if it is even possible.

Thank you in advance,

Joe 

Hi Joe,

Thanks for the kinds words about my training videos. I don’t know much about iweb specifically, but some web services — especially those that over simply web design and limit you to templates — make it difficult, or even impossible, to get to the right place in the code to use Google Checkout.

If that’s your situation, you may need to use PayPal instead. Unlike Google, which gives you a small piece of code for each button, and another small piece of code to put at the bottom of each page, when you use the shopping cart service from PayPal, you get all of that code in one big chunk. I still prefer the interface of Google Checkout, but in your case, PayPal may be your best (or only) choice.

I know many people prefer to learn with training videos, but I also have a written tutorial on how to use Google Checkout that may help you find the place you’re having trouble.

I hope that helps you find the right solution for your website and I wish you all the best with your online sales,

Janine
DigitalFamily.com

Dear Janine,

While adding pages to my site, I have been organizing them via subfolders locally on my hard drive. This results in web pages URL’s appearing long and messy. Is there a way to enter a tag, style, or code to change the display URL on my website?

Thank you for your time,
   Mike 

Hi Mike,

Hello,

I wonder if you can help me, I’ve been using my website for 10 years without any problems until a couple of weeks ago when I went to upload the site after knocking an item off. Instead of just synchronizing the 2 pages I’d changed, it tried to re-synchronize the whole site and got stuck. Since then it will stick on different pictures until the connection is lost. I’ve checked everything I can think of. I did get it to synchronize off-line, but it won’t upload.

I’m using Dreamweaver 3; any ideas?

Yours in anticipation,
Jane
United Kingdom

Hi Jane,

Sorry to learn you’re having trouble. Many things can cause problems when you upload a site. There may have been changes on the Web server you use, or your version of Dreamweaver may have been damaged or there may be corrupt files in your site.

Whatever the cause, here are a few possible solutions. First, try uploading just the pages you changed, not the entire site. You don’t have to synchronize to use Dreamweaver to update your site. If you’re timing out with the Synchronize feature, see if you can fix the problem by just selecting the pages you want to update and then clicking on the Upload arrow.

Did you mean you’re using Dreamweaver 3 or CS3? If you’re using Dreamweaver 3, you really should consider upgrading; that is a very old version of the program and after years and all the changes on the web, you really can’t rely on a program that old to be stable. If you’re using version CS3, you’re probably fine, although it is also starting to get old by web standards.

Hope that helps,
Janine

Still want more? Visit the Dreamweaver Help Center at www.DigitalFamily.com/dreamweaver to find Dreamweaver tips, tricks, and tutorials.

Unfortunately, different web browsers display text and HTML differently, and Internet Explorer is one of the worst, and most notorious, for bad code display. What most web designers do is test their pages in a variety of web browsers and work to make sure their pages look ‘good enough’ in all of them. Because the text size and spacing can vary from browser to browser, it’s challenging to get exactly the same display in all browsers. And if your concern is the way text wraps, it’s almost impossible. That’s because your users can change the text size in some browsers, and because text size is different between Mac and Windows computers. Here’s an article I published on my web site addressing this issue. It may help you understand why this is a challenge for all web designers. You’ll also find links to a few online testing tools that can help you make sure you site looks good, even in web browsers you may not have on your own computer. http://www.digitalfamily.com/dreamweaver/resources/web-browser-test.html I hope that helps and I wish you all the best, Janine