Support Forum

Please note that this forum is only available to you in read only mode. In order to contribute to this conversation you will need to renew your subscription.

Change background color under accordion

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

Greetings Team JB,
My site mimics the New Lifestyle demo site. I have changed the home page background color, but I cannot for the life of me find out how to change to color behind the accordion Questions for the FAQ. The answers have the new background colors, but not the questions.

Thanks in advance!
Pat
  • Patricia Lawson's Avatar
  • Patricia Lawson
  • 12 Month basic
  • 285 posts
  • 1 Thanks
  • Karma: 1
The administrator has disabled public write access.
Hi Pat,

Have a link for the site?

Thanks
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
jeepspeed.cloudapp.net/
  • Patricia Lawson's Avatar
  • Patricia Lawson
  • 12 Month basic
  • 285 posts
  • 1 Thanks
  • Karma: 1
The administrator has disabled public write access.
So you need to target the moduleID combined with

.zentools.accordion .allitems.container {background: your colour value;}

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
Thanks - how do I include the moduleID?
  • Patricia Lawson's Avatar
  • Patricia Lawson
  • 12 Month basic
  • 285 posts
  • 1 Thanks
  • Karma: 1
The administrator has disabled public write access.
You can find the source either in the source code (using inspect element in firebug / Web developer tools)

so in this case its

#zentools320 .zentools.accordion .allitems.container {background: red;}

using an arbitary colour value

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
This works for the answer; not for the Question...
  • Patricia Lawson's Avatar
  • Patricia Lawson
  • 12 Month basic
  • 285 posts
  • 1 Thanks
  • Karma: 1
The administrator has disabled public write access.
ah sorry try

#zentools320 .zentools.accordion.zen-flat .zentitle {background:red !important}
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
You also have an invalid line
//.tab-content {background: #FFFEFE};

in the custom css file

Cheers
paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
The following user(s) said Thank You: Patricia Lawson
Sweet!
I JUST got the same effect using the following, which changes all accordions on the site:

.zentools.accordion .zentitle.firstitem,
.zentools.accordion .zentitle.firstitem.open {
background-image: url(http://localhost/jeepspeed/templates/newlifestyle/images/bg/bedge_grunge.jpg) !important;padding-left: 0;
}
.zentools.accordion.zen-flat .zentitle {
padding: 0 !important;
background: url(http://localhost/jeepspeed/templates/newlifestyle/images/bg/bedge_grunge.jpg) !important;
}

Your code is shorter and I will use it unless I need to change the other accordion.

Thanks, Paul, for sticking with me!
  • Patricia Lawson's Avatar
  • Patricia Lawson
  • 12 Month basic
  • 285 posts
  • 1 Thanks
  • Karma: 1
The administrator has disabled public write access.
It depends really - my code is targetting the one module so if you need to change to a general style then remove the id

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
The following user(s) said Thank You: Dot

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

Happy Campers