Formatting micro-content search results

[aharper12]

Hello! We are new to using micro-content and are trying to get our search results to format the same as our other search results. When I look at the element, I see div classes:

- micro-content-container
- micro-response
- micro-content-expand-transition-wrapper

I cannot for the life of me find how where these are to format the style? I have attached a screenshot of not only our element inspect but also of how micro-content results look compared to regular search results.

I have tried editing all of the components of the HTML 5 search results skin (micro content result and micro content response styles) with no changes that I can see. I have looked in our stylesheet and I do not see the above div classes?

Any help is greatly appreciated!

Adriana

[Psider]

Does this topic help?
https://help.madcapsoftware.com/flare20 ... ontent.htm

[aharper12]

Thanks for your reply, @PSider. Unfortunately no - we 've looked through those options and nothing seems to change...

[Psider]

Did you definitely select Web Medium before making changes? While I haven't used micro content I know that changing mediums often caught me out for other styles.

[mtg]

Hi @aharper12,

did you finally manage how to change the layout and style of the micro content? We ran into the same problem and we couldn't find any fix for this.

[aharper12]

Unfortunately no We haven't had much luck so far.

[Chicago_HPT]

.
Have you tried looking in the Skin Editor?

madcap-flare-skin-editor-microcontent-items.png

As usual, this provides some control but to really take full control, you'll probably need to add custom CSS to your stylesheet. I do this a lot by using the "Inspect" tools in my browser to get the right CSS class, much like you did in your original post here.

Cheers,
-jeff

[mtg]

Yes, I have already tried with the Skin Editor and checked the documentation. However, the changes are not applied in the output. It seems as if the settings are overridden with the build and if the settings somehow depend/relate to the settings for the body content in the stylesheet?? But that was just a guess on my side.

My (not so nice) solution is now indeed to add custom css to my stylesheet. I checked in the output in the browser with the "Inspect" functionality and looked up which styles I have to add into my regular stylesheet. In my case, I added css settings for the following:

Code: Select all

.micro-content-container > .micro-content {
   font-size: 1rem;
   padding-bottom: 20px;
}

.micro-content-container > .micro-content > .micro-response {
        margin-left: 0px;
   margin-top: 15px;
}

.micro-content-container > .micro-content > .micro-response-url {
    font-size: 0.8rem;
}


I actually wanted to avoid this solution but the micro content output really looked so bad that I'm doing it anyway

@aharper12: Maybe this would also be a workaround for you?