Display Image from 3rd party server via SObject field URL

  • 1
  • Question
  • Updated 5 years ago
  • Answered
I'm 3 days into Skuid and loving it. 

I'm looking to display a photograph on our student detail records, however I don't want to have to add the photos to Salesforce as attachments/images.

We already have the images on a gallery type website, and I have the URL's that I can add to the custom Student Object.  The field would be a text field with the full "http://server.com/images/12345.jpg"; sort of thing.

Would I use an inline snippet to render the image as a field?  I don't suppose anyone has such a snippet around already..... :D
Photo of Seth Vanderdrift

Seth Vanderdrift

  • 878 Points 500 badge 2x thumb

Posted 5 years ago

  • 1
Photo of Rob Hatch

Rob Hatch, Official Rep

  • 44,006 Points 20k badge 2x thumb
No snippet needed.  Really only a bit of HTML code needed. 

Drag a Template component into your page (or into your field editor). 
Make sure the "HTML property" is selected. 
Add some code that looks like this:   <img src="{{{Image_FIeld__c}}}"/>

Make sure trhat field is in the model that is driving the template or field editor. 

Hopefully that works. 
 
Photo of Seth Vanderdrift

Seth Vanderdrift

  • 878 Points 500 badge 2x thumb
Thank you very much, I totally overlooked the Template component.
Photo of Brandon Klapholz

Brandon Klapholz

  • 390 Points 250 badge 2x thumb
Is there a way to extend this a bit so that when the image is clicked it redirects to a different page (similar to how the native Skuid photo view does)?
Photo of Rob Hatch

Rob Hatch, Official Rep

  • 44,006 Points 20k badge 2x thumb
Absolutely - just wrap your <IMG> tag in a <A Href> tag, that includes a relative link to the salesforce page you want to go to.  Use the same Merge syntax to pass in the ID of the page you are interestedin going to.  The sum total of your Template might look like this: 

<a href="/{{{Id}}}"><img src="{{{Image_FIeld__c}}}"/></a>