New Shopify Certification now available: Liquid Storefronts for Theme Developers

Fullscreen 3D Model

Solved
harrytmd
Tourist
12 0 1

Would anyone be able to provide the code to make this embedded model full screen and central as opposed to tiny and sat to the left? (Password to store is just 'Password'.

 

https://www.tailormadedesigns.co.uk/pages/3d-model

 

Embed code is:

 

<div class="sketchfab-embed-wrapper"> <iframe title="J25870C" frameborder="0" allowfullscreen mozallowfullscreen="true" webkitallowfullscreen="true" allow="autoplay; fullscreen; xr-spatial-tracking" xr-spatial-tracking execution-while-out-of-viewport execution-while-not-rendered web-share src="https://sketchfab.com/models/44af0e276fe14738834154a43eb12369/embed"> </iframe> <p style="font-size: 13px; font-weight: normal; margin: 5px; color: #4A4A4A;"> <a href="https://sketchfab.com/3d-models/j25870c-44af0e276fe14738834154a43eb12369?utm_medium=embed&utm_campai..." target="_blank" rel="nofollow" style="font-weight: bold; color: #1CAAD9;"> J25870C </a> by <a href="https://sketchfab.com/Tailormade?utm_medium=embed&utm_campaign=share-popup&utm_content=44af0e276fe14..." target="_blank" rel="nofollow" style="font-weight: bold; color: #1CAAD9;"> Tailor-made Designs </a> on <a href="https://sketchfab.com?utm_medium=embed&utm_campaign=share-popup&utm_content=44af0e276fe14738834154a4..." target="_blank" rel="nofollow" style="font-weight: bold; color: #1CAAD9;">Sketchfab</a></p></div>

https://www.tailormadedesigns.co.uk/
Accepted Solution (1)
SItaliaCompany
Shopify Partner
77 8 7

This is an accepted solution.

Add this code to the section "CSS Custom" of your theme editor:

.sketchfab-embed-wrapper iframe{
width:100%;
height:800px;
}

View solution in original post

Replies 5 (5)
SItaliaCompany
Shopify Partner
77 8 7

This is an accepted solution.

Add this code to the section "CSS Custom" of your theme editor:

.sketchfab-embed-wrapper iframe{
width:100%;
height:800px;
}
harrytmd
Tourist
12 0 1

I can't find this in the dawn theme. Would it be under Base CSS?

https://www.tailormadedesigns.co.uk/
SItaliaCompany
Shopify Partner
77 8 7

Not in the Theme code editor, just in the theme customizer on the side panel

harrytmd
Tourist
12 0 1

Just added it to Base CSS and worked perfectly. Thank you.

https://www.tailormadedesigns.co.uk/
PageFly-Richard
Shopify Partner
3678 807 1455

Hi @harrytmd 

This is Richard from PageFly - Shopify Page Builder App, I’d like to suggest this idea:
Online Store ->Theme ->Edit code
Assets ->Base.css

.sketchfab-embed-wrapper iframe{
   width:100% !important;
   height:800px !important;
}

Hope you find my answer helpful!
Best regards,
Richard | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.