[xwiki-users] External CSS?
Hello guys first sorry for my english wich is not as good as i would ;) I'm a newbee on xwiki (but i know html), in fact i'm an end-user and i can only acces to the wysiwyg and the source on the xwiki pages (not the admin) BUT i need to use a CSS on some one. I try to put my css file as an attached file of my xwiki page, and using this command-line on the source code: {{velocity}} $xwiki.ssfx.use('bin/download/Space_test/testcss/csstable.css', true) {{/velocity}} or this one: {{velocity}} $xwiki.ssx.use('csstable.css') {{/velocity}} but it always looking for the file "csstable" in the directory skin/albatross or ssx. Is there any solution that's make the file "csstable.css" loading into the right directory (even if it's an external link to another server) or any other workaround (in fact, i've got several tables on my xwiki page, and i don't want to use, each time, the source code to edit the css of each td)?! I know that it will be more usefull if the admin of the xwiki could change this css, but i'm not sure he would like. Thanks for your help regards Jerome
On Wed, Sep 19, 2012 at 1:25 PM, Jerome@home <[email protected]> wrote:
Hello guys first sorry for my english wich is not as good as i would ;) I'm a newbee on xwiki (but i know html), in fact i'm an end-user and i can only acces to the wysiwyg and the source on the xwiki pages (not the admin) BUT i need to use a CSS on some one. I try to put my css file as an attached file of my xwiki page, and using this command-line on the source code: {{velocity}} $xwiki.ssfx.use('bin/download/Space_test/testcss/csstable.css', true) {{/velocity}} or this one: {{velocity}} $xwiki.ssx.use('csstable.css') {{/velocity}} but it always looking for the file "csstable" in the directory skin/albatross or ssx.
Is there any solution that's make the file "csstable.css" loading into the right directory (even if it's an external link to another server) or any other workaround (in fact, i've got several tables on my xwiki page, and i don't want to use, each time, the source code to edit the css of each td)?! I know that it will be more usefull if the admin of the xwiki could change this css, but i'm not sure he would like.
Currently it's not possible to load as skin extension a CSS/JavaScript file that is attached to a wiki page. If the file is not very big you can paste its content in a skin extension object. See http://platform.xwiki.org/xwiki/bin/view/DevGuide/SkinExtensionsTutorial . Hope this helps, Marius
Thanks for your help regards Jerome _______________________________________________ users mailing list [email protected] http://lists.xwiki.org/mailman/listinfo/users
On Sep 20, 2012, at 3:43 PM, Marius Dumitru Florea <[email protected]> wrote:
On Wed, Sep 19, 2012 at 1:25 PM, Jerome@home <[email protected]> wrote:
Hello guys first sorry for my english wich is not as good as i would ;) I'm a newbee on xwiki (but i know html), in fact i'm an end-user and i can only acces to the wysiwyg and the source on the xwiki pages (not the admin) BUT i need to use a CSS on some one. I try to put my css file as an attached file of my xwiki page, and using this command-line on the source code: {{velocity}} $xwiki.ssfx.use('bin/download/Space_test/testcss/csstable.css', true) {{/velocity}} or this one: {{velocity}} $xwiki.ssx.use('csstable.css') {{/velocity}} but it always looking for the file "csstable" in the directory skin/albatross or ssx.
Is there any solution that's make the file "csstable.css" loading into the right directory (even if it's an external link to another server) or any other workaround (in fact, i've got several tables on my xwiki page, and i don't want to use, each time, the source code to edit the css of each td)?! I know that it will be more usefull if the admin of the xwiki could change this css, but i'm not sure he would like.
Currently it's not possible to load as skin extension a CSS/JavaScript file that is attached to a wiki page. If the file is not very big you can paste its content in a skin extension object. See http://platform.xwiki.org/xwiki/bin/view/DevGuide/SkinExtensionsTutorial
Well it's possible with a a trick… Here's an example: /* Inject an extra javascript script tag into the current DOM using the given script location/source. */ var importScript = function(src) { var script_tag = document.createElement('script'); script_tag.type = "text/javascript"; script_tag.src = src; document.getElementsByTagName('head')[0].appendChild(script_tag); } #set ($attachmentName = 'codemirror.zip') importScript("$xwiki.zipexplorer.getFileLink($doc, $attachmentName, 'lib/util/match-highlighter.js')"); -Vincent
.Hope this helps, Marius
Hi Jerome, In order to include external CSS/JavaScript files, you need to create a Skin Extension page [1] (as Marius pointed out), and you have 2 options: 1) copy/paste the content of the css/javascript file into the StyleSheetExtension/JavaScriptExtension object OR 2) include your external file from within the SkinExtension. Option 2 is obviously the most appealing. - For JavaScript, Vincent just gave you the piece of JavaScript code to use in your JavaScriptExtension object - For CSS, you need to use an @import declaration in the content of your StyleSheetExtension like so: @import "$xwiki.getAttachmentURL('Space_test.testcss', 'csstable.css')"; Make sure that this is the fist line in your StyleSheetExtension object's content and that the content is parsed ("Parse content" is set to "Yes"). If you want to use a css file from a different website, you could just specify the URL of the file instead of the $xwiki.getAttachmentURL(...) call. You can now use your skin extension where you need it and it will allow you to use whichever file you like. Hope that helps, Eduard ------- [1] http://platform.xwiki.org/xwiki/bin/view/DevGuide/SkinExtensionsTutorial On Thu, Sep 20, 2012 at 4:52 PM, Vincent Massol <[email protected]> wrote:
On Sep 20, 2012, at 3:43 PM, Marius Dumitru Florea < [email protected]> wrote:
On Wed, Sep 19, 2012 at 1:25 PM, Jerome@home <[email protected]> wrote:
Hello guys first sorry for my english wich is not as good as i would ;) I'm a newbee on xwiki (but i know html), in fact i'm an end-user and i can only acces to the wysiwyg and the source on the xwiki pages (not the admin) BUT i need to use a CSS on some one. I try to put my css file as an attached file of my xwiki page, and using this command-line on the source code: {{velocity}} $xwiki.ssfx.use('bin/download/Space_test/testcss/csstable.css', true) {{/velocity}} or this one: {{velocity}} $xwiki.ssx.use('csstable.css') {{/velocity}} but it always looking for the file "csstable" in the directory skin/albatross or ssx.
Is there any solution that's make the file "csstable.css" loading into the right directory (even if it's an external link to another server) or any other workaround (in fact, i've got several tables on my xwiki page, and i don't want to use, each time, the source code to edit the css of each td)?! I know that it will be more usefull if the admin of the xwiki could change this css, but i'm not sure he would like.
Currently it's not possible to load as skin extension a CSS/JavaScript file that is attached to a wiki page. If the file is not very big you can paste its content in a skin extension object. See http://platform.xwiki.org/xwiki/bin/view/DevGuide/SkinExtensionsTutorial
Well it's possible with a a trick…
Here's an example:
/* Inject an extra javascript script tag into the current DOM using the given script location/source. */ var importScript = function(src) { var script_tag = document.createElement('script'); script_tag.type = "text/javascript"; script_tag.src = src;
document.getElementsByTagName('head')[0].appendChild(script_tag); }
#set ($attachmentName = 'codemirror.zip') importScript("$xwiki.zipexplorer.getFileLink($doc, $attachmentName, 'lib/util/match-highlighter.js')");
-Vincent
.Hope this helps, Marius
_______________________________________________ users mailing list [email protected] http://lists.xwiki.org/mailman/listinfo/users
participants (4)
-
Eduard Moraru -
Jerome＠home -
Marius Dumitru Florea -
Vincent Massol