Topic: gallery embedded into html page not displaying correctly

I have just uploaded my new site and embedded a gallery following the instructions. I am using Rapidweaver and used an html stack to embed the code.

The problem is that the main image is minute and doesn't fill the page as it should. The thumbnails are ok. The title of the gallery is also displaced and not correct.

Ive copied the code exactly and made sure everything is correct. The only change I have made is to rename my html index.html file because I presume it would conflict with the sv gallery index file.

Link for the page.
http://www.pictureperfectphotographysto … logan.html
Can anyone please advise what the error is?

nb, going full screen works fine, so there is a problem with the embed I think.

Last edited by Philn67 (2012-11-15 19:37:22)

Re: gallery embedded into html page not displaying correctly

Please see this FAQ:
My gallery does not show in Firefox or gets cropped to a small height. Why?

A quick fix might be to simply define your gallery's height as an absolute pixel value rather than as a percentage.
Try changing:

simpleviewer.load("sv-container", "100%", "100%", "FFFFFF", true);

... to something like:

simpleviewer.load("sv-container", "100%", "600", "FFFFFF", true);
Steven Speirs
SimpleViewer Support Team.

Re: gallery embedded into html page not displaying correctly

Hi Steven

Thanks for the reply. Ok I have tried that changing 100% to 1000, and it works fine on a pc, however there are erratic behaviours on mobile devices.

On a mobile (iPhone) thumbs are displayed but no main image, select a thumb and its displayed off the right of the screen, barely visible. Navigate with the arrows (swipe is not available) and it seems the centre of the screen is the border between two images, so one is oof green to the left, another to the right. It works as expected full screen, but exiting full screen returns back to images not being fully visible.

On a larger mobile device (iPad), all thumbs are displayed with a large space at the top and no main image. Select an image and the same error with images being off to the edge of the screen (pin other words not centred) occurs. Full screen works as expected but there is a browser page title "simple viewer gallery".

Can you please advise a fix for mobile devices?

Thanks

Re: gallery embedded into html page not displaying correctly

Ok I have tried that changing 100% to 1000, and it works fine on a pc

Your original problem stems from having defined your gallery's height as a percentage.
As the FAQ I linked to above suggests, when using percentage heights, you should check that all parent containers of your gallery (up to and including the 'body' and 'html' tags) have heights specified via CSS. (SimpleViewer needs to know that its height is 100% of something.) Also, when using percentage heights, please see the Using Percentage Heights section of the 'SimpleViewer Embedding Guide'.
If 1000px is too great a value when your gallery is displayed on a mobile device, then you could revert to using a percentage but you would need to check your web page's CSS as above.

On a mobile (iPhone) thumbs are displayed but no main image

Please see these FAQs:
When I view my gallery I see a grid of thumbnails, not the layout I specified. Why?
The mobile player layout does not match the Flash player layout. Why not?

however there are erratic behaviours on mobile devices.

The remaining issues you refer to are due to a conflict between the CSS on your web page and that of the SimpleViewer Mobile Player gallery.
You web page uses several external CSS style sheets and within that code there may be some generalized CSS which applies to all divs or images on the page (including those in your SimpleViewer Mobile Player gallery).
It looks like there is some generalized CSS which might be causing the problem in your 'consolidated-all-10.css' file.
However, looking at the code (which has been compressed and does not contain line breaks), it might be difficult to track down and eliminate the problem (by applying the generalized CSS to only those elements on your web page that require it through use of ids and classes).
One way to isolate your gallery from the rest of your web page would be to embed your gallery in an iframe as documented as Option #2 on this web page.

Steven Speirs
SimpleViewer Support Team.

Re: gallery embedded into html page not displaying correctly

Hi Steven

Ok I think I understand. From what you say I need to investigate the css of my pages.

I have already tried an iframe, but as you already point out in the documentation the full screen is disabled, so thats not really an option.

Could you tell me how I remove the 'simple viewer gallery' text? This is only displayed full screen on an iPad, but Ive seen on the forum references to editing the 'title' in the gallery.xml file. The title in the file is the title I have chosen, so I can't see where that is coming from? Im using a licensed version of sv pro, and I can't find any options in there either?

Last edited by Philn67 (2012-11-16 17:33:15)

Re: gallery embedded into html page not displaying correctly

Could you tell me how I remove the 'simple viewer gallery' text? This is only displayed full screen on an iPad

Edit the 'svcore/full.html' file in a plain text editor and change the text between the <title></title> tags on line 5.

Steven Speirs
SimpleViewer Support Team.

Re: gallery embedded into html page not displaying correctly

sorry to keep bothering you....if I open the file on a mac using TextEdit, there is no content and the title is 'full.html-locked'. But if I right click and get info, the locked field isn't selected?

Re: gallery embedded into html page not displaying correctly

The 'full.html' file is simply a text file with a .html extension and can be opened in any text editor.
Make sure that the file is not open in any other application (for example, make sure that the gallery is not open in a browser) before attempting to edit it.

Steven Speirs
SimpleViewer Support Team.

Re: gallery embedded into html page not displaying correctly

Thanks Steven
Still problems, its something to do with apples permissions, but even when I make sure permissions are set its still locked. If I open, save a copy, its then unlocked, but shows no text. If I check properties whilst open in texedit, I see the Title, which I can rename to the same as the gallery title. Once Ive saved it, uploaded it, I then get the correct title, but no content displayed. Ive tried deleting and uploading the entire gallery folder contents but still the same, so Im back to having "simple viewer gallery' shown as a title, but this is only on mobile devices.

Even if I figure this out, it means I will have to do the same every time I so much as make an edit and resave it? I don't understand this, why is there not an option to disable this or select a title? I understand if its the free version, but for the paid pro version surely this should not be the case?

Re: gallery embedded into html page not displaying correctly

As I mentioned, the 'full.html' file is no more than a simple text file with an .html file extension.
Make sure, when editing the file, that the content is being displayed as plain text.

I don't understand this, why is there not an option to disable this or select a title? I understand if its the free version, but for the paid pro version surely this should not be the case?

I have contacted the developers with the suggestion that either the gallery title or the parent page's browser <title> be used for the browser <title> in fullscreen mode when the Mobile Player is used to display the gallery.
However, I do not know if or when this may be implemented in a future version.

Steven Speirs
SimpleViewer Support Team.

Re: gallery embedded into html page not displaying correctly

Hi Steven

Any updates on this browser title issue yet? Its proving to be a real pain, if I add one image I then have to go and edit the title again because its overwritten, I really do feel that when a paid version is used without any branding, having this just isn't acceptable. Its a simple fix for the developers, its probably an oversight but it needs addressing.

Re: gallery embedded into html page not displaying correctly

As noted, I have contacted the developers regarding this issue and hopefully it will be addressed in the next version of SimpleViewer-Pro (though I do not know when this will be).
In the meantime, you could edit the 'svBuilder-Pro/template/svcore/full.html' file in a plain text editor and remove the 'SimpleViewer Gallery' text from the <title> tag. I realise that this would not substitute the text with the gallery's own title but it would at least remove the branding.

Steven Speirs
SimpleViewer Support Team.