responsive images about film_roll HOT 17 CLOSED

"The only dumb questions are the ones you don't ask." No worries.

I would bet a javascript error is being thrown and the FilmRoll process isn't happening. You're seeing the gallery without the right styling and/or wrapping divs.

I can't get to that page with my iphone. It keeps redirecting it to a missing mobile page: m.home.html. Can you copy index.html to m.home.html? I'll see what I can do.

For mobile errors, on a Mac you can use Safari to remotely debug iOS Safari on a phone:
http://moduscreate.com/enable-remote-web-inspector-in-ios-6/
Then you can use the console to see errors. I realize that may be too much to ask for you at this point!

from film_roll.

Hi Noel,
thanks for the response.

The site is hosted by Weebly so I don't have full access to the file structure.

It's interesting that the site is going to 404 for you too ( now it says too many redirects ). I thought that it was just me and reset my iphone to to clear the cache.( Lost all my contacts - doh )

The film roll appears perfectly on the desktop version of the site but just doesn't translate to the mobile version. It must be something at Weebly's end.

I'm going to contact them to find out why it automatically defaults to m.home.html now when it worked before. You can still get to the site on a mobile by putting /gallery.html but if you click Home in the navigation it throws a 404 again. You can choose the desktop version whilst on gallery.html from the button at the footer at least to see the desktop version working.

I'll let you know as soon as I can get Weebly to reset it.

Thanks again,

Neil.

PS. My iphone is still on iOS5 as it is a G3s sadly and I didn't want to upgrade as I had heard of issues on the old hardware.

On 16 Jun 2014, at 15:26, Noel Peden wrote:

"The only dumb questions are the ones you don't ask." No worries.

I would bet a javascript error is being thrown and the FilmRoll process isn't happening. You're seeing the gallery without the right styling and/or wrapping divs.

I can't get to that page with my iphone. It keeps redirecting it to a missing mobile page: m.home.html. Can you copy index.html to m.home.html? I'll see what I can do.

For mobile errors, on a Mac you can use Safari to remotely debug iOS Safari on a phone:
http://moduscreate.com/enable-remote-web-inspector-in-ios-6/
Then you can use the console to see errors. I realize that may be too much to ask for you at this point!

—
Reply to this email directly or view it on GitHub.

from film_roll.

It looks like /gallery.html is a different page, and doesn't have the markup/FilmRoll content. If I display it on a desktop browser, I get the same grid content, and no film roll content (not even hidden.) I presume that wasn't what you saw originally?

If you can get the FilmFoll content on the gallery page, then I can check that it is ok for sure. Let me know.

from film_roll.

I just created my own weebly site. Which element are you trying to use? Did you use embed code?

from film_roll.

Yes. I put it in an embed widget, uploaded the photos to the files section in edit html&css section of Design page. The path for the images is files/theme/something.jpg.

On the home page I put the script in the Page Layout I used for the Home page after the container div.

Sorry the message was misleading before. The film roll is on the home page and should work fine on a desktop browser with the original URL. I lead you to the gallery page to so that you could select the web version to be delivered to the iphone. Didn't think you had access to a desktop at present.

Cheers, Neil.

On 17 Jun 2014, at 00:11, Noel Peden wrote:

I just created my own weebly site. Which element are you trying to use? Did you use embed code?

—
Reply to this email directly or view it on GitHub.

from film_roll.

I'm an idiot !

I also put a redirect script I found on the internet into the header to see if it would call a mobile page m.home.html( I did that hours before so forgot that I had done it ). I've removed that now so the original url goes to the mobile version on the home page again now on an iphone so you can see the results on my site.

It does still stack the images and not show the film roll. Perhaps Weebly restrict it in some way so that you can only use their slideshows?

On 17 Jun 2014, at 00:11, Noel Peden wrote:

I just created my own weebly site. Which element are you trying to use? Did you use embed code?

—
Reply to this email directly or view it on GitHub.

from film_roll.

The other weird thing is that, when you are in 'edit html & css' mode of the design tab it appears perfectly in the preview below the code section yet when you save and return to the straight design tab it appears as a row of question marks on top of each other. It does display correctly live on a browser though.

If it will work on their mobile pages they should licence this from you as it would give them a good marketing angle against the more expensive 'online photographer's website design' companies. They use their own versions of other open source galleries etc. Notably their slideshow is a variation of the Nivo one.

You deserve some recompense for your hard work too.

N.

On 17 Jun 2014, at 00:11, Noel Peden wrote:

I just created my own weebly site. Which element are you trying to use? Did you use embed code?

—
Reply to this email directly or view it on GitHub.

from film_roll.

@punter2k9 Neil, I will get to this today. Just haven't had time yet.

from film_roll.

@punter2k9 I've had a look at the pages. On the mobile version the script is not being called. It appears the mobile page is using a different layout. The surrounding code is not the same.

Some questions:

• Is the code to new FilmRoll in the 'embedded code' for the gallery, or did you make another embedded code element?
• If it is separate, did you add it to the mobile view?

If you did add it, then something on the weebly end of things is wiping it out.

Incidentally, if it is separate, you don't have to separate the call to new FilmRoll from the html for the gallery.

Let me know if this helps you out.

from film_roll.

Hi Noel,
Thanks for your time on this.

Once again, I apologise if I have misled you. There is only one instance of the film_roll and it is on the home(index) page. I mentioned the gallery page just so that you might be able to get onto the mobile site and switch it to the web version to see how the desktop pages displayed when we couldn't access them 'cos the redirect was still in place.

I'm almost certain that Weebly are removing it before they serve the mobile pages. They have a Mobile editor but it is not a true one, it is more like a viewer. If you change something on the mobile editor it updates the same way on the desktop version. I have no access to the mobile html pages, only some access to the html page layouts that they provide or I create for the desktop version. I don't even know what they call the mobile pages.

I believe that it is probably so that one is obliged to use their slideshows and galleries. Header slideshows are a premium offer with Weebly so they are possibly refusing to show embedded html on the mobile version to encourage people to upgrade. Perhaps it is a security issue.

In answer to your questions : I have tried the code for 'new FilmRoll'

1- in the body of the html layout page below the film_roll div.
2- below the film_roll div in the embedded code element.
3- in both the Footer and Header boxes available in the 'Advanced settings' section of the Pages Tab for the Home page.

Each time one can see the filmroll working as long as one is in the code editor view accessed through the Design Tab but it doesn't show in the regular view.
They all work in the published desktop version but stack the images vertically in the mobile version.

If I put the script directly into the section of the page layout html then the images stack in the desktop version too.

I'm sure you are losing the will to live after all this so I will understand if you have much more important things to do now. I have approached Weebly for their explanation but have not heard anything back yet. It may take a while. I will let you know what they say.

Thanks again,

Neil.

On 18 Jun 2014, at 17:29, Noel Peden wrote:

@punter2k9 I've had a look at the pages. On the mobile version the script is not being called. It appears the mobile page is using a different layout. The surrounding code is not the same.

Some questions:

Is the code to new FilmRoll in the 'embedded code' for the gallery, or did you make another embedded code element?
If it is separate, did you add it to the mobile view?
If you did add it, then something on the weebly end of things is wiping it out.

Incidentally, if it is separate, you don't have to separate the call to new FilmRoll from the html for the gallery.

Let me know if this helps you out.

—
Reply to this email directly or view it on GitHub.

from film_roll.

Ha! I've not lost the will to live yet! I'm happy to help you out. I'll spend some time when I can and try it out myself.

Let me know what they say. It does indeed look like they are removing the code for the mobile page.

from film_roll.

Hi Noel,

Well it looks like it won't be solved unfortunately. This is the response from Weebly.

Questions? We'd love to chat!
Aditya G: Hello, Unfortunately, we're not able to provide case by case solutions for custom HTML problems and questions, due to the wide range of uses and associated problems.
Aditya G: We don't have a feature to disable mobile view only for a single page, you'll have to do it for the site as a whole

I still think they should license yours as their galleries and slideshows are showing their age these days.

Best regards,

Neil.

On 19 Jun 2014, at 13:37, Noel Peden wrote:

Ha! I've not lost the will to live yet! I'm happy to help you out. I'll spend some time when I can and try it out myself.

Let me know what they say. It does indeed look like they are removing the code for the mobile page.

—
Reply to this email directly or view it on GitHub.

from film_roll.

Let me give it a shot. Then we can give up. :P

from film_roll.

It turns out it works in iOS on Chrome. But not Safari. Curious. Also, the javascript is running. The CSS style is missing on Safari.

Some possibilities:

• Don't include jQuery link in the embedded code block. jQuery is already included in the header.
• You pass the parameter nocss: true, and the FilmRoll CSS is inside main_style.css for the desktop version, but not for the mobile version. This is why it isn't working. Why Chrome gets the style and Safari doesn't is beyond me. If fixing jQuery doesn't change it, try pasting the CSS into the top of the embedded code block. It doesn't strictly need to be in the header.

Let me know if these do anything.

from film_roll.

If you paste the CSS into the code block, put it inside <style></style> tags.

from film_roll.

You are a genius !

I had to keep the jQuery link in the embedded code block or the whole thing broke in both desktop and mobile. Possibly because the library in the header is 1.7.2.

After pasting the CSS in the embedded code block between the style tags and before the html it works in mobile too. Fantastic.

I couldn't get Chrome for my iphone as it is a 3Gs and still running ios5.

I asked a friend who is running ios6 on a 4s to check it and she said it is running smoothly ion Safari. On my 3Gs it is running, but a bit like an earthquake, the whole page shakes as it scrolls. I imagine this is 'cos of the old OS and browser and most people will be more technologically ahead than I am though.

One point of interest - on the mobile version the image size is determined by the width and not the height so the landscape format photos are smaller in portrait orientation and the portrait photos are cropped (only visually, you can swipe up and down to see them) in horizontal orientation.

On my 3Gs I've tidied everything up again by including

@media only screen
and (max-device-width : 320px) {
#film_roll a img {
max-height: 300px;
} }

in the CSS. I will have to look into the other screen sizes.

Once again, thank you very much for the time and effort on this. It is very much appreciated.

Cheers, Neil.

On 20 Jun 2014, at 17:56, Noel Peden wrote:

If you paste the CSS into the code block, put it inside <style></style> tags.

—
Reply to this email directly or view it on GitHub.

from film_roll.

Glad it worked!

A rule of thumb is that the plugin will measure each image in its unstyled state, and freeze them at that width. So by setting the max-height you forced them all to be the same height, and the plugin keeps them as it finds them. I'll add something in the README to that effect.

from film_roll.