Styling Quick View Form and remove white space

(2) Share

Report

Posted on by Community Member

Hello,

I'm on CRM 2016. I would like to hide white space inside quick view form. But i can't access to the dom with jQuery and so can't apply css change

Anyone can have an idea .

*This post is locked for comments

I have the same question (0)

All responses (30)

Answers (1)

Sort by

Suggested answer

Sayhaitokumar 7,042 on at

Like (0)

Report
Copy link

Link copied!

Hi Sebastien,

Looks like some spaces are added in the quick view form. Open that quick view form in customization mode and remove the white space then try.

Was this reply helpful? Yes No
Community Member on at

Like (0)

Report
Copy link

Link copied!

Hi,

Thanks for your answer. There is no way in customization mode to remove white space, i don't find it.

Was this reply helpful? Yes No
Verified answer

Community Member on at

Like (2)

Report
Copy link

Link copied!
Hi

There is no supported method to inject CSS, but certainly there is away... Til 2015 you can follow the guide at:

http://www.codeproject.com/Articles/1032318/Improve-user-experience-by-styling-and-coloring-Mi

But you need a few changes to make it work on 2016 new layout... following the steps guided in the article linked below... use this varian in the css loader script:

function LdCSS() { var path="../WebResources/FIX_QFGAP_FORM_XXX.css"; var head = frameElement.parentElement.parentElement.children[0]; var link = document.createElement('link'); link.rel = 'stylesheet'; link.type = 'text/css'; link.href = path; link.media = 'all'; head.appendChild(link); }

then in FIX_QFGAP_FORM_XXX.css file you can code a css like:

.refresh-form div[data-uniqueid="customerpane_qfc"] .ms-crm-FormBodyContainer TABLE.ms-crm-FormSection {padding:0px;margin-top:0;} .refresh-form div[data-uniqueid="customerpane_qfc"] DIV.ms-crm-InlineTabContainer-Read {margin-top:0px;margin-left:-5px;margin-right:-5px;}

Notice that "customerpane_qfc" is the identifier specified in the QuickViewForm control ... you can locate it using the form editor and double click the QuickView control.

Enjoy customizing 2016 forms!

Was this reply helpful? Yes No
Community Member on at

Like (0)

Report
Copy link

Link copied!

Hi,

Thank you so much, it works fine. I appreciate.

Sebastien.

Was this reply helpful? Yes No
Community Member on at

Like (0)

Report
Copy link

Link copied!

Hi Sebastian,

Is this solution is working after adding update rollup 1 to MSCRM 2016?

For me it is not working.

Please let me know.

Thanks,

Sreenath

Was this reply helpful? Yes No
Community Member on at

Like (0)

Report
Copy link

Link copied!
Hi Sreenath

The workaround was specific for 2016 SP1... but certainly the new layout does not apply for all entities and there a setting that brings the form engine in legacy mode... that's something you may want to check...

Other tips:

- The names on the css are case sensitive, take it in consideration.

- It is for main form only... quick forms nor other forms usages does not apply...

- The method only change the way you inject the css, you may use Chrome DOM inspector to adapt the inject routine:

var head = frameElement.parentElement.parentElement.children[0];

mostly the trick is to determine where the head element resides by using the frameElement as start point.

Best regards

Was this reply helpful? Yes No
Community Member on at

Like (0)

Report
Copy link

Link copied!

Hello Sreenath,

Yes it's still working on CRM 2016 SP1.

Did it work for you before SP1 ?

Was this reply helpful? Yes No
whatup 200 on at

Like (0)

Report
Copy link

Link copied!

How did you access the quick view form can you post you solution. Thanks.

Was this reply helpful? Yes No
Community Member on at

Like (0)

Report
Copy link

Link copied!

Hi,

On the customization form, get the name of your quick view form :

For me the name is ContactQuickView, so my css is :

.refresh-form div[data-uniqueid="contactquickview_quickform_contact"] .ms-crm-FormBodyContainer TABLE.ms-crm-FormSection {padding:0px;margin-top:0;}
.refresh-form div[data-uniqueid="contactquickview_quickform_contact"] DIV.ms-crm-InlineTabContainer-Read {margin-top:0px;margin-left:15px;margin-right:-5px;}

Replace contactquickview by your qvf name.

Was this reply helpful? Yes No
whatup 200 on at

Like (0)

Report
Copy link

Link copied!

Thanks :) ... Any experience with this working on a quick view form with a sub grid different CSS required I assume?

Was this reply helpful? Yes No