Chef LeeZ Google Web Designer GWD SIte resize, change hyperlinks work a-rounds, add video fails to work

Chef LeeZ web site is created with Google Web Designer GWD HTML 5 WYSIWYG beta.

When we set up our original pages we did them with a page content width of 600px and all the hyperlinks were set up to open in a new window.  Tests with this site indicated we could go larger with the site container size and we adjusted the containers to 900px (select all and adjust position settings) adjust text size in each text container one at a time (see previous post for editing text work a-rounds) as now we have more room so text can be larger and we also wanted to change the hyperlinks from pages ending in .htm to the new pages ending in .html and have them open on the same page.

We found you could not simply view the related hyperlinks and change them to .html as this did not change the code and the links were still opening in a new window we had to uncheck the open in separate window box then change the URL, then copy it, highlight the newly typed text, click the hyperlink task bar option and paste the URL into its place on the hyperlink pop up or manually enter the URL. Once we rebuilt a repetitive sequence of hyperlinks, like the navigation bar, we were able to copy it and highlight and delete the text to be replaced, and paste the copied nav bar in its place on each of the pages one page at a time.

Once again doing editing in GWD is extremely frustrating and time consuming but can be done as you can see on Chef LeeZ new 900px wide web site where the hyperlinks do not open on new page except where we still desired same.

The add video div option doesn't want to open the video URL.  A URL that works just fine by itself (http://www.youtube.com/v/Li7Zu7KbNLM?hl=en&fs=1) and on other web pages (http://www.cookingschoolsintl.com/chefleez/Video/FruitSculptureOnly3HrsOfClassV1.htm) but doesn't work with GWD add video option. Perhaps our next post will provide a solution for adding a video to a Google Web Designer GWD HTML 5 WYSiWYG Html page.

Best wishes for your building your GWD website.

Chef LeeZ Google Web Designer GWD can include gif animations.

Chef LeeZ GWD website Classes, Group Classes and fruit sculpture pages now include an inimated gifs image without any noticeable loss in download time.  Chef LeeZ downloadedGifAp, a free gif animation program, from sourceforge membership, which we used to create the gif image files:

1. KIds Can Cook! 2. Group Class, 3. Fruit Sculpture Class then uploaded the gif file to our web host and copied the web host url and pasted it over the existing IMage Properties source replacing the single image with the animated gif image.

In spite of the GWD editing problems we do want to say it is still the best free HTML5 WYSIWYG program mostly because it provides a code editor function. 

We believe we can increase our website information size by 20 to 30% and still have fully functional fast downloading cross platform HTML5 website created with Google Web Designer GWD beta.  Perhaps we will test this in our next website version. 

Chef LeeZ - GWD - Eliminating the Thick Blue Container Line - work a-round

To eliminate that thick blue container line (which equates to no hyperlinks working within container) that just won't go away try selecting the container, select text, click in container, ctrl a, ctrl c, click inside the container, then outside the container (changes the thick blue container line to a thin line) , and once again outside the container to return all containers to dotted line outline. We recommend you save your work every successful step along the way. That way when something doesn't look right or vanishes you can close don't save and reopen the most recent saved version.

or those of you that have been following Chef LeeZ tested  use of Google Web Designer GWD WYSIWYG cross platform HTML 5 you can now see how we have decided to use GWD.

To those of you just joining the conversation.  The following is a summary, more details are in separately titled blogs.

Chef LeeZ is after a KISS (keep it simple stupid) a no bulchat, user friendly, fast to download, cross platform functional including 3G (21 mps modem) mobile phones users site.  Chef LeeZ GWD site demonstrates this as the text downloads immediately and can be played with while waiting for the header pictures to download which downloads in an acceptable time frame.

In a nut shell here's what our learning GWD WYSIWYG has found applicable:

1) We proved you can incorporate a GWD interstitial page or Ad (IP).  That portion of the otherwise HTML page does not function in harmony with the balance of teh HTML text page which only matters when viewing the site on mobile phone size devices.  More specifically the "IP" didn't always shrink to the phone device. When enlarged it wouldn't go back to shrunk. When scrolling text the text slide under the "IP".  So simply put ChefLeeZ waits to hear of the fix for this before incorporating already designed "IP" into our future GWD sites.

2)  When "IP" was used as its own index (Home) page it had all the re-sizing problems aforementioned otherwise it performed just fine as a home page.

3) Animation has to load before pages load,  So no animation until phone internet 3G speed (21Mbs) increases to at least that of wifi (54Mbs). Chef LeeZ recruited Kruzon to do these studies. Kruzon GWD website sports a HTML page with GWD automated animation.

4) Tests on this, our January 12 2014 site version, were built with a site content container 600 px wide with a left start of 200 px which left 200 px (2 inches) of white space to the left of the site page and 100 px+ to the right of the container which suggests we can safely increase all aspects of our site by 20% to 30% filling the whole page.

We do recommend you read our previous posts before taking on GWD for a full drive as it is believed it will save you a lot of learning curve time and provide you with proven work a-rounds as editing really sucks in this early beta version of GWD.

Happy WYSiWYGn  2014!

Chef LeeZ Google Web Designer GWD "Overflow: hidden"; can not cross empty page space hidden.

Chef LeeZ tests of the inclusion of an interstitial Ad as a Home Page by way of an Iframe has failed the mobile phone cross platform test and as a result the following is testing the inclusion of Text animation in our HTML home page. So far not acceptable!

This Google Web Designer GWD HTML5 web page is a test page for Thai Cooking Schools BKK. This page is set to start 150 px left, top 0px. The quick fix,untested at this time, may be to have page start left zero px as then there would then be no white space on the page for the NOT HIDDEN OVERFLOW TEXT to cross to the target position. Perhaps it can be set up thus and then moved back to 150 left px and perhaps then all will work, again this is just thinking out loud as it has not been tested by Chef LeeZ. What do you experts suggest?

We made the assumption of whats good for the goose must be good for the gander, right? Not so ... with GWD ...  as this page demonstrates. The following code (check it out, on the page:  right click >(select) view page source .. 3 items down from 1st head) ...  This code works in every interstitial ad test so far and does hide overflow text until its actually on the Ad (there is no white page space for it to travel across).

.gwd-page-wrapper {
	background-color: transparent;
	position: absolute;
	-webkit-transform: translateZ(0px);
	overflow: hidden;
	}

1) But doesn't work with HTML page as Chrome shows the overflow text. 030113 .. Tested and proven to work when text is brought in from the website top as there is no white space for the animated text to cross. See it live at http://ThaiCookingSchoolBKK.com.

2) There is No Pop up acceptance option in I E so ie does not offer to show the animated text, as in it's totally invisible.

Did we just simply miss something? I don't think so, but maybe. What do you experts suggest?

http://www.cookingschoolsintl.com/thaicookingschoolbkk/GWD%20Site/indexAnimNOAd.html.

The page as it should look following the animation designed in it is

 http://www.cookingschoolsintl.com/thaicookingschoolbkk/GWD%20Site/indexAnimNOAd.html

Thai Cooking School BKK current Google Web Designer GWD designed web site can be viewed at
http://ThaiCookingSchoolBKK.com.