Shape 5

my sites www.pchelicopters.com and pcsimulators.org look fine in desktop mode on chrome and ie but dont look right on firefox in desktop mode and on mobile phones apple and android, can you help?

Hello,

Can you please be more specific, what issues are you seeing? I looked at your site and the only issue I see is you are using a non-responsive module in the right position. You have an iframe that has a set width on it so it spills over the edges:

<iframe width="480" height="270"

videos are on top of each other as in attachment

another example of the issue attached

Hello,

This your own content that you have added, the template won't control that. As I stated above you are using a set height and width on the video, that's the first thing that should be corrected. What is the exact code that you are using to output the player with? Also, in the media player's backend make sure you have responsive enabled.

I used the demo module that came with the template - TitanFall Banner Ad class=hide_900 show_mobile and inserted the following below into the module? What do I need to do to fix this?

Respoosive is enabled. I have attached a screenshot of what it looks like on firefox


{s5_media_player media=[video] video_youtube=[hCF1j9fvzHk]}
Train Simulator Chengdu to Suining High Speed Route
 
 
{s5_media_player media=[video] video_youtube=[gGPiGPZJDZo]}
X-Plane Aircraft - Payware, Freeware and Stock Aircraft
 
 

Hello,

I see, it's because you are using youtube videos. You can't have those videos responsive, because the player can't detect the aspect sizes of the video being that it's called in an iframe.

I would recommend swapping those videos out for actual youtube embeds. You would use this in a custom html module:

<div class="video-container">
         <iframe src="http://www.youtube.com/embed/YOUR ID GOES HERE" frameborder="0" width="560" height="315"></iframe>
</div>

And then add the following css to the template's custom.css file:

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
}
 
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

i did that but all i see now is the code above on the page? i inserted the text into custom.css , can you confirm the location of custom.css in case there is more than one??

i have attached the custom.css and the screenshot, it just shows the code from the custom.html

Hello,

You have inserted the code into the editor, not the html code tab. If you can private message me super admin access and ftp access I can set these up for you.

thanks for the reply , im inserting the code below into custom html module how do i insert it into the html code tab? where is this option?


<div class="video-container">
         <iframe src="http://www.youtube.com/embed/YOUR ID GOES HERE" frameborder="0" width="560" height="315"></iframe>
</div>

its ok i found it now its toggle editor and now it looks better on the mobile but how do i put a space between the videos as they are next to each on the desktop version

still getting issues on mobile, which positions can be used in the template to auto resize, i dont really want to be inserting code everywhere?

Alternatively what can i use for the videos to be auto resized, the desktop site is fine its just the mobile versions which dont look right

Thanks for your help

Hello,

The code I gave you above will automatically resize in any position, on any device. Make sure you are clearing your cache on mobile.

Again, if you can private message me super admin access and ftp access I can set them up, but you appear to have removed them from your homepage.

hi thanks again for the reply, the code did work but i was unsure how to add text and spaces in between , can you send me an example of this

eg how can i place text underneath the video eg "this is video 1" and add a line/carriage return?

<div class="video-container">
         <iframe src="http://www.youtube.com/embed/YOUR ID GOES HERE" frameborder="0" width="560" height="315"></iframe>
</div>

Hello,

That's all code that you would need to create. If you just want text under it though, you can it directly after the closing </div> tag. You can also add a
 call or two right before the text if you want more spacing.

Thanks Mike,

ill try that and let you know how it goes

thanks for your patience

Thanks Mike,

ill try that and let you know how it goes

thanks for your patience

ok ive done what you suggested and it works but each time i make a change the code disappears and it doesnt work

for example i place a custom HTML module in position above_module_1. I then insert the code  :

<div class="video-container">
         <iframe src="http://www.youtube.com/embed/WJcwoRkfChQ" frameborder="0" width="560" height="315"></iframe>
</div>
London Underground Simulator Review

It works great BUTwhen I go back in and change the heading or text and then when I refresh the page all i see is the text even though I havent edited the code?

If i re-enter the code its back again,  but this isnt ideal as I would need to sometimes edit text but each time I make a change i have to re-insert the code each time

When i click on the source code editor there is code there but  i dont see the original code above you sent me,  just the below..why is this?
<div class="video-container">&nbsp;</div>
<p>London Underground Simulator Review &nbsp;</p>

Hello,

You have something in your editor stripping the code then. I would suggest either completely turning off the editor or check the editor's settings in the plugin manager. In the editor's settings make sure Valid Elements is set to *

• which will allow elements in the editor.

thanks for the help, ive managed to use another plugin which automatically resizes the youtubelinks themselves so am using that at the moment

thanks for all your advice, much appreciated