Skip to main content
O
oskarberntorp13-Aquamarine
13-Aquamarine
December 15, 2023
Solved

Display iframe in mashup

  • December 15, 2023
  • 1 reply
  • 5162 views

Hi,

I am trying to figure out how to display an external webpage in thingworx. I am trying to use an expression which then outputs html as a string of an iframe, The output of that expression is bound to the data property of the value display.

 

I have also tried to enter the html into a textinput, But the value display will only display the raw text and not the page which should render.

 

The value display is set to render the data as html.

 

Am I doing anything the wrong way, if so please advice me how to do.

Kindly

Oskar Berntorp

 

    Best answer by TonyZhang

    Hi @oskarberntorp ,

     

    Could you please try adding below in CustomCSS tab of the mashup?

    ptcs-value-display::part(overflow-control){
	height:100%;
}

ptcs-value-display::part(value-container){
	height:100%;
}

ptcs-value-display::part(item-value-container){
	height:100%;
 width:100%;
}

ptcs-value-display::part(item-value){
	height:100%;
 width:100%;
}

     Also, make sure the width='100%' and height='100%' style are applied to your iframe element.

    result = 
 "<iframe src='https://www.bing.com' width='100%' height='100%' title='Iframe Example'></iframe>";

     

    1 reply

    P
    PaiChung22-Sapphire I
    22-Sapphire I
    December 15, 2023

    Isn't there still a webframe widget?

    O
    oskarberntorp13-AquamarineAuthor
    13-Aquamarine
    December 18, 2023

    Hi,

    Thank you for answering,

     

    The WebFrame widget exists, but as I need to be able to allow the web page shown to use the webcam. The web frame widget is not flexible enougth as I can't control that I want to be able to use the microphone or web cam. That is why I need to use the iframe element in a value display widget.

     

    But my problem is that the value display shows nothing...

     

    So basically I need to customize the webframe to add an allow attribute (which is the way to allow microphone or camera in an iframe), but as I understand, the web frame widget does not give me that flexibility.

     

    // Oskar Berntorp

    Rocko
    Rocko19-Tanzanite
    19-Tanzanite
    December 18, 2023

    Have you set the Format dropdown in ValueFormat to "With Formatting" or "With Formatting/Unsanitized"?

    I suggest you make that working first, e.g. with a different target site. You will then also have to manage CSRF/CORS as well I guess.

    Terms & ConditionsAccessibility statement