Hello, 

I am trying to apply a custom font to all my tables in wpDataTable via Custom CSS, I'd like to do two things:

1. I am trying to use the font Marine Light (https://www.encore/wp-content/uploads/2020/12/Marine-Light.ttf) as default to all my tables;

2. For the first column of every table, I am trying to use another custom font Marine Regular (https://www.encore/wp-content/uploads/2020/12/Marine-Regular.ttf)

I was wondering if that is possible.

Thank you,

Rafael

Hi Aleksandar,

Thanks for getting back. I've applied the Custom CSS below which worked for the fields outside the Data Table, such as titles, paginations etc, but not for the table data. 

Would you have any guidance how to solve this?

@font-face {

font-family: “Marine-Light”;
src: url((https://encore.am/wp-content/uploads/2020/12/Marine-Light.ttf)format(‘truetype’);¬
font-weight: normal;
}
@font-face {
font-family: “Marine-Regular”;
src: url(https://encore.am/wp-content/uploads/2020/12/Marine-Regular.ttf)format(‘truetype’);
font-weight: normal;
}

td {
font-family: Marine-Regular; }
th {
font-family: Marine-Regular; }
body {
font-family: Marine-Light; }
links {
font-family: Marine-Light; }
h1 {
font-family: Marine-Regular; }
h2, h3, h4, h5, h6, h7 {
font-family: Marine-Regular; }

Hi Aleksandar,

A quick update: I manage to style the table with:

table.wpDataTable tbody tr td{ font-family: Marine-Light!important; }

But the first row, remains in a different font. Any guidance?

Thanks,

Rafael

Hi Aleksandar,

Thanks for the support.

Nope, it didn't work. By the first row, I was meaning header actually. 

Please find the link below:

https://www.encore.am/fundos/

Best,

Rafael

It did! Thanks Aleksandar!

(and I also updated to premium) :) 

Hi Aleksandar, quick follow up.

When I updated the plug-in to premium the CSS for the font stopped working. Any guess?

@font-face {
    font-family: 'Marine';
    src: url('https://encore.am/wp-content/uploads/2020/12/Marine-Light.eot');
    src: local('Marine Light'), local('Marine-Light'),
        url('https://encore.am/wp-content/uploads/2020/12/Marine-Light.eot?#iefix') format('embedded-opentype'),
        url('https://encore.am/wp-content/uploads/2020/12/Marine-Light.woff2/Marine-Light.woff2') format('woff2'),
        url('https://encore.am/wp-content/uploads/2020/12/Marine-Light.woff') format('woff'),
        url('https://encore.am/wp-content/uploads/2020/12/Marine-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

.wpDataTablesWrapper table.wpDataTable th {
font-family: Marine!important;
}

.wpDataTablesWrapper table.wpDataTable td {
font-family: Marine!important;
}

https://www.encore.am/fundos

Hi Aleksandar,

Great, it worked. Thank you for your superb help!

I think no we're sorted! :)