Displaying images

Hi Mark,

Thanks for the post!

First thing first, it looks like you’re table is set to Auto-hide columns. Your image column is near the end so it’s currently hidden on the table view.

You can change the Responsive option of your table by going to Table Builder > TABLE > Responsiveness. More information here: Responsiveness | WP Data Access

Sadly, I can’t now access the old Data Publisher module (that I understood how to use), so I can’t create it the old way.

You can still access the legacy Table Builder by clicking on Tables from the top toolbar.

See here: https://share.zight.com/L1uEYmP5

We still urge you to familiarize yourself or start creating new tables using the App Builder as the old one will be removed next year. ??

In the “Manage Table” option under “Settings” and “Columns,” the relevant column is marked as type “Image URL” but strangely, in the “Manage Table” option under “Actions”, the copiable SQL code shows it as “text.” The same is true using the old Data Explorer.

The column’s media type that is accessed through Settings > Columns is separate from the column’s true column type you see in your database table. The purpose of media type serves as a plugin feature only and will not work somewhere else. Eg. an Image URL column will only be an Image URL column in WP Data Access.

In the Data Explorer, selecting the “Table Builder” icon and then “Columns” brings up other options. The Column metadata for the relevant column here shows “text.”

The column metadata shows information on how your column is stored in the database. An image URL can still be stored as text in your column.

What, if anything, am I doing wrong?

Everything looks good except the image column is currently hidden from table view, so we can’t check yet. Also, some elements in your table are pushed to the side, so there might be styling issues happening on the page.

Here’s a short demo on how to set up a table with images: https://share.zight.com/4guG7onW

Hope that helps! Let us know if you have other questions.

• This reply was modified 2 months, 3 weeks ago by Kim L. Reason: added link

Hello @kimmyx

Thanks ever so much for getting back to me on this, and so promptly, too!

First thing first, it looks like you’re table is set to Auto-hide columns. Your image column is near the end so it’s currently hidden on the table view.

You’re right. The auto-hide was a deliberate choice. In the past, I’ve not been keen on horizontal scrolling tables, though now I’ve tried this one, I can see it’s quite tidy on mobile and PC screen and I may keep it!

You can still access the legacy Table Builder by clicking on Tables from the top toolbar.

Thanks for this. I’ll be honest – that’s how I created the table on this occasion for speed! What is missing is the old Data PUBLISHER module – so I had to go to the App Builder to publish the data. I will try to familiarise myself with the new process going forwards.

I think I understand all you have written about the way data is stored (including your comments on metadata) and am reassured by your comment that “everything looks good.” I note that I am not trying to use the Image URL column data anywhere outside WP Data Access…

So, having enabled the horizontal scroll so the full table can be seen, it is clear that the images (where there are connected image files), are [now] displaying correctly in the table. However, they are not showing correctly when the user clicks the “Eye” icon to reveal the full row entry (what used to be the green “+” button); the last row of that view reveals the URL of the image as a line of text, not the image itself. Use “Plot A2” as an example and you will see what I mean – there’s an image in the table, but not in what I might call the “full entry view.” That’s where I was hoping to show the image (rather than in the right hand of a horizontally-scrolled table). See Churchyard – Widford Church for a table I created the old way last year which shows it working properly.

Any thoughts on this?

Finally, you note

Also, some elements in your table are pushed to the side, so there might be styling issues happening on the page.

I’m not sure which elements you have in mind, or how I might alter them. I am quite keen that more data should be shown up-front (there’s loads of empty space on screen between columns, and only two columns visible on mobile which is less than helpful). I am also eager to redesign the “full entry view” so that it takes up less room and needs less scrolling to read it all, but I’ve not worked out how to do that yet. Any pointers about how to do any of this would be really helpful.

With many thanks,
Mark

Hi @revcoincidence,

Thanks for the response!

You’re right. The auto-hide was a deliberate choice. In the past, I’ve not been keen on horizontal scrolling tables, though now I’ve tried this one, I can see it’s quite tidy on mobile and PC screen and I may keep it!

The next update will have a new feature called Detail Panel Viewing that is similar to an expandable row. This way, you can switch back to autohiding your columns if you want. ??

What is missing is the old Data PUBLISHER module

Data Publisher was renamed to Table Builder some time ago, but this will be irrelevant in the future as legacy tools will be replaced soon. ??

However, they are?not?showing correctly when the user clicks the “Eye” icon to reveal the full row entry (what used to be the green “+” button); the last row of?that?view reveals the URL of the image as a line of text, not the image itself.

This is currently the limitation of using Image URL as the media type for a column. The Detailed Panel Viewing I mentioned above will be a solution to this. Here’s a sneak peek of what it looks like: https://share.zight.com/mXuQm1ez

Peter has plans on adding more viewing options in the future, and the modal type option is a possibility, but we don’t have a definie ETA yet. ??

I’m not sure which elements you have in mind, or how I might alter them. I am quite keen that more data should be shown up-front (there’s loads of empty space on screen between columns, and only two columns visible on mobile which is less than helpful).

This is what I mean: https://share.zight.com/5zuoJBZJ I think there’s a styling conflict with your theme that’s making them get pushed to the side. Usually, the table title is aligned to the left. Could you test with a default WordPress theme?

I am also eager to redesign the “full entry view” so that it takes up less room and needs less scrolling to read it all, but I’ve not worked out how to do that yet. Any pointers about how to do any of this would be really helpful.

You can actually rearrange the fields to a grid. ?? The fields in the Form Builder are organized using Grids which consists of?rows?and?cells. You can read more about it here: What is the Grid? | WP Data Access

Let me know if you have more questions. ??

Hello again, @kimmyx

This is really helpful. Thank you for your patience with me.

The Detail Panel Viewing option sounds like the tool I need. In the meantime, I’ll keep using the horizontal scroll option on the full table and advise people to scroll right rather then click the eye icon. Sadly, it’s only a small image. What I’d really like is for users to be able to click the image and have it expand to fill the screen, but clicking the image just selects the table row…

I use the Image URL (for the memorials) because I’m uploading data from a CSV spreadsheet stored offline which refers to a URL (calculated from an automated EXCEL CONCATENATE function based on the plot reference). I upload new image files when the memorials change (e.g. a new inscription is added), and the uploaded CSV then just matches with it without requiring further manual interference. This suits me very well. Please can you confirm there’s no intention of removing the “Image URL” column type?

Thank you for explaining about the theme. You’re right… using WP’s own 2019 theme relocates the table’s title to the left. I’m actually happy with the layout as is, so for the time being I won’t be changing theme – but thanks for the heads-up.

I am grateful, too, for the link to the Grid example, which I had obviously seen somewhere which is why I was aware that the display could be adapted. However, it looks like this is a premium feature related to form entry rather than a free feature related to data display. If so, this is probably why I am struggling to find it. Can you confirm?

Many thanks,
Mark

Hi @revcoincidence,

What I’d?really?like is for users to be able to click the image and have it expand to fill the screen, but clicking the image just selects the table row

Do you mean something like a lightbox for images?

Please can you confirm there’s no intention of removing the “Image URL” column type?

Don’t worry. There are currently no plans to remove this column type. ??

However, it looks like this is a premium feature related to?form?entry rather than a free feature related to?data display. If so, this is probably why I am struggling to find it. Can you confirm?

That is correct. This option is currently only available in the premium version of the plugin. ??

Let us know if you have other questions.

Thanks @kimmyx

Yes, I think a lightbox would be ideal – though it would have to show the image at full-size (or even zoom-able), not merely repeat the same-size image from the data table. It would even be an improvement if I could simply click the picture and see the image url opened in a new browser tab (i.e. to show the whole picture), but a popup lightbox would be perfect.

Thanks for the clarification on the other items. In regard to the latter, I’m trying to keep down costs for my charity, so for the time-being I won’t be purchasing the premium version. (Not even if you put the lightbox in it!)

Thank you for all your help,
Mark

Hi @revcoincidence,

Thanks for the response. I’ll inquire about the possibility of opening images to a lightbox to Peter. ??

Feel free to create a new post if you have other questions. ??

Good morning, @kimmyx

I will mark this as resolved even though it’s not quite yet.

Many thanks for all your help,

Mark