Hello, I'd like to customize my "Ask an Expert" widget but am afraid of doing so and ruining the functionality so I figured I'd ask here. As seen in this screenshots below, i'd like to do something similar to what Beauty Talk does. What are the proper steps to follow to customize the widget?
Hi Heather,
To style this component, you'll want to make adjustments to the respective classes in your skin's CSS.
In particular, the widget is housed around the .lia-component-qanda-widget-ask-an-expert div class. Within that, you can style different levels of the component, depending on what it is you're looking to do (such as using a background image, color, etc.). I've attached an image showing some of the basic HTML structure -- see ask.PNG.
For reference, I've included a couple of useful articles that will help you in doing this -
Please let me know if any clarification is needed.
Cheers!
Jeff,
We have already gone through all the CSS and can't find where that class is so we can style the different parts. I think the main issue is that of all the pieces to style, a lot of them aren't referenceable anywhere in the code. Would it be easier to look through ours and point it out for us? We're currently working off our stage platform. Let me know what you would need.
Thanks for all your help thus far,
Heather
Hi Heather -
That BeautyTalk component (and, in fact, the entire page on which it lives) is a custom build. Also, it is using a normal search functionality, not the Ask A Question functionality. You don't get that new div of matching topics as you type below the textarea. To use Ask an Expert, you are going to need to account for the unknown dimentions of the results area in your design. You could add style to
.lia-ask-an-expert-wrapper .lia-form-input-wrapper {}
to isolate just the entry box.
If you need more divs for styling you can try wrapping the component in a custom one and creating whatever markup you need. However, this will go around the entire component. PM me your stage site and I'll take a look.
