• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

Testing website on responsive screen generators

BassMan

Well-known member
#1
I would like to test my XF in one of the resposnive screen generator (like http://ami.responsivedesign.is/), but my forum won't show. Even official XF website won't show.

Also tried some other resposnive generators, but no luck.

Can some tell me how to test my XF site in one of those generators?

Thanks in advance.
 

Brogan

XenForo moderator
Staff member
#4
That site uses iframes.

See the clickjacking option here: http://xenforo.com/help/config-php-options/

$config['enableClickjackingProtection'] - default: true
When enabled, this option prevents clickjacking attacks by placing your forum in an iframe and tricking the user into clicking something. However, this can also disable valid uses of iframe embedding. Disable this only if you understand the implications.
 

rainmotorsports

Well-known member
#12
Thanks, but I was thinking of something to show your website in different devices to take a screenshot after that.
Most of these image generators just want an image, not to actually load the website. Generate the screen shot at the equivalent PPI/DPI and insert.

For a couple android devices you can use this from google - http://developer.android.com/distribute/tools/promote/device-art.html

Not sure about apple but one thread linked this which is interesting but not free i dont think - https://placeit.net/

I can't find the promo images we did for the conversion but here is an example of something out of the device art generator:
Screenshot_2014-05-04-17-09-37_framed.jpg


For the actual screen shot I used the phone that matches the actual device pictured (Nexus 5) and did a screenshot. For other devices, resolutions, aspect ratios I photoshopped the notification bar and stuff in.
 

BassMan

Well-known member
#13
Most of these image generators just want an image, not to actually load the website. Generate the screen shot at the equivalent PPI/DPI and insert.

For a couple android devices you can use this from google - http://developer.android.com/distribute/tools/promote/device-art.html

Not sure about apple but one thread linked this which is interesting but not free i dont think - https://placeit.net/

I can't find the promo images we did for the conversion but here is an example of something out of the device art generator:
View attachment 82362

For the actual screen shot I used the phone that matches the actual device pictured (Nexus 5) and did a screenshot. For other devices, resolutions, aspect ratios I photoshopped the notification bar and stuff in.
Thank you for this. I'll browse further from your link.

I just thought of that when I saw some users upload screens with their published styles for forum and there are shown in different devices.
 

rainmotorsports

Well-known member
#14
Thank you for this. I'll browse further from your link.

I just thought of that when I saw some users upload screens with their published styles for forum and there are shown in different devices.
Ive seen one of the themer's have a preview on their site using 3 device images (laptop, phone and tablet) I kinda want to say it was pixelexit but maybe not. But its under the same concept except they have separated the device images and their preview screenshots.

It's definitely not fun not having the desired devices or similar to generate the shots so easily with. For my Nexus 10 shot I changed the phones DPI to match which made the phone almost impossible to use during because the buttons where tiny.