CoffeeCup Code Cleaner not working - resolved

The Tools - Code Cleaner stopped working. I gave up
and ran the Document - Validate HTML which
automatically ran the W3C Markup Validation Service. This had
several messages, one being about the use of lh list
header tag that I had tried when exploring the Insert -
List command. I removed this as it is not part of HTML5
standards and now the Tools - Code Cleaner is working
fine again.

Images not seen online but work on local disk - a solution

Having decided to use my trusted Total Commander to FTP my site I was developing with CoffeCup, see previous item, I was surprised to see photos not displayed after I had published to web. They worked OK when I was accessing pages on my local hard drive.

Agh, then I recalled similar problems in the past that had taken ages to resolve. I have my FTP options set to. Invert any upper case character in a file name to lower case when uploading. A quick edit changing all references to photos to lower case and upload new version and all OK again.


- Posted using BlogPress from my iPad

CoffeeCup only publishes to the root - correction no it doesn't

Corrected post

The reason why I could not upload my website to my target folder was because I was using File - Upload File to Server when I should have been using My Websites - Upload Selected Files or My Websites - Upload Entire Website Project which send them to the folder you have defined as the root in the My Websites - Website Project Settings.

Original post

I use the excellent free Zymic hosting for testing my web developments. I need to have many folders to keep the various projects separate.

I have discovered that CoffeeCup HTML Editor insists on publishing index.html to the root file of my service. I tried for over an hour to get it to publish to my target folder to no avail and on googling discovered that it only puts this file in the root.

So I now publish to my local disk, well I di this anyway, and then use my trusty Total Commander from Ghisler to do FTP work.

Another inelegant solution but at least Total Commander is very fast.


- Posted using BlogPress from my iPad

CoffeeCup multiple views

CoffeeCup HTML Editor does not appear to let you view more than one source page side by side. For example it would be nice to be able to see say HTML code, CSS Code and Page Output all in separate tiled windows.
You can have both files open at the same time but you have to flip from one to the other to see.

I sometimes use TopStyle Lite and open the CSS file in a separate MS Window which I the tile with CoffeeCup window, so seeing HTML and CSS source side by side, but this is an inelegant solution


- Posted using BlogPress from my iPad

CoffeeCup in the Winter Nights

It's that time again when I decide to do some more web development exploration. This year I have set myself the task of comparing high level development using Serif WebPlus X4 to low development with CoffeeCup HTML Editor.

I am going to start simple and make sure I understand every stage. The development will be recorded by keeping older pages on the site as an audit trail.

I will dash notes and findings as they happen on this blog, which I am writing on iPad using BlogPress, and with the wonders of BlogPress these should also be posted on my Twitter.

Nothing fancy just honest toil, mistakes and how to avoid, annoyances and work around and the occasional 'well how about that'.


- Posted using BlogPress from my iPad

Howto Embed Flickr Slideshow into Google Sites (Cont.)

My previous blog showed in detail how to embed a Flickr slideshow into a Google Sites web page.

This blog adds a couple of features,

• Change size of slideshow
• Use Flickr search to select photos

This time the slideshows are embedded into a two column Google Site web page.
flickr-slideshow-extra-01, originally uploaded by rodtuk.

Before using Flickr search, make sure that the search is limited to your own Photostream.
flickr-slideshow-extra-02, originally uploaded by rodtuk.

I have added the search criteria.

Note: What I consider to be my better photographs I tag as A1, so this is just selecting the better photographs of the Millennium Green.
flickr-slideshow-extra-03, originally uploaded by rodtuk.

Click on the slideshow icon to start the Flickr slideshow for the selected photos.
flickr-slideshow-extra-04, originally uploaded by rodtuk.

Display the share options, as described in the previous blog.

To change the slideshow take the customization option.
flickr-slideshow-extra-05, originally uploaded by rodtuk.

Note the default size before customization is 400 x 300.
flickr-slideshow-extra-06, originally uploaded by rodtuk.

I am going to change this to 300
flickr-slideshow-extra-07, originally uploaded by rodtuk.

flickr-slideshow-extra-08, originally uploaded by rodtuk.

Copy the provided HTML.
flickr-slideshow-extra-09, originally uploaded by rodtuk.

Go to your Google Sites web page, edit page and select click on edit HTML tab. Paste the copied code at the relevant position and press Update.

flickr-slideshow-extra-10, originally uploaded by rodtuk.

The new slideshow gadget has been added to my Google Sites web page,

Unlike my previous blog this is using a two column template so the 300x300 slide shows are aligned side by side. You may have to do a bit of editing to align them horizontally.

flickr-slideshow-extra-11, originally uploaded by rodtuk.

There is no indication which slide show it is so I usually add a title which I format to h2 level.
flickr-slideshow-extra-12, originally uploaded by rodtuk.

To move to the other column select the heading and slideshow gadget and cut (Ctrl-X).
flickr-slideshow-extra-13, originally uploaded by rodtuk.

Paste (Ctrl-V) in the other column.
flickr-slideshow-extra-14, originally uploaded by rodtuk.

You may need to change some of the options.

Do as explained in previous post, click on gadget to show options and select the ones you need.

In this case I want to align to the right.
flickr-slideshow-extra-15, originally uploaded by rodtuk.

Now the slide show gadget is in the 2nd column and aligned to the right to match the other 2nd column gadgets
flickr-slideshow-extra-16, originally uploaded by rodtuk.

Save the page to see the final result.
flickr-slideshow-extra-17, originally uploaded by rodtuk.

How to Embed Flickr Sideshows into a Google Sites web page

This blog describes how to embed Flickr Sideshows into a Google Sites web page.


flickr-slideshow-1, originally uploaded by rodtuk.

This first example simply embeds one of my Flickr Sets into a single column Google Sites page.

flickr-slideshow-2, originally uploaded by rodtuk.

Select the Set you wish to embed.

flickr-slideshow-3, originally uploaded by rodtuk.

Click on the Slideshow icon to start Flickr slideshow in the normal manner.


flickr-slideshow-4, originally uploaded by rodtuk.

Click on the Share which is top right of slide show.


flickr-slideshow-5, originally uploaded by rodtuk.

Copy the "Embed HTML" copy button.
flickr-slideshow-6, originally uploaded by rodtuk.

Return to the Google Sites web page, and click on the Edit HTML to display the source HTML code.
flickr-slideshow-7, originally uploaded by rodtuk.

Paste the HTML code into the web page at the position you want.
flickr-slideshow-8, originally uploaded by rodtuk.

Click on the Update button, bottom left.
flickr-slideshow-9, originally uploaded by rodtuk.

Save the changes.
flickr-slideshow-10, originally uploaded by rodtuk.

The outline of the gadget is shown in the Google Sites web page edit. You can modify the defaults by clicking the gadget to show the options at the bottom.

Make any changes you require.
flickr-slideshow-11, originally uploaded by rodtuk.

In this example the Alignment = Centre was chosen.

Save the changes to see the finished page.
flickr-slideshow-12, originally uploaded by rodtuk.

The embedded Flickr Slideshow should appear as shown. To staret the show click on the usual "Play" triangle.
flickr-slideshow-13, originally uploaded by rodtuk.

The final result with the slideshow in progress.
flickr-slideshow-14, originally uploaded by rodtuk.

Move your mouse into the slideshow to reveal the Flickr options.

If you click on the photo you will be taken to the Flickr page for that photo in a new tab.


Click the bottom right icon to start a full page version of the slideshow.


To resume slideshow click Play icon on bottom left.


It is also possible to navigate using the small thumbnails.
flickr-slideshow-15, originally uploaded by rodtuk.

This is the Flickr page for the photo selected as described above.
flickr-slideshow-17, originally uploaded by rodtuk.

Next Blog Post - Two up slideshows & Flickr Search results.