Editing Google New Sites web pages on iPad

Now Safari running on iPad OS 13 defaults to the desktop mode and not the mobile mode you can create and edit Google Sites provided you have internet connection. Currently I have iPad Pro 12.9 inch Version 3 (2018) model and I use it with external keyboard and mouse which greatly improves Google Sites editing.

There are a couple of strange behaviour with this setup though. 

• If you use Chrome browser on this iPad it does not let me edit Google Sites. 
  
  However Firefox on iPad works same as Safari.
  
   MS Edge on iPad defaults to mobile mode but you can switch to desktop mode by clicking on the 3 dots top right and select View desktop site. A warning from Google pops up saying this version of browser no longer supported but so far I can edit using it. 
  
  Incidentally you are suppose to be able to do this on Chrome but the View desktop site message is now missing
  
• If I am using the iPad without the keyboard, it can be difficult to edit the bottom of the page which can be hidden by the keyboard. This is not a problem when using external keyboard.
  
• If I want to move a block, say of text, when I touch the small rectangle of dots on the left of the block and attempt to drag it to another position it fails to respond.However if I use a mouse it works perfectly.
  
• The reverse is true if I try to resize a block, the mouse fails but the finger works.
  
  I am currently using a normal wireless mouse but have a Magic Mouse 2 being delivered tomorrow so will see if this works differently.

Note:

It has been ages since I used this blog so this post is also an experiment to see if I start using it again to accompany my revised www.photo-notes.co.uk site I am developing.

Hybrid Web Development

I go in circles trying to decide whether to use WCMS (definition below) or native code (HTML, CSS and JavaScript). I prefer using native code but worry that large sites would become unmaintainable unless I use tools such as PHP so that common code can be held in single files, but this adds more complexity.
Content Manages Sites I have used include Weebly and Google Sites. Both quite easy and powerful but then I worry about being at the mercy of a third party who could change or cease to provide the service but I do like the ease of having a web presence without having to deal with or pay an ISP (Internet Services Provider).

Hybrid approach

I like to combine the two approaches, using the CMS to provide menu which is then easily maintainable and provide internet services, but the bulk of the page is built in native HTML and CSS which can then be transferred to another environment if necessary.

CSS & JavaScript

When using a CMS site it is important to consider how much control you have over CSS and whether JavaScript and hence Jquery is supported. If so then you have a lot more control and capability to write the pages as you want.

Web Content Management System (WCMS)

I have lifted this definition from Wikipedia.

A web content management system (WCMS)is a software system that provides website authoring, collaboration, and administration tools designed to allow users with little knowledge of web programming languages or markup languages to create and manage website content with relative ease. A robust WCMS provides the foundation for collaboration, offering users the ability to manage documents and output for multiple author editing and participation. Most systems use a content repository or a database to store page content, metadata, and other information assets that might be needed by the system.

Back To Basics

I have decided to explore this approach in detail whilst developing Back To Basics web site using Weebly and record my progress on this blog.

Using Weebly with multiple writers developers

I have used Weebly for several years to create web sites but always been the only developer. However now a small team of us are going to work together to create a site and we needed a method to share photos that we may use on this site.

I did this by creating a second Weebly site just to act as a photo library, with large, medium and small versions of the photos.  These photos can then be included in the main site by referencing their URL. This video shows how to do this with various browsers.

Although written specifically for the team the method can easily be adopted by other groups.

Nerd flash 

Did you notice seamless switch from Mac to Internet Explorer on XP and back again. I had all browsers set up one behind the other plus IE running in Virtual Box XP machine, QuickTime screencast recorded the XP guest machine just fine. 

Recorded on iMac 21.5", Mountain Lion.

Using Google Viewer to display PDF Files in your Web Site

I have been developing a site that contains several large PDF files. I wanted to have a quality version of the file for downloading and a lower quality for online viewing. The online version is a lower quality so that delay is minimised.
In doing this I discovered a few things.

• You can use Acrobat X to produce reduced size version that will start display the first page without waiting for the whole file to be made ready.
• All the browsers handle this file differently, and some not at all

I am using Weebly to build the site, and the Pro version has a feature to display PDF files using the viewer Scribd. THis is OK but appears to be Adobe Flash based, and it does not work on IOS (iPhone, iPad) platform. Therefore I looked for another approach. I noticed in testing the Google Chrome browser is that it uses its own Google Docs Viewer. This facility can be used in your own web sites.
This is the page being developed within Weebly Pro.

I want the Alternative Viewer called by the ONLINE QUICK button to use the Google viewer.

First you need to upload the PDF to Weebly. To do this I use the standard Weebly features to create a button and link this button to my PDF.

The file I uploaded is named in the File on Your Website. Copy this filename. Publish this site using standard Weebly methods and navigate to the page.

Clicking on the button will open PDF file as shown below (this may look different depending on browser). The online filename is given in the browser navigation box. Copy this name.

You now need to open another tab in your browser and go to docs.google.com/viewer where you paste the address of the PDF in the first box. Click on Generate Link

You should now see the following screen. There are options to embed the code into a HTML page, but the option I use is Paste this link into email or IM: Copy the link.

Return to Weebly development page edit the button so that it now links to the address we copied previously.

Again, using standard Weebly controls publish the site and visit the page. Now when you click on the QUICK ONLINE button you should see the following Google Viewer version of the PDF, which in my case opens in a new tab.

Real Example

If you want to see this in action then please visit The Orange Tree Press site. This company sells high quality greetings cards, mainly of a religious nature.

Google Sites Horizontal Menu means more space

Jury still out to whether to use Google Sites or Weebly for quick web development plus hosting.

Just discovered that I can use horizontal menu when making web pages with Google Sites. Also you can turn off sidebar which means a lot more space can be used by your content. See my Photography site where I have reworked it using the above.

However I do worry that Google Sites is getting harder to find on Google Pages. Currently the only way I can find it is to go to G-Drive and then it appears in the more.. Tab.

DIY Weebly Menu Bar

I am exploring Weebly in fine detail and one of the things I wanted to do was add a link button. Now I know that site navigation is well catered for by Weebly in its templates. However occassionaly I want to have a navigation link button embedded in the article or as an extra menu bar at the end of the page.

To see how I did this visit Web-Dev

 

 

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