TablePress – two questions

Hi,

thanks for your post, and sorry for the trouble.

To center the search field, you can add this to the “Custom CSS” textarea on the “Plugin Options” screen of TablePress:

#tablepress-123_filter {
    float: none;
    text-align: center;
}

(where 123 is the table ID).

To remove the text in front of the search field, add this to the “Custom Commands” text field in the “Table Features for Site Visitors” section on the table’s “Edit” screen:

"language": { "search": "", "placeholder": "Search..." }

(This would also add a text inside the search field, as a placeholder.)

Finally, to add a border around the table, please add this to the “Custom CSS” textarea on the “Plugin Options” screen of TablePress:

.tablepress-id-123 {
  border: 1px solid #ff0000;
}

(where again 123 is the table ID).

Regards,
Tobias

Wow Tobias, thank you very much dude!

Can you just tell me how can i change the size of search box?

Also, how can I change text size ONLY in header?

Hi,

to influence the size, you can e.g. use this CSS code:

#tablepress-123_filter {
  width: 300px;
  font-size: 20px;
}

To only change the font size in the header row, use

.tablepress-id-123 thead th {
  font-size: 20px;
}

Regards,
Tobias

Hey, successfully changed header size text, but search box is still small.

Any other solution?

btw, when i put that code, search box totally moved to the left.

• This reply was modified 1 year, 2 months ago by borko97.

Hi,

ah, I made a mistake in the code (I forgot the input). Please try

#tablepress-123_filter input {
  width: 300px;
  font-size: 20px;
}

If it still doesn’t work, please post a link to the page with the table. Thanks!

Best wishes,
Tobias

Thank you very much! <3

Hi,

no problem, you are very welcome! ?? Good to hear that this helped!

Best wishes,
Tobias

P.S.: In case you haven’t, please rate TablePress here in the plugin directory. Thanks!

Hey again me, one more question for this week!

https://ibb.co/QNkGxPd

How to create little distance from table border and search box?

Yeah i will do it right now!

Hi,

for that, I suggest to add

margin-bottom: 20px;

to the

#tablepress-123_filter input {

CSS block.

Best wishes,
Tobias

AMAZING!

Last one – i put search box border in some red color, but when i click on the search box, borders of search box became blue. how can i change color of border of search box when i click? Thanks
i hope you understand me, if you dont, i can make little video just to show you.

Hi,

this color change is likely governed by your theme. So, to find the best code to change this, I would need to see the table. Can you please post a link to the page with the table where you want to do this, so that I can take a direct look? Thanks!

Best wishes,
Tobias

Hey, again me ??
https://petrovicluka.in.rs/naissus/ocitavanje-i-naplata/

on that page is a table. its work perfectly on pc, but how can i optimize that table to mobile devices? as you can see, when you visit website from mobile, you also can see good table, but you have to scroll right/left to see everything.

thanks.

Hi,

that’s the classical problem of responsiveness for tables on the web. For this, I recommend taking a look at the Responsive Tables feature module that is part of the TablePress premium versions.

Best wishes,
Tobias

Hello!
Okay, it’s not a big problem.

For same website and same table, how can I make smaller search box on mobile only, on web is totally okay?