1. For example, if you use an attachment Editor type to upload images directly in table cells for an Image column,
this is one of the current "default behaviour" issues that our devs noted on our "Editor types" Documentation here, regarding the image column being used with attachment editor type.
- If the Column type is set to Image, and the editor type as an attachment,
the uploader will automatically insert a ‘thumb’ size in the table cell (the resolution is defined in WP config), and link it to a full-size image.
If you have a WP Lightbox 2 plugin installed, each image will automatically open in a lightbox.
-
If we don't use the "attachment" as the Editor type, for example, if we use one-line edit, or multi-line edit;
then we can manually implement in the cell, if we wish a thumbnail, or the path to the full image without the thumbnail,
: If the content of the cells contains a combination of “two sticks” – || – everything to the left of this combination is used as a link to the thumbnail, and everything to the right as a link to the full image size:
How do you control the image size when the column type is an image?
Also, how do you control the image size when the column type is an image and the column is a group column?
Hi, Angela.
Sorry for the delay.
I am not sure exactly what the use-case is.
1. For example, if you use an attachment Editor type to upload images directly in table cells for an Image column,
this is one of the current "default behaviour" issues that our devs noted on our "Editor types" Documentation here, regarding the image column being used with attachment editor type.
- If the Column type is set to Image, and the editor type as an attachment,
the uploader will automatically insert a ‘thumb’ size in the table cell (the resolution is defined in WP config), and link it to a full-size image.
If you have a WP Lightbox 2 plugin installed, each image will automatically open in a lightbox.
-
If we don't use the "attachment" as the Editor type, for example, if we use one-line edit, or multi-line edit;
then we can manually implement in the cell, if we wish a thumbnail, or the path to the full image without the thumbnail,
- As we stated in this documentation about our Image columns;
the specific rendering rules for image cells are
: If the content of the cells contains a combination of “two sticks” – || – everything to the left of this combination is used as a link to the thumbnail, and everything to the right as a link to the full image size:
If the “||” combination is not found in the content, the entire content will be used as a link to a full-size image.
-
So, unfortunately, this is the current limitation - you can try to change the default "thumb image upload" resolution is defined in WP config.
- If you wish, you can read more details on how uploading image sizes works in WordPress here.
I hope this helps.
2. Or, if you just wish to manipulate the images from a specific column;
you can use a CSS selector like this :
Just check the origin header of the column, in my test table i just called column "photo",
but you can check it in the column settings
So basically, after the td.column- ( and here the origin header name) img
I hope i explained that correctly, let me know if that makes sense.
-
Let me know if that helps, or if you need to achieve something else.
3. For manipulating image size when the Column is used as "Grouped column", you can use this CSS:
Here are my sample screenshots from a dummy table, "before" and "after" applied CSS :
If you wish to add this only for one table, add it to the table's Customize/Custom CSS,
or if you wish to add it to all tables, add the CSS to main plugin settings/Custom JS and CSS/Custom CSS.
Let me know if that helps.
Kind Regards,
Miloš Jovanović
[email protected]
Rate my support
Try our FREE mapping plugin! MapSVG - easy Google maps, interactive SVG maps and floor plans, choropleth maps and much more - https://wordpress.org/plugins/mapsvg-lite-interactive-vector-maps/
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables