FAQ different Background Colors Question, and Placeholder

Hello,

i have two question.

Please, i need different Background Colors at the according FAQ´s ( Question ) and a custom placeholder! Not “Search…” I want set my own word.

best regards
Harald

1 Like

Greetings @Harald :wave:

To add a custom placeholder for the search, please add this script right after the installation code and replace NEW WORD with your own word:

<script>
window.onload = () => {
  	let i = 0;
    function checkElem() {
      let elem = document.querySelector('.eapps-faq-search-bar-input');	
      
      if (elem) {
      	elem.setAttribute('placeholder', 'NEW WORD');
      } else if (i !== 50) {
      	setTimeout(checkElem, 100);
	      i++;
      }
    }
    checkElem()
  };
</script>

As for the background, do I understand correctly, that you’d like to change the background color of all the questions without changing the color of the Search bar simultaneously?

Please, I need… different colors… Question

Gruppe Hypercars
Gruppe Racer
Gruppe Drifter

searchbar no changing.

best regards

Harald

1 Like

@Harald Just to make things clear, do you want to apply different colors to each question?

Hi,
I have add the, but no changing… “search…” is the same

best regards

Harald

Could you please share a link to the page where your widget is installed?

The first yellow, the second silver, the third red.only question, the answer background, all the same color… look at my groups https://airphone.at/didi-mateschitz-gedaechnistour

1 Like

@max have you issues with the dashboard??

1 Like

Yes, our devs are already working on it. I am so sorry about the issue! We’ll keep you updated on the progress.

As for the customization request, I’ve forwarded all the info to our devs. I’ll get back to you once the solution is provided :slightly_smiling_face:

@Harald The issue with the dashboard is finally resolved. Check it out and let me know if it’s fine on your end :slightly_smiling_face:

We’ve checked your website and found that the additional <p> tags appeared in the script for changing the search caption:

Could you please try to remove them and let me know if it helped?

As for changing the background color, I’ll get back to you once the solution is provided :slightly_smiling_face:

Hello Max,
thankyou! that was the mistake! I was made copy/paste! Ok, next time better looking at the codes!

@colors… please i hope you will get a solution.

best regards
Harald

1 Like

Happy to hear that it worked!

As for the background customization, I’ll keep you updated :slightly_smiling_face:

@Harald Thank you for waiting!

We’ve added this code to the Custom CSS field on the Appearance tab of your widget’s settings:

/* The first question */
.eapps-faq-content-category-item:nth-child(1) 
.eapps-faq-content-category-item-question {
  background-color: #ECE735 !important;
}

/* The second question */
.eapps-faq-content-category-item:nth-child(2) 
.eapps-faq-content-category-item-question {
  background-color: #BFBFBF !important;
}

.global-styles,
.eapps-faq-content-category-item:nth-child(1).eapps-faq-content-category-item-active
.eapps-faq-content-category-item-answer 
.eapps-faq-content-category-item-answer-text,
#eapps-faq-1 .eapps-faq-content-category-item:nth-child(2).eapps-faq-content-category-item-active
.eapps-faq-content-category-item-answer 
.eapps-faq-content-category-item-answer-text,
#eapps-faq-1 .eapps-faq-content-category-item-active .eapps-faq-content-category-item-question-text[itemprop="name"] {
	color: black !important;
}

/* The third question */
.eapps-faq-content-category-item:nth-child(3) 
.eapps-faq-content-category-item-question {
  background-color: #DA1B4E !important;	
}

Check it out and let me know if you like what you see :slightly_smiling_face:

Great!!! perfect! Thank you for your help, Max!

2 Likes

You are always welcome :wink:

Just in case, I’d like to remind you that we have a CSS Codes category where you can find the most popular codes for different apps (including FAQ). Feel free to check it out - CSS Codes - Elfsight Community

Max, a little problem! If you looking for a name… it come the wrong color. Example… the name is in the red question… and in search function the question get yellow!

1 Like

Do you mean that when searching, the words should be highlighted based on the background color of the question?

no no… look for a name in the answer! example “Kaltenmesser” the name is in the red group, but in searching the quest will get yellow!

1 Like

Oh, I see this!

I’ve shared this info with the devs and will let you know once I receive a response from them :slightly_smiling_face:

Thank you Max! Sorry for the the troubles!

1 Like