[Resolved] Table Borders

[Geoff]

GeneratePress adds table borders by default. I can remove these globally using the appropriate additional CSS. However, my site has over 18,000 posts (growing at the rate of 20+ each week) and the majority of them contain a table. Of these, some require borders and others do not so is there a way of displaying borders if the post contains <table border=”1″> and omitting them if there is no <table border> or if <table border=”0″>?

[Leo]

Hi there,

Any chance you can link me to an example for each case?

[Geoff]

Hi Leo
The current site is here: https://www.fifteensquared.net. There are various examples of posts with tables having borders and those without. I intend to update the theme for the site to GeneratePress, plus a child theme, next Sunday. If possible, I would like to get the table border issue resolved before then.

[Geoff]

Sorry, I should have been more specific. This is a post where table borders are not required:

https://www.fifteensquared.net/2020/12/30/financial-times-16671-by-neo/

This is is a post where they are required:

https://www.fifteensquared.net/2021/01/01/inquisitor-index-setters/

My current theme displays borders as intended, but GeneratePress does not. Currently I have the option of all tables having a border or all tables not having a border. I would like to rectify this before switching themes.

[Leo]

I’m not seeing the <table border="1"> you’ve mentioned in the original post.

The best way to handle this is to start a staging site and duplicate the existing site over, then activate GeneratePress theme on the staging site, then we can take a look and see what the best solution would be.

Can you do that first?

[Geoff]

Leo
The second URL I listed does have <table border=”1″ cellpadding=”5″ cellspacing=”1″>

I have included links to two posts in my sandbox which is using GeneratePress with a child theme.

[Leo]

Unfortunately I don’t see any specific classes we can target:
https://www.screencast.com/t/RPXuNM33

I think the best solution here is to add a class like no-border for the tables that don’t need the borders, then you can edit the original CSS you are using:

table, th, td {
    border: 0;
}

With this:

table.no-border, th.no-border, td.no-border {
    border: 0;
}

[Geoff]

Thanks Leo
That will work for new posts but I was trying to find something that would apply to all the existing posts. Perhaps I was hoping for too much.

[Leo]

Yeah unfortunately none of the tables have unique classes for us to target so there isn’t really anything we can do about it.

[Geoff]

Thanks Leo. I’ll mark this as resolved.

[Leo]

No problem 🙂

[Author]

Posts