As I understand it, wikidot uses iFrame to embed html/javascript code into its pages, mostly for security reasons. The problem is that this technic has strong limitations, especially regarding the use of Javascript/DOM function calling CSS classes/IDs. For instance, It seems to be impossible to use some jQuery functionnalities in order to modify blocks using CSS transformation (fadeOut effects for instance). The simple reason is that the javascript code do not recognize any CSS file since it is located inside an iFrame.
iFrame seem to be a very temporary solution to me, and some important limitations in terms of page customization could appear more an more as jQuery and other javascript libraries are becoming a standard in web design.
Is there any chance that Wikidot would get rid of the iFrame technics in a near future version ?
Thanks
m.
It is possible to apply css to the html block by inserting the style tag in the block:
Kenneth Tsang (@jxeeno)
Of course, but in this case, you'll reach only the blocks that are included inside the iFrame, not outside.
For instance, if you want to add some cool jQuery fonctionalities to modify a list-page module result, the code included inside the iFrame won't reach your list-page blocks.
Due to security reasons it can't be completed.
Piotr Gabryjeluk
visit my blog
activeside, Wikidot has made a decision to allow Javascript only from an iframe based on the security implications of doing otherwise. That is their decision to make.
You can either have full control and spend a lot of time building and maintaining a website in HTML and Javascript, or you can use Wikidot to build and maintain the website a lot easier using wiki syntax - but you sacrifice some of the control you have in the process.
It's up to you to decide which one suits your needs best. It's just the way it is…
~ Leiger - Wikidot Community Admin - Volunteer
Wikidot: Official Documentation | Wikidot Discord server
Thanks for your reply. It makes much more sense.
I agree with you: we can't have everything, both the simplicity of the wiki technology AND the flexibility of a "hand-made" website.
I am definitely not a development expert. It just seems too me that the iFrame solution - as secure as it probably is - may not be the only secure solution. And I just wanted to open the discussion on it.
Why don't you embed the jQuery code in the html block?
Kenneth Tsang (@jxeeno)
If you do that, wikidot will automatically create an iFrame to embed the jQuery. This is the point of my comment.
It is possible with clever use of Javascript, [[embed]] iframes and code blocks instead of html blocks. This requires the use of hashes in url.
Kenneth Tsang (@jxeeno)
Could you give an example ?
Actually, you're right. It seems that the deprecated [[embed]] tag does not generate any iFrame tag. I'm going to make some test, hoping wikidot does not decide to get rid of it…
Security doesn't require discussion.
Piotr Gabryjeluk
visit my blog
You can still discuss your needs and how they can be achieved with current state of how Wikidot at this thread or at community forum.
Piotr Gabryjeluk
visit my blog
This problem (and I do understand the security reasons for it) is interfering with a key feature on one of my sites. I recently implemented a control in JavaScript that retrieves and processes a set of Twitter results. When you click on a link within the control, the page loads within the iFrame that Wikidot creates for the control, instead of the whole window or tab. This isn't that big of an issue for external websites (better to keep them within my application, even if it looks bad). However, it's preventing me from making links back into my own site. See this page for an example.
Jay Bienvenu | Hilinqwo: A constructed language
You can use window.location.href = 'xxx' to load the document in the top level frame instead of the iframe.
Piotr Gabryjeluk
visit my blog
Gabrys,
My concern is not so much about loading a document from a javascript than reaching the page elements from this javascript. For instance, I would like to add a fadeOut effect by clicking on the "list-pages-item" DIVs (from the list-page module). This requires calling the .list-pages-item class from within the javascript. And I can't figure a way around it.
If you have a solution (which preserves security), I'll be more than happy to try it.
Thanks
That sounds like something that can be done using CSS, and it'll work even for browsers that have Javascript disabled.
~ Leiger - Wikidot Community Admin - Volunteer
Wikidot: Official Documentation | Wikidot Discord server
leiger, it could only work with CSS3, which is poorly supported by today's browsers.
activeside: Probably there's no portable way of doing animations of the Wikidot content.
Piotr Gabryjeluk
visit my blog