0

I'm trying to get a Galleria slideshow up and running in my rails app. It works fine with the local server (on both Chrome and Firefox) but does not work on the live server (on either Chrome or Firefox). In Chrome, the slideshow flashes briefly (maybe .25 seconds?) upon loading before going away. In Firefox, it just never shows up at all. When I look at what is happening with inspect element on Chrome, under the network tab, it says that galleria.classic.css was canceled due to a 404 error.

I have the following code in my app: (note, originally, I had other code on the page, but I pulled the slideshow to an admin-only page so I could examine it live without messing up the client-facing stuff so that's all that's on the page. It didn't work either on the client-facing page or the admin page.

In the view:

<head><link rel="stylesheet" type="text/css" href="assets/libs/galleria/themes/classic/galleria.classic.css"></head>
<body>
  <div id="slideshow">
    <div id="galleria">
        <%= image_tag("pic1_url")%>
        <%= image_tag("pic2_url")%>
        <%= image_tag("pic3_url")%>
    </div>
    <script>
        $('#galleria').galleria();
    </script>
  </div>
</body>

In my application.css stylesheet, I have:

 *= require_self
 *= require galleria/themes/classic/galleria.classic
 *= require_tree .
 */

In my application.js file, I have:

//= require jquery
//= require jquery_ujs
//= require jquery_nested_form
//= require galleria/galleria-1.2.9.min
//= require galleria/themes/classic/galleria.classic
//= require_tree .

Fixes I've tried:

How can I get Galleria to work?

Community
  • 1
  • 1
ctaymor
  • 175
  • 1
  • 13

1 Answers1

0

When you deploy your file to production it compile and collect all your assets in one folder called assets, so specified paths doesn't work, because there is no galleria/themes/classic/ path on Heroku server or other server, which you're using.

So, you need to specify path in HTML file like this href="assets/galleria.classic.css" if it is necessary.

But in fact your

*= require galleria/themes/classic/galleria.classic

and

//= require galleria/galleria-1.2.9.min
//= require galleria/themes/classic/galleria.classic

has already done it, and all the necessary code must be in your compiled .css and .js files. So, you can just remove <link rel...> part from your code.

P.S. I'm trying to avoid subfolders in css, javascripts and images folders, because it can often cause such problems like yours, and also it's make app structure more clear. But to do so, you need to check plugin files, if they have any specified paths to each other, and remove any /folder/subfolder/ part of them, left only filenames.

Peter Tretyakov
  • 3,380
  • 6
  • 38
  • 54
  • So I need to specify the path for the local server, and not specify the path in the production version? That doesn't make a lot of sense. I'm not sure how to do that either. – ctaymor Jul 11 '13 at 00:15
  • Do you really need to hardcode `` in your html file? If you have added it to your `application` files, they are already compiled in development and production. Also check that `config.assets.initialize_on_precompile` is `false` if you're using heroku. – Peter Tretyakov Jul 11 '13 at 16:34
  • Thanks. The client just scrapped having a slideshow at all for aesthetic purposes, they decided they wanted a lightbox type pop up when people click on pictures instead. I'm still learning a lot about the pipeline. Next time, I'll know I don't need to add the stylesheet at the top and through the asset pipeline. Thanks. – ctaymor Jul 11 '13 at 17:39
  • No problem. Glad, if my advices were useful (: – Peter Tretyakov Jul 11 '13 at 18:26