Hi,
Could anyone help me with some Custom CSS that would make the table row a little taller?
Also, is it possible to create group by a column? I am trying to make it look a bit like this
The grouping is the category column
The only way to get that would be to use a HTML table with inline styling, in a Rich Text component.
1 Like
ok great thanks.
Would that be for making the row taller as well as the grouping or just making the row taller?
Thanks
It’s a HTML table. You can do whatever you want with it.
1 Like
If I was to find someone who could help me create the HTML table and inline styling, do you know if the fields can still allow for inline editing on the table?
No, that’s the downside of using a HTML table. You lose the ability to select/edit individual rows. Because it’s displayed in a rich text component, the best you can do is assign an action to the table as a whole.
ok thanks. Perhaps I will create a button that can switch between the native glide table for editing and the html table which I only want for PDF creation purposes and I was planning on trying the Urlbox integration, unless you can suggest another way.
On the HTML table, i found you post about creating a custom table. ⚡ Rich Text > Actions! - #12 by Darren_Murphy presuably I could try following similar steps?
You can display a PDF instead HTML… i do that for my Invoices
Yes. I also created a video tutorial that shows how to set that up. It’s quite old, but the essential concepts remain the same. The only caveat is that unless you have a Business Plan or better, then all of your table styling (CSS) needs to be applied inline. That is, adding CSS to a rich text component is no longer supported.
Thanks, this is great. I will give it a go.
Just thinking about what @Uzo said above.
Is there away to create a repeating container in Glide. If so then I could create a page like this from this
from this table
and use Urlbox to create the PDF and display it rather than having to create custom CSS table
Try using a Custom Collection.
Fantastic! Thank you
Hi Darren,
I’ve given this a go and I have just about got it working, aside from the fact that the CSS isn’t styling my table. I am missing something?
This how my table looks with the CSS applied, just the same as without it.
and this is my Table HTML:
and this is my CSS:
div.minimalistBlack {
border: 3px solid #000000;
width: 100%;
text-align: left;
border-collapse: collapse;
}
.divTable.minimalistBlack .divTableCell, .divTable.minimalistBlack .divTableHead {
border: 1px solid #000000;
padding: 5px 4px;
}
.divTable.minimalistBlack .divTableBody .divTableCell {
font-size: 13px;
}
.divTable.minimalistBlack .divTableHeading {
background: #CFCFCF;
background: -moz-linear-gradient(top, #dbdbdb 0%, #d3d3d3 66%, #CFCFCF 100%);
background: -webkit-linear-gradient(top, #dbdbdb 0%, #d3d3d3 66%, #CFCFCF 100%);
background: linear-gradient(to bottom, #dbdbdb 0%, #d3d3d3 66%, #CFCFCF 100%);
border-bottom: 3px solid #000000;
}
.divTable.minimalistBlack .divTableHeading .divTableHead {
font-size: 15px;
font-weight: bold;
color: #000000;
text-align: left;
}
.minimalistBlack .tableFootStyle {
font-size: 14px;
}
/* DivTable.com */
.divTable{ display: table; }
.divTableRow { display: table-row; }
.divTableHeading { display: table-header-group;}
.divTableCell, .divTableHead { display: table-cell;}
.divTableHeading { display: table-header-group;}
.divTableFoot { display: table-footer-group;}
.divTableBody { display: table-row-group;}
Any help you could give me would be hugely apprecitated.
Which plan are you on?
As I said in my earlier reply…
I’m on a business plan, but its under the trial period currently don’t know if that makes a difference?
Okay, cool.
So to apply your CSS, go to Settings->Appearance, and you should see a section labeled “Custom CSS”
Paste your CSS in there.
Amazing! Thank you
1 Like
Wonderful 
and presubaly, to create a title row for the table I would have to create some new HTML and CSS?
You could extend your existing HTML, or just use a Text component and place it above the table.