jQuery carousel plugin, cycle2, not working in joomla 2.5 website - joomla

I'm trying to set up the jquery carousel plugin, cycle2, in joomla 2.5. I want a straightforward responsive carousel which will autostart and just run thru a series of pics on a loop on the introductory page in a joomla base website. I tried cycle2 out in a single page localhost website and it works well. But in joomla, it's not working. I've installed the 3 js files, jquery.cycle2.js, jquery.cycle2.tile.js and carousel.js in the template javascript folder and listed them in the template index.php folder, as I have done with a lot of other jquery code which running without any problems, so I'm puzzled as to why cycle2 doesn't work. Also, firebug shows that the cycle2 js files are not being loaded. I can't figure out why this is so. This is the html segment from the joomla page:
<div id="carousel">
<div class="cycle-slideshow responsive" data-cycle-timeout = "3500" data-cycle-speed = "1000 data-cycle-fx="tileBlind" data-cycle-tile-count=17>
<img src="/templates/beez_20/images/carousel/siti_rs_1.png" >
<img src="/templates/beez_20/images/carousel/siti_rs_2.png" >
<img src="/templates/beez_20/images/carousel/siti_rs_3.png" >
<img src="/templates/beez_20/images/carousel/siti_rs_4.png" >
<img src="/templates/beez_20/images/carousel/siti_rs_5.png" >
</div>
</div>
Any help would be welcome.

Related

How to auto refresh a page on an embedded google form submit

Note upfront: I do not have any experience using scripts but only some basic HTML and PHP skills.
I would like a page on my google site to refresh automatically as soon as the embedded google form was submitted. This to instantly display the embedded and updated google form results after the button is clicked without the visitor having to reload the page manually. (like you would have for any online poll)
My form sheet is updating perfectly but I have not yet found an example or tutorial how to make a page refresh work for the google site with an embedded google form when the submit button is clicked. I hope someone can help me by providing an example on how to make this work. Preferably I would like to use an embedded google form rather than having to create a separate PHP form loading into google forms what could be an alternative. Thanks.
Below the HTML as I can see it on my Google page. I would need a trigger I guess from these embedded forms to refresh the page on submit. I just have no idea on how to get this done.
<div>
<div style="text-align:left">
<div><img src="https://www.google.com/chart?chc=sites&cht=d&chdp=sites&chl=%5B%5BSpreadsheet+form'%3D20'f%5Cv'a%5C%3D0'10'%3D499'0'dim'%5Cbox1'b%5CF6F6F6'fC%5CF6F6F6'eC%5C0'sk'%5C%5B%22test+int+sheet%22'%5D'a%5CV%5C%3D12'f%5C%5DV%5Cta%5C%3D10'%3D0'%3D500'%3D397'dim'%5C%3D10'%3D10'%3D500'%3D397'vdim'%5Cbox1'b%5Cva%5CF6F6F6'fC%5CC8C8C8'eC%5C'a%5C%5Do%5CLauto'f%5C&sig=5VZGSIULBu8sSdf833qiLWVDcx8" data-origsrc="1VACx4d2pJEZlvAezbO9Gnh_nX3nIPwSJ4iCNjEmCiUM" data-type="spreadsheet-form" data-props="align:center;borderTitle:test int sheet;doctype:freebird;height:400;objectTitle:test int sheet;showBorder:false;showBorderTitle:false;wrap:false;" width="500" height="400" style="display:block;margin:5px auto;text-align:center;"></div>
<br>
</div>
<div style="text-align:left"><img src="https://www.google.com/chart?chc=sites&cht=d&chdp=sites&chl=%5B%5BGoogle+Gadget'%3D20'f%5Cv'a%5C%3D0'10'%3D499'0'dim'%5Cbox1'b%5CF6F6F6'fC%5CF6F6F6'eC%5C0'sk'%5C%5B%22Include+gadget+(iframe)%22'%5D'a%5CV%5C%3D12'f%5C%5DV%5Cta%5C%3D10'%3D0'%3D500'%3D397'dim'%5C%3D10'%3D10'%3D500'%3D397'vdim'%5Cbox1'b%5Cva%5CF6F6F6'fC%5CC8C8C8'eC%5C'a%5C%5Do%5CLauto'f%5C&sig=t6_Deqv8rgMQCB28aqz1n9MoVTU" data-igsrc="http://164.gmodules.com/ig/ifr?mid=164&synd=trogedit&url=http%3A%2F%2Fhosting.gmodules.com%2Fig%2Fgadgets%2Ffile%2F106581606564100174314%2Fiframe.xml&up_iframeURL=https%3A%2F%2Fdocs.google.com%2Fspreadsheets%2Fd%2F1g2cGeavUciTy6po7_DXPXMNqC1fqTTROHRoTnsafFfM%2Fpubhtml%3Fgid%3D754672963%26single%3Dtrue&up_scroll=no&h=400&w=100%25" data-type="ggs-gadget" data-props="align:center;borderTitle:Include gadget (iframe);height:400;igsrc:http#58//164.gmodules.com/ig/ifr?mid=164&synd=trogedit&url=http%3A%2F%2Fhosting.gmodules.com%2Fig%2Fgadgets%2Ffile%2F106581606564100174314%2Fiframe.xml&up_iframeURL=https%3A%2F%2Fdocs.google.com%2Fspreadsheets%2Fd%2F1g2cGeavUciTy6po7_DXPXMNqC1fqTTROHRoTnsafFfM%2Fpubhtml%3Fgid%3D754672963%26single%3Dtrue&up_scroll=no&h=400&w=100%25;mid:164;scrolling:no;showBorder:false;showBorderTitle:null;spec:http#58//hosting.gmodules.com/ig/gadgets/file/106581606564100174314/iframe.xml;up_iframeURL:https#58//docs.google.com/spreadsheets/d/1g2cGeavUciTy6po7_DXPXMNqC1fqTTROHRoTnsafFfM/pubhtml?gid=754672963&single=true;up_scroll:no;view:default;width:100%;wrap:false;" width="500" height="400" style="display:block;margin:5px auto;text-align:center;" class="igm"></div>
<div style="text-align:left"><br>
</div>
<div style="text-align:center">
<div></div>
<br>
</div>
<div style="text-align:left">
<div style="text-align:center"><br>
</div>
<div style="text-align:center"><br>
</div>
<br>
</div>
</div>
I'm sorry to be the annunciator of a such bad news but that's impossible.
As your code show, you are actually using a google Site to display your google form. The line:
<img src="https://www.google.com/chart?chc=sites&cht=d&...
IS the way google tell you there is a google form in this page when you hit the button to get the source code.
In other words: google don't let you put whatever you want in a google site. It's impossible to add some JS code that will be fired when the user submit the form.
Even if you host your form in something else than a google Site, you won't have this ability, as the form himself will be displayed in an iframe that can't be modified by external scripts.
This is an hard limitation of Google Form, the only workaround that you may use is to write to the user in the confirmation message of the form that he now need to reload the page or go to an other link.

J1.5 - How to add image button into joomla article

I am trying to add the images as button into existing article of web page. When I click on that button it have to redirect into another page or Url.
I have searched on net. I didn't get satisfied response.
I have gone through this page too.
Any help will be appreciated!!!
Actually, I have added the button using edit code option in joomla article, by inserting the following html code.
<a rel="nofollow" href="link_to_be_opened_on_image_click" class="weblink" style="text-decoration:none">
<img border="0" src="source_of_the_image_button.png" alt="Title" title="Title" />
</a>

How do I reference a local file properly?

I'm running Wordpress on WAMP right now and I'm trying to figure out how to correctly reference an image that i'm using in my header for all my pages.
If I write this:
<img src="wp-content/themes/my-theme/images/SSBlogoALPHA.png">
the logo shows up on the WP homepage, but not on any subsequent pages.
If I write
<img src="../wp-content/themes/my-theme/images/SSBlogoALPHA.png">
the logo shows up on all subsequent pages, but not the homepage.
to be honest I don't know what the "../" does or where my root folder is supposed to be when writing a directory path but these are the ways that i've seen other people do this. Any ideas? Thanks!
you can get the images by following way
<img src="<?php bloginfo('template_directory'); ?>/images/SSBlogoALPHA.png" alt=""/>

AJAX Wordpress Site with Difficult URL settings

On this WordPress theme utilizing AJAX, proves to be difficult. The developer of the theme cannot seem to find the issue or solution to it.
This site runs beautifully, if, and only IF, you type is this complete URL "http://www.geigerandwood.com/#!//" if you type in the .com site alone, it will appear but will be disfunctional.
I have made attempts in 301 redirects, even creating a static page with a redirect but still no luck. Is there something that I can add or change in the code to make this work properly?
FYI - it has been tested on the common web browsers on both OSX & Windows.
Here is a video of my presented issue. http://www.screenr.com/D1G8
What theme do you use?
My quick examination of your page source code is that I only can find something related to the #!// is in here
<div id="contentBoxScroll">
<a id="closeButton" href="#!//"></a>
<div class="dragcontainer">
<div id="contentBoxScrollDragger" class="dragger">
<div class="scroll_up"></div>
<div class="scroll_down"></div>
</div>
</div>
</div>
I assume it must be something inside the script from which that HTML is generated. I can say more since I can't see the full source.

Using plugin outside of Wordpress pages

I am trying to use lightbox plus plugin for Wordpress which works fine for most of my site.
I have a php page which is used by a jQuery AJAX function to retrieve data in order to paginate a large result set back in wordpress. This page is not part of wordpress.
I have managed to get Wordpress functions to work fine in this php page by using:
define('WP_USE_THEMES', false);
require('/home/love/public_html/dev/wp-blog-header.php');
require('/home/love/public_html/dev/wp-load.php');
However, in this page is an include, and within the included file is a link to an external sheet which is meant to be brought in with a lighbox:
<a class="" rel="lightbox" href="<?php bloginfo('url'); ?>/more-product-info?a=<?php echo $post->ID ?>">
<div id="moreprodinfo">More Info</div>
</a>
This method of retrieving information in a lighbox works ok on most parts of my site, but its just not working on the part that uses AJAX to retrieve the link to the lighbox page.
I assumed it was something to do with plugins not working when the page is not part of Wordpress, but all the Wordpress function have been working so why not plugins? Also my cufon plugin doesnt work on this ajax retrieved page either.
Is it becuase I am using .html javascript function to display the content retrieved by AJAX:
if(pageType == 'prizeHome'){
loading_hide();
$("#tab-prize-home #container").html(msg);
Any help would be appreciated
It looks like a common issue when using ajax to load html content :
You probably call lightbox and cufon when document is ready, which happens only once before your ajax call. You have to call again lightbox and cufon after your ajax call.

Resources