In wordpress, when adding a new page or post, a CiviCRM button is available to add content from Civi. The "Insert CiviCRM Content" dialog box opens as expected, but the select box doesn't allow a selection. The select box contains "User Dashboard", "Profile", "Contribution Page" and "Event Page", but these options open underneath the dialog box and can't be clicked. enter image description here

Turns out that this is because the select box has a z-index of 399,999. I can't find any CSS conflict that would cause this, and there is no JS error in the console. Any suggestions would be appreciated.

  • 1
    Can you confirm that this happens on the WP demo site at demo.civicrm.org? I know you said there's no CSS conflict, but it's worth investigating whether the issue is theme-specific. Also, does the problem occur on your site if you use one of the default themes (e.g. twentysixteen)? Commented Jan 7, 2017 at 23:27
  • I have just come across this searching for the same problem It seems for me Slider Revolution is the plugin causing this. Would the code posted above help and where would I find functions.php function my_custom_fonts() { echo ' .select2-drop-active{ z-index: 99999999 !important;} '; } TIA Scott Commented May 18, 2017 at 13:17

3 Answers 3


I had a similar problem with this - See CRM 18496. It turned out that there may have been interference with CiviCRM's jQuery and CSS from a Wordpress plugin. You could try deactivating any plugins that you have installed, one by one, to see if there is conflict. My problem went away without me discovering which of the many plugins I have was the culprit but one of them that I deactivated was Jetpack.

Unfortunately, you can't test this out on the demo site because you can't there create a new page in which to enter the appropriate civicrm shortcode.

  • Ok I eventually found that the problem goes away if the OpenTickets plugin, from opentickets.com, is deactivated. I will track it down from there. Thanks.
    – twowheeler
    Commented Jan 8, 2017 at 21:46

on functions.php add :

function my_custom_fonts() {
  echo '
     .select2-drop-active{ z-index: 99999999 !important;}


The solution provided by @mahrez-othemeni is good except it won't work if you are in a popup that has a CKEditor and you open a dialog from there. i.e. try to add a link.

Here is the solution we use that seems to work. Add this css code in your theme :

body.toplevel_page_CiviCRM .ui-dialog {
   z-index: 1000 !important;

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.