How do I increase the font size in an embedded grid report?

  • Profile Image
    Asked on October 15, 2012 at 09:52 PM

    I embedded a grid-style report in my website, but the font size is so small that it is almost unreadable.  How can I make the text bigger?

  • Profile Image
    Answered on October 15, 2012 at 09:59 PM


    Unfortunatelly, you cannot modify the grid report style within the form builder. But if you had embedded it on website, you can probably include it in your website/webpage CSS stylesheet.

    You can also inject style in the grid report html source code.. perhaps if you embed it within an iframe, then you can put styling within the iframe that can affect the text of the report.

    Hope this help. Please inform us if you have further inquiry.


  • Profile Image
    Answered on October 16, 2012 at 12:31 AM


    I did some further research and testing on this. Unfortunately, it seems it will not work on an iframe because we know the iframe is in a separate window, so it could not be influence by the styling in the same page.

    So, I would like to confirm that as of this time, we cannot really alter the style of the current existiing JotForm's Grid Report. Perhaps in the future JotForm version, we can see features to do this.

    You probably will have to try the other reports that you can apply styling. If I can suggest you can use the google spreadsheet integration. With the integration, you can highly beautify the reports in the spreadsheet and have it displayed on your website just like how you did with the grid report.



    i would like also to share to you that I did achieved something similar using the grid report html source code (just as what you asked during our chat discussion). Here is the demo page.

    As you can see, the font-size where larger.. I inserted a CSS code in the source code.

    BUT I would like to inform you ahead that this method have a huge limitation. You can only use it once without updating/embedding the whole source code everytime.

    The report will NOT get dynamically updated with the form's submissions, as it was already detached when the source code was used. So, its use is only at the end of the form's submissions.(if you only want to dispaly a final report)

    I hope I was able to provide you the answers to your inquiry. Please feel free to contact us again anytime should you have further question or needs assistance (i.e. on that google integration I suggested)


  • Profile Image
    Answered on October 16, 2012 at 10:09 AM

    Thanks, Jonathan.  I will investigate google spreadsheet integration.


    One question:  can you show me exactly what CSS code you inserted so that I might find it?




    Scott Eveland

  • Profile Image
    Answered on October 16, 2012 at 10:47 AM


    Hi, if you view the source code of the grid report demo page, you will see the code I added



    .x-grid3-cell-inner, .x-grid3-hd-inner {


    font-size: 15px !important;






    Thats it. 


  • Profile Image
    Answered on October 16, 2012 at 11:56 AM

    Actually, Jonathan, there is one more thing.  The REAL solution to my problem is for Jotform to upgrade the Visual Report Builder style report to allow one to select fields for the report. 


    I have implemented a PIN in my system to ensure data integrity.  I do not want those PINs to show up in reports.  Grid reports provide the option to exclude columns, but it has its readability issues as we have discussed.  Visual Reports can be whatever font size I choose, but I can't exclude fields.  I can't win.


    The Spreadsheet Integration is interesting but I would rather have my users "stay in the system", so to speak.  And, I can hide columns in Google Docs, but that can be undone.


    Is there ANY chance that the Visual Report Builder might be enhanced as I have described.  This really is a serious inadequecy.





  • Profile Image
    Answered on October 16, 2012 at 01:26 PM


    Our developers are constantly working on improving JotForm, but they prioritize features/enhancements that get a lot of demand from users or those that are deemed critical.

    Sure, there is a chance that what you're asking for will be granted, but we cannot guarantee a definite time as to when it will be implemented, if at all. We don't want to keep your hopes up.

    Still,as what I've mentioned in our previous conversation, we take notes of our customers' inputs, and yours is no exception.

    Oh and by the way, Jonathan's solution (css-injected report) works perfectly. I think you should take a look at it.

    Best regards