Is there a way to make this happen?
I want to have a place to store our photos in Google Drive and have them present on a page similar to the photo I have attached here. Any ideas on how to achieve this? --------------------------...
Forum Discussion
Jennifer,
We have done this several times in our applications. It was a challenging puzzle but we finally got it working. If you are able to export a csv file of the photo links from Google, this method should work for you as well. Note that at least in Box (which we use as our cloud storage platform for this purpose), there are several types of links that can be produced. I believe we use the Share Link to display the photo on its own without the Box previewer and full navigation showing up. Play around with different link types if you are having similar issues.
We use a separate Photos table with links to the photo on the cloud server and create a [Preview] rich text field with an <img> tag to display the photo. If you want to add text under the photo like you have in your screenshot, you can also do this in the [Preview Field] with a bit more HTML. I'd also suggest setting a max-width and max-height in the <img> tag to keep the photos at a reasonable size.
Our [Preview] formulas is:
"<img src=" & ToText([Box URL]) & " style='max-height:300px;max-width:300px'></img>"
Next, you create a relationship with the parent table (call it Assets for now). Either allow it to create a new Related Asset field or create the field manually in the Photos table. You can then create a summary field of Combined Text type on the Preview field. This will create a multi-select field of all your photo previews. On your Assets table, create a formula-text field such as [Photo List] and the entire formula is:
ToText([Combined Text Preview])
This [Photo List] field will then display all your images back to back similar to your screenshot (with some pesky semi-colons between them). Note that if you want to have each photo linked to open full-screen or anything, you will need another field to parse each photo link out, such as:
var text photourls = [Photo List];
If(Part($photourls,1,";") != null,
"<a href='" & Part($photourls,1,";") & "' target='_blank'>" &
"<img height='200' src='" & Part($photourls,1,";") & "'/> </a>") &
If(Part($photourls,2,";") != null,
"<a href='" & Part($photourls,2,";") & "' target='_blank'>" &
"<img height='200' src='" & Part($photourls,2,";") & "'/> </a>") &
If(Part($photourls,3,";") != null,
"<a href='" & Part($photourls,3,";") & "' target='_blank'>" &
"<img height='200' src='" & Part($photourls,3,";") & "'/> </a>")
Either way, your end result looks like this:
Hope this helps point you in the right direction!
------------------------------
Oana Toma
------------------------------
We have done this several times in our applications. It was a challenging puzzle but we finally got it working. If you are able to export a csv file of the photo links from Google, this method should work for you as well. Note that at least in Box (which we use as our cloud storage platform for this purpose), there are several types of links that can be produced. I believe we use the Share Link to display the photo on its own without the Box previewer and full navigation showing up. Play around with different link types if you are having similar issues.
We use a separate Photos table with links to the photo on the cloud server and create a [Preview] rich text field with an <img> tag to display the photo. If you want to add text under the photo like you have in your screenshot, you can also do this in the [Preview Field] with a bit more HTML. I'd also suggest setting a max-width and max-height in the <img> tag to keep the photos at a reasonable size.
Our [Preview] formulas is:
"<img src=" & ToText([Box URL]) & " style='max-height:300px;max-width:300px'></img>"
Next, you create a relationship with the parent table (call it Assets for now). Either allow it to create a new Related Asset field or create the field manually in the Photos table. You can then create a summary field of Combined Text type on the Preview field. This will create a multi-select field of all your photo previews. On your Assets table, create a formula-text field such as [Photo List] and the entire formula is:
ToText([Combined Text Preview])
This [Photo List] field will then display all your images back to back similar to your screenshot (with some pesky semi-colons between them). Note that if you want to have each photo linked to open full-screen or anything, you will need another field to parse each photo link out, such as:
var text photourls = [Photo List];
If(Part($photourls,1,";") != null,
"<a href='" & Part($photourls,1,";") & "' target='_blank'>" &
"<img height='200' src='" & Part($photourls,1,";") & "'/> </a>") &
If(Part($photourls,2,";") != null,
"<a href='" & Part($photourls,2,";") & "' target='_blank'>" &
"<img height='200' src='" & Part($photourls,2,";") & "'/> </a>") &
If(Part($photourls,3,";") != null,
"<a href='" & Part($photourls,3,";") & "' target='_blank'>" &
"<img height='200' src='" & Part($photourls,3,";") & "'/> </a>")
Either way, your end result looks like this:
Hope this helps point you in the right direction!
------------------------------
Oana Toma
------------------------------
