Hi everyone!

Firstly, I just wanted to say that I'm still a newbie at designing websites and that this may be a stupid question but I'm going to ask it anyway because then at least I'll know that such thing is e.g. impossible or, hopefully doable.

So, the question is as follows. I was wondering whether it would be possible to create a website, then on this website ask the user to log in and once they log in, let's say they choose to go on Facebook (from my website), so the website redirects them to FB but at the same time my website changes (?) to kind of like a sidebar. It would include other websites within it. The sidebar could be used for the user to then switch to another website, without having to open up another tab. I also have other ideas on how it could work and what else it could do but I'll leave it on that for now since I have probably not explained it very well and made it quite confusing.

Hopefully, somebody will be able to help me and if you have any questions then don't hesitate to ask.

Thanks in advance.

Looks like what target="some_iframe" was intended for:

 

See demo:

http://jsfiddle.net/Nillervision/mmpba0y3/

 

Unfortunately with the case of Facebook, Facebook.com is sending some X-Frame-Options along with the response which prevents embeding in iframes from other domains the same goes for Google.

Edited October 2, 201510 yr by Nillervision

Thank you for actually showing me something which might be useful in the future but I guess that my idea is in fact impossible to do therefore I will have to either think of something else or change it. Also, how can I tell whether a website prevents such actions?

And actually, what if instead of actually redirecting to e.g. FB, the user would stay on my website but Facebook would be displayed in the middle, i.e. taking 90% of the page and the rest of my page would take the rest. Would that work or again no?

 

Btw. I know it's not really related to web design but I thought that I might ask anyway. Is a similar thing possible to do when it comes to creating an app? For example, log in to my app, then e.g. choose facebook, slide from the left, a sidebar comes up and then choose another app and switch to that. Would it work in that case?

Thanks.

Edited October 2, 201510 yr by Frenzyy

 

Also, how can I tell whether a website prevents such actions?

 

You might be able to examine the header response with the developer tool in Chrome or Firefox. But you can also just try it if you place a website as the src in your iframe and it doesn't render, the X-Frame-Options is probably set to "DENY"

 

 

...what if instead of actually redirecting to e.g. FB, the user would stay on my website but Facebook would be displayed in the middle, i.e. taking 90% of the page and the rest of my page would take the rest. Would that work or again no?

 

 

It's exactly the same scenario as before. Take a look at the demo I made. The Iframe can be placed anywhere on your page and take up however much space you specify. But it will not work if X-Frame-Options are set to DENY. Facebook does how ever allow you to embed different widgets on a website you can read about the options here: https://developers.facebook.com.

 

One thing you could do though is to is to have facebook open in a smaller browser window on top op your own site. You can do that with a JavaScript function called Window.open. The function takes window dimensions as one of its parameters (might not work in all browsers).

I made a tutorial about this function a few years ago.

You might be able to examine the header response with the developer tool in Chrome or Firefox. But you can also just try it if you place a website as the src in your iframe and it doesn't render, the X-Frame-Options is probably set to "DENY"

 

 

It's exactly the same scenario as before. Take a look at the demo I made. The Iframe can be placed anywhere on your page and take up however much space you specify. But it will not work if X-Frame-Options are set to DENY. Facebook does how ever allow you to embed different widgets on a website you can read about the options here: https://developers.facebook.com.

 

One thing you could do though is to is to have facebook open in a smaller browser window on top op your own site. You can do that with a JavaScript function called Window.open. The function takes window dimensions as one of its parameters (might not work in all browsers).

I made a tutorial about this function a few years ago.

Thank you, although I may not be able to do exactly what I wanted, this is really going to help. Thanks!

 

//

Actually, I've got one more question to ask you, since you seem like a person with a LOT of experience and knowledge.

Do you think that Squarespace is a good platform to create a website on or maybe I should try something else?

Edited October 2, 201510 yr by Frenzyy

Thank you, although I may not be able to do exactly what I wanted, this is really going to help. Thanks!

 

//

Actually, I've got one more question to ask you, since you seem like a person with a LOT of experience and knowledge.

Do you think that Squarespace is a good platform to create a website on or maybe I should try something else?

Thanks. But I have absolutely no knowledge about Squarespace. Usually these sorts of platforms can be OK for small businesses, hobbyist bloggers etc. but for something professional you would probably run into limitations very fast.

Designing, developing and maintaining a professional webpage is never as simple as all these platforms claims. I don't know what the purpose of your website is, but unless it is just some hobby project, you should really hire a professional developer/designer or agency.

Edited October 2, 201510 yr by Nillervision

In that case, what would your recommendation be for me, in order to be able to create something where I won't really be limited by a platform but on the other hand, I don't need to be a pro to do it, since I'm not one. In other words, what is the best place to start off with from 'scratch'. I hope that you know what I mean.