Does jquery ID Selector (“#id”) behavior change depending on Access URL (by cID or name)?
Permalink 1 user found helpful
It seems to me that, when I invoke a javascript from C5 like this:
$('#Galleria').galleria({ data_source: data, height:600});
the code may or may not be executed. What I found is that it gets executed if the URL is like this:
http://beaupix.com/index.php?cID=60...
But the code does not get executed if accessed like this:
http://beaupix.com/headshot/styles/business-headshot/...
They both refer to the same page, and I confirmed that the generated HTML and javascript are identical. Furthermore, if I save the generated html file and put it on a server, it just works.
http://beaupix.com/ByName.html
Whether I'm logged in or not did not affect the results in all three cases. I've tried it with Safari, Chrome and Firefox with the same results.
Does anyone know why this happens, and how I can make the code be executed regardless of how it's accessed?
The question is related to the code that posted here:
http://www.concrete5.org/community/forums/customizing_c5/full-scree...
$('#Galleria').galleria({ data_source: data, height:600});
the code may or may not be executed. What I found is that it gets executed if the URL is like this:
http://beaupix.com/index.php?cID=60...
But the code does not get executed if accessed like this:
http://beaupix.com/headshot/styles/business-headshot/...
They both refer to the same page, and I confirmed that the generated HTML and javascript are identical. Furthermore, if I save the generated html file and put it on a server, it just works.
http://beaupix.com/ByName.html
Whether I'm logged in or not did not affect the results in all three cases. I've tried it with Safari, Chrome and Firefox with the same results.
Does anyone know why this happens, and how I can make the code be executed regardless of how it's accessed?
The question is related to the code that posted here:
http://www.concrete5.org/community/forums/customizing_c5/full-scree...
galleria-1.2.3.min.js isn't being found. Whatever method you are using to generate
It is not creating the correct url (view source and click on the url).
In the "working page" the url for this file is translated as
In the "non-working" it is
If galleria is in a directory off the root. Change the script tag to
<script src="galleria/galleria-1.2.3.min.js"></script>
It is not creating the correct url (view source and click on the url).
In the "working page" the url for this file is translated as
http://beaupix.com/galleria/galleria-1.2.3.min.js
In the "non-working" it is
http://beaupix.com/headshot/styles/business-headshot/galleria/galleria-1.2.3.min.js
If galleria is in a directory off the root. Change the script tag to
<script src="http://beaupix.com/galleria/galleria-1.2.3.min.js"></script>
Ah, I see -- actually, I think a similar but slightly more flexible solution would be to put your galleria javascript file in your theme's directory, then include it in the page like this:
<script src="<?php echo $this->getThemePath(); ?>/galleria-1.2.3.min.js"></script>
You can't switch themes and use it if you do that.
One related question. Is there an easy way to turn on/off loading of the javascript library so that it is loaded only on pages that use this galleria package? (Mostly to get better google speed rating on the site overall for SEO.)
If the gallery was built as a Block or Package it would do that automatically, but since it sounds like you've just hardcoded it into your theme, the only way to do it is if you know ahead of time which pages it will be used on and put a php "if" statement around the line that pulls in the javascript. For example:
(you'll need to find the Collection ID (aka "CID") of the page it's on and replace that where the "72" is in the code)
Not so bad if the gallery is only on one page, but if it's on lots of pages it's going to be difficult to do.
<?php if (Page::getCurrentPage->getCollectionID() == 72): ?> <script type="text/javascript" src="whatever.js"></script> <?php endif; ?>
(you'll need to find the Collection ID (aka "CID") of the page it's on and replace that where the "72" is in the code)
Not so bad if the gallery is only on one page, but if it's on lots of pages it's going to be difficult to do.
I see. Is there a tutorial on how I can put this code to make a block or package?
Eh, not really. I think there are one or two really simple how-to's in the documentation. Also you might want to check out the new Concrete5 book that was just published:
http://www.packtpub.com/concrete5-beginners-guide/book...
Another option would be to download the free "Galleria" addon in the marketplace and look at its code to see how they did it (although that one is a bit old at this point and I see lots of people complaining about how it doesn't always work perfectly).
If you're starting from scratch, it's going to take a decent amount of time to learn, so it might not be worth it just for this one thing (but if you're interested in learning for its own sake, this would be a good example to try to build).
http://www.packtpub.com/concrete5-beginners-guide/book...
Another option would be to download the free "Galleria" addon in the marketplace and look at its code to see how they did it (although that one is a bit old at this point and I see lots of people complaining about how it doesn't always work perfectly).
If you're starting from scratch, it's going to take a decent amount of time to learn, so it might not be worth it just for this one thing (but if you're interested in learning for its own sake, this would be a good example to try to build).
Thank you so much! This was exactly the source of the problem. This is the first time I wrote anything in PHP and javascript (and late at night), so my attention was away from such a basic point... Just inserting a leading '/' solved the problem.
I would check to make sure everything is being loaded by the page at both kinds of URL's -- use either Firebug (a free extension for Firefox) or the Web Inspector in Safari/Chrom, and click on the "Net" or "Network" pane, reload the page, and it will show you each individual asset and whether or not it's being loaded properly.