Can I embed a masonry jquery template into my joom

I want to create a video gallery using Masonry on my website but I'm having difficulty.

I'm using Joomla as my CMS and already have a template im using from rocket themes but on one of my pages I want to have a list of videos (which I'll update) for people to watch. I want to make it visually appealing and masonry caught my eye but I fail to understand how to get it up and running.

How does Jquery work with Joomla, if it does at all?

回答1:

The masonry plugin let you define a grid with images inside a container. Then it uses a kd-tree algorithm to sort the images in the most efficient way. The algorithm is well know for example from graphical disk space usage where the biggest file gets the biggest rectangle on the screen. A kd-tree is also good to add some spatial information. Hence if you can include the masonry js library and dynamically pick a selection of your videos from the database and wrap it in a css layout into a joomla template I don't see any problem.

回答2:

As far as what to do about getting jquery and masonry into Joomla 2.5, I just did it, so perhaps this narrative will assist. Please forgive that it is 1st-person. I had loaded jquery some weeks ago and was using it on various sites. But I needed to use a masonry routine on one of them. I tried desandro masonry, freetile and isotope, as well as some others. While jQuery has been working fine in Joomla for me, no masonry routine worked at all, zero success. So I made a raw html template, loaded all of the above and found they worked there just fine, to my surprise. Encouraged, I went back to Joomla, installed the 'jQuery Easy' plugin and enabled it. It loads up the jQuery that is needed, it really takes care of strange conflicts with the namespace, and prevents duplicate instances. However, I should warn you that with jQuery Easy, the jQueryUI will not load at this time. You have to put '2' into the subversion in the plugin setup, for the current version of 1.9.2. I don't think you need to have this for masonry, but I put it in anyway because I have other routines. While desandro masonry and isotope both worked in Joomla for me in my tests, I had decided on Isotope as the most workable for my purposes, so I went that direction. Therefore I downloaded the library and put it into /js on my web root. I then inserted these lines into the default template inside the header:
< script type="text/javascript" src="/js/jquery.isotope.js" >< /script >
(When you do it, look at page source, click on the jQuery, JQueryUI and Isotope links to make sure they actually exist as shown.)
Then I installed the 'Flexi Custom Code' module into Joomla and entered code like this as I recall it:
< script >jQuery('#container').isotope();< /script >
My list of images was just some divs contained by < div id="container" > in an article. I loaded the Flexi module into the article using 'loadposition'. You can load Isotope into an article or into a module, it makes no difference. I have made my init routine more complex since then, it still is working. For you there are lots of examples on jsfiddle to use but be sure to change all the '$(' to 'jQuery(' or the routines will cause really strange conflicts within Joomla. I am not as technical as these other truly amazing folk on Stackoverflow but I sincerely hope this story helps out, and saves you all the lost time that the adventure costed me, and hopefully someone will add further explanations.