CiviCRM Community Forums (archive)

After extensive testing and hair pulling out-ing, I've figured out that there seems to be some sort of template incompatibility with CiviCRM and recent shape5 templates. On my first site ALL CC fields disappeared...on my recent site, they disappeared from just internet explorer.

Can someone please point me in the right direction as to why this would happen with Shape 5 templates when I can switch to a Rockettheme and the fields come back (although on my first site, switching did not fix the problem).

https://mudministry.org/component/civicrm/?task=civicrm/contribute/transact&reset=1&id=5

Hello,

This is something that CivicCRM would need to correct for you, we cannot debug a third party component. There's nothing in a template that should effect the layout and present fields of a component like this. It looks like they are using javascript to close and open different divs at the bottom of the page depending on which payment option they select, there is most likely a javascript issue in their component. I can see that they are calling  a ton of calls to jquery files in your site's source, and none of them are being called correctly. Whenever jquery is called it must be called in no-conflict mode so that it doesn't interfere with other javascript on the page; they are not doing this. This is most likely the issue, and again they would need to correct this for you.

Like I said there is a huge of js calls by this component:


  <script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/jquery.min.js"></script>
<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/jquery-ui-1.8.16/js/jquery-ui-1.8.16.custom.min.js"></script>
<style type="text/css">@import url("/administrator/components/com_civicrm/civicrm/packages/jquery/jquery-ui-1.8.16/css/smoothness/jquery-ui-1.8.16.custom.css");</style>

<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery.autocomplete.js"></script>
<style type="text/css">@import url("/administrator/components/com_civicrm/civicrm/packages/jquery/css/jquery.autocomplete.css");</style>

<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jstree/jquery.jstree.js"></script>
<style type="text/css">@import url("/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jstree/themes/default/jstree.css");</style>

<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery.menu.pack.js"></script>
<style type="text/css">@import url("/administrator/components/com_civicrm/civicrm/packages/jquery/css/menu.css");</style>

<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery.chainedSelects.js"></script>

<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery.contextMenu.js"></script>
<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery.tableHeader.js"></script>

<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery.textarearesizer.js"></script>

<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery.form.js"></script>

<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery.tokeninput.js"></script>
<style type="text/css">@import url("/administrator/components/com_civicrm/civicrm/packages/jquery/css/token-input-facebook.css");</style>

<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery.timeentry.pack.js"></script>
<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery.mousewheel.pack.js"></script>

<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery.toolTip.js"></script>

<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/DataTables/media/js/jquery.dataTables.min.js"></script>
<style type="text/css">@import url("/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/DataTables/media/css/demo_table_jui.css");</style>

<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery.dashboard.js"></script>
<style type="text/css">@import url("/administrator/components/com_civicrm/civicrm/packages/jquery/css/dashboard.css");</style>

<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery.FormNavigate.js"></script>

<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery.validate.js"></script>
<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery.civicrm-validate.js"></script>
<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery.ui.datepicker.validation.pack.js"></script>

<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery-fieldselection.js"></script>

<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery.jeditable.mini.js"></script>
<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery.mustache.js"></script>

<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/packages/jquery/plugins/jquery.blockUI.js"></script>

<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/js/rest.js"></script>
<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/js/Common.js"></script>

<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/js/jquery/jquery.crmeditable.js"></script>
<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/js/jquery/jquery.crmaccordions.js"></script>
<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/js/jquery/jquery.crmasmselect.js"></script>
<script type="text/javascript" src="/administrator/components/com_civicrm/civicrm/js/jquery/jquery.crmtooltip.js"></script>


I have doing this a long time and I have never seen a component call anywhere near that many js and css files. It's going to slow your site down because of all the connections to your server, and it has a very large chance for problems with that many js files.

Mike
------------
Shape 5 Team

I don't see anything...I'd love to know if there is something

mudmin --
in response to Shape5's comments --

1) jquery *is* called in no conflict mode.
2) the "long list" is because we use a number of jquery plugins, which is not unusual. jquery is extendable via plugins, which is why it's so useful
3) there are a number of plugins available to compress js/css. that will improve performance, but is unlikely to address your template problem.

Shape5 templates ship with their own js and it just seems like there is some conflict between whatever they ship with and Civi's js. I would review the console log and see if any errors are showing up. It's also possible that the issue is not the template, but some other plugin or module displayed on your site.