WordPress Avada Help8889
Pages:
1
Hartland, Wisconsin |
htimsabbub23 private msg quote post Address this user | |
I am working with the avada wordpress theme for and using the fusion slider. My problem is that the button I am using when you click on the link it opens another window. I would like to click on the button and open up the virtual tour over the existing page and then as an iframe. Can someone please help me with the code to do that [fusion_button link="https://my.matterport.com/show/?m=Pr31AeHS1kQ" size="" type="" shape="" target="_self" title="" gradient_colors="#2d8cc0" gradient_hover_colors="#2d8cc0" accent_color="#000" accent_hover_color="#2d8cc0" bevel_color="#2d8cc0" border_width="1px" shadow="" icon="" icon_divider="yes" icon_position="left" modal="" animation_type="0" animation_direction="down" animation_speed="0.1" class="" id=""]Virtual Tour.[/fusion_button] Thanks, Brad |
||
Post 1 IP flag post |
Adjusters_IO private msg quote post Address this user | ||
Good evening Brad, Have a look at this page we put together for you on a demo site running the latest version of Avada. If this is something you are looking for, PM me here and we will be happy to give you admin access to the site so you can do a stare and compare. https://avada.adjusters.io/?page_id=639 Note - The test page was put together in a hurry and is currently optimized for desktop, it may look a funky on a mobile device. If you decide you want to get in there and mess around, this is sandbox site running at AWS, you can play with it, break it - no worries. Regards, Michael Clendening |
||
Post 2 IP flag post |
Adjusters_IO private msg quote post Address this user | ||
The short answer to getting this work is to do the following: Create a one column container anywhere on the same page the slider is on. On the Container Design tab, adjust the parameters for the Padding to be 0px, otherwise you will unnecessary space on the page. Add the modal element in the one column with the following fields filled in: - Name of Modal: matterport_modal - Modal Heading: Put anything in here you want, or leave it blank - Size of Modal: Either Small or Large - Adjust the rest of parameters to suite. Replace the button code in your slider to be: [fusion_button link="" text_transform="" title="" target="_self" link_attributes="" alignment="center" modal="matterport_modal" hide_on_mobile="small-visibility,medium-visibility,large-visibility" class="" id="" color="default" button_gradient_top_color="" button_gradient_bottom_color="" button_gradient_top_color_hover="" button_gradient_bottom_color_hover="" accent_color="" accent_hover_color="" type="" bevel_color="" border_width="" size="" stretch="default" shape="" icon="" icon_position="left" icon_divider="no" animation_type="" animation_direction="left" animation_speed="0.3" animation_offset=""]Matterport Virtual Tour[/fusion_button] |
||
Post 3 IP flag post |
Adjusters_IO private msg quote post Address this user | ||
I left out an important part of making this work in the previous post (smh)! Add the following to the Modal element plugin. Contents of Modal field: Select the Text tab on the right and then paste in the following code: <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style><div class='embed-container'><iframe src='https://my.matterport.com/show/?m=Pr31AeHS1kQ' width='853' height='480' frameborder='0' allowfullscreen='allowfullscreen'></iframe></div> We also adjusted the code to be Mobile, Desktop and Tablet friendly. Regards, Michael Clendening |
||
Post 4 IP flag post |
Hartland, Wisconsin |
htimsabbub23 private msg quote post Address this user | |
@Adjusters_IO Thanks for getting back to me. I wont be able to look into this until Sunday but just wanted to say thanks and I appreciate you taking the time to help. | ||
Post 5 IP flag post |
Adjusters_IO private msg quote post Address this user | ||
No problem Brad. Also, we have working examples of Matterport embedded in an Elementor slider, which is a much lighter framework than Avada Fusion builder. Regards, Michael Clendening |
||
Post 6 IP flag post |
Pages:
1This topic is archived. Start new topic?