Tagged: Pricing Table, table, tables
-
AuthorPosts
-
May 22, 2020 at 4:40 pm #1215274
First of all, I’m a huge fan and this is the 3th site that I’m building with Enfold.
However, there’s one thing that keeps bugging me and that’s how Enfold displays tables, it looks like an excel-sheet, rather than something thats visual attractive. So, I hope you can provide me with some coding to resolve these two issues:
1. In the footer I’d like to display a table with opening hours, to ensure that the text is aligned, see the website in the private content as an example.
The way I see it, it’s a table without borders and with regular text spacing. When I apply the similar code to enfold I get a microsoft-excel-look-and-feel.2. I’d like to have a pricing table such as provided in the private content, though then with one (or two) extra colums. With the current table function teven this is impossible, whilst I’d consider this as a basic layout for any pricing-overview.
I have both requests from two clients and I’d like to stick to Enfold for now and in the future.
hope you can help asap, so I can finish yet another Enfold website.
May 27, 2020 at 11:02 am #1216890any updates on this insofar Kriesi team? My client is ‘on my back’.
May 27, 2020 at 1:35 pm #1216928Hi,
Sorry for the late reply, I see that the tables in your two example sites are created with plugins, are you going to use these plugins on your site? Can we see your site to see what you have so far?Best regards,
MikeMay 27, 2020 at 2:00 pm #1216936Hi Mike,
do you know with which plugings those tables are created…and are they compatible with enfold?
The site is: http://schoonheidsinstituutdiane.nl/
May 27, 2020 at 3:37 pm #1216992I tried with tablepress, the problem remains, even after I added below custom css to the plugin. (or should I add this somewhere else in enfold to overwrite enfold features? please find the settings attached in the private content. insofar I only tried to fix the opening hrs in the footer.
.tablepress {
line-height: 25px;
font-size: 15px;
font: Open Sans;
border: none;
background: transparent;
color: #FFFFFF;
border-collapse: collapse;
border-spacing: none;
white-space: nowrap;
}May 27, 2020 at 11:34 pm #1217205I tried with WP Table Builder. please check the footer of https://schoonheidsinstituutdiane.nl how it looks.
This nearly solves the challenge regarding the openings hrs in the footer, but there’s some unwanted line spacing on the first line, which I don’t seem to be able to get rid off. i have the same problem with the google review plugin in the 3th column in the footer. how do i get rid of these spacings?any clue why tablepress seems to be overruled by enfold?
May 28, 2020 at 12:41 pm #1217327Hi,
Thanks for the link to your site, the openings hrs in the footer has some top margin, Please try this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:#text-3 .wptb-table-container { margin-top: 0 !important; }
For the in margin in the 3th column, please try this css:
#grw_widget-2 { margin-top: 0 !important; } #text-6 { margin-bottom: 0 !important; }
As for tablepress and your css, I imagine that the class “.tablepress” was not correct, but I would have to see it to tell.
Best regards,
MikeJune 8, 2020 at 6:42 pm #1220559Dear Mike, (nearly) perfect: this partially solves the issue, now it seems that there’s a slight bit of more spacing in the 2nd and 3th column (between title and text). any suggestions?
June 9, 2020 at 1:46 pm #1220848Hi Mike,
also, I wanted to align the days and opening hrs nicely on the contact page, so I added a table in a similar way to the contact page as I did in the footer. but the result is very different, Enfold still displays it in a broad table with borders…
how do i solve this?June 10, 2020 at 1:24 pm #1221176Hi,
For your footer please try this css:#text-3 .wptb-table-container .wptb-preview-table { min-width: 70% !important; width: 70% !important; float: left; }
for your contact page please try this css:
#top.page-id-76 .wptb-ph-element { border: 0px solid #fff0 !important; } #top.page-id-76 .wptb-table-container .wptb-preview-table { min-width: 70% !important; width: 70% !important; float: left; }
After applying the css, Please clear your browser cache and check.
Best regards,
Mike -
AuthorPosts
- The topic ‘Tables – how to make them look nice’ is closed to new replies.