Skin Styles for Search Results

[Pamb10]

I am looking for where I can change the styles for the search results on the search accordian. Currently it is all black text and black lines and I need to change it to white. I cannot find a style for that within the skin styles.

Is this available?

Pam

[LTinker68]

Unfortunately, all of the search results table styles are hard-coded in the Search.htm page that's generated when you build the output. Which is weird, because they give you some access via the skin (the "Messages" style under the Control category), but not to thinks like font color or table properties. So, as it stands now, you can either do a manual change on a project-by-project basis that requires an after-build modification every time, or you can make the change so that it's permanent, but it will apply to all projects, not just the current one.

To affect just the current project, build the WebHelp output, then navigate to the skin folder in the WebHelp output folder. Open the Search.htm file in Notepad. Make the changes you want to the styles in that file, then save the file. Copy that modified file to a file share outside the Flare project. After that, whenever you build the project, copy your modified Search.htm file over the version in the skin folder of the WebHelp output folder. Note that if you install a different version of Flare, you might have to repeat this process on the Search.htm file created by that version, since MadCap may change how that Search page behaves or is built.

To make the change so it's permanent (well, permanent for whatever program version you're using), go to the location where Flare is installed and go to the SkinSupport folder (by default, it's at C:\Program Files\MadCap Software\MadCap Flare V7\Flare.app\Resources\WebHelp\Content\SkinSupport). Open the MadCapSearch.js file in Notepad. Do a search on 000000. That will jump you to the styles for the search results. Make the modifications you want. (You can also search on #, and that will take you to another location where you can modify the mouseover color.) Once you've made your changes, save the JS file. All projects built using this software version will use those styles for the search results. You'll have to repeat this process in other Flare versions, as necessary.

And make sure to submit a feature request at http://www.madcapsoftware.com/bugs/submit.aspx asking for the ability to control the search results styles.

[Pamb10]

Thanks! This will work for now since all of our projects use the same skin. Did u by chance look in version 6 or 7? I am using 6 but possibly it was added for 7??


ok, i tried this and it did not seem to work. here is what i changed:

trResult.style.color = CMCFlareStylesheet.LookupValue( "Control", "SearchResults", "Color", "#FFFFFF" );

Is this correct?

Possibly it is not working because when I build the project I get the following error (always):

"Failed to copy linked file C:\Dev.DA\trunk\src\Help\Content\SkinSupport\MadCapAll.js to output: The file 'C:\Dev.DA\trunk\src\Help\Output\PBrechlin\DA Help\Content\SkinSupport\MadCapAll.js' already exists."

I did go to that output folder and remove the existing MadCapAll.js and it did get recopied but I still get this error in the log. Doesnt the output folder get emptied anyway when a build is started?

[LTinker68]

If you're using two versions of Flare, then you have to make the modification to their respective MadCapSearch.js file in each version's program folder. You can't make the change in version 7's file then copy it into version 6's folder because there might have been changes to that file between the versions and v6 won't know how to handle v7's version of the file.

If you overwrote v6's file with v7's, you should be able to get v6's file back by reinstalling version 6. Likewise, if you modified v6's file and copied it into v7's folder, you'll have to reinstall v7.

[Pamb10]

No I did not do that. I am using 6.1 and changed version 6.1. I was just thinking maybe that was a feature that was added to 7. The build error I am getting is something that I have always been getting, just not sure how to fix and maybe it was causing this change not to work.

[LTinker68]

Did you try deleting the entire output folder before building? Not to clear out the error, but that might be necessary to trick your browser into loading the new changes to the file. Also, in the built output (assuming the error you're getting doesn't stop the build), right-click on the search pane and select View > Source Code or however it's worded and see if the style changes you made show up in the code-behind of the file.

[Pamb10]

I deleted the output folder and that did not help. when I view the page source I cannot tell too much because the page is made up of frames and I am not sure how to get to the file it is loading in the frame for the search results.

[LTinker68]

You need to right-click in the frame area then select View Source (if using IE) or This Frame > View Frame Source (if using FF).

[Pamb10]

ok, i got it. opening the source for the frame, I do not see any color #000000 or #FFFFFF which is what i changed it to.

Search.htm.zip

[LTinker68]

Ok, right idea, wrong file. You have to modify the MadCapAll.js file, located in the same folder. Don't ask me why they have the same set of code in two different files. Anyway, there are a lot more styles in the MadCapAll.js file, so it'll be easier if you search on trResult.style.color -- that'll take you directly to where you want to go in the file. (I'd make a backup of that file first.)

[Pamb10]

Yay! That worked. Thank you so much for your help. If i may bother you with one more setting, the hover over. I couldnt find anything similar to what we just set for the text color.

Thanks again.
Pam

[LTinker68]

If you do a search on # then you'll probably find it, although it'll take you a bit longer and you'll have to read the code closely to make sure it's the hover color for the correct feature (search results as opposed to feedback comments, for example).