Message Boards Message Boards

0
|
18203 Views
|
4 Replies
|
6 Total Likes
View groups...
Share
Share this post:

How to link CSS file to deployed Wolfram Cloud webpage

Posted 10 years ago

How to link a CSS file to a Wolfram Cloud webpage...

First a realy simple css text producing a blue background.

cssfile =
  "  body {background-color:  #b0c4de;}";

This is the webpage calling for cssfile.css

pg =
  "
  <!DOCTYPE html>
  <html>
  <head>
  <link href='cssfile.css' type='text/css' rel='stylesheet'>
  </head>
  <body>
  <h1> very simple webpage </h1>
  </body>
  </html>
  ";

Put the page on the wolfram cloud webserver

p1 = CloudExport[pg, "HTML", "/csstest.html"]

put the cssfile.css on the server

Export["e:\\folder\\cssfile.css", cssfile, "Text"]
CopyFile["e:\\folder\\cssfile.css", CloudObject["/cssfile.css"]]

The following opens the html page but no blue background is present. Why?

SystemOpen[p1] 

This shows a mimetype of application/octet-stream. This should be text/css.

CloudObjectInformation[CloudObject["/cssfile.css"]]

The web page does not have a blue background.

enter image description here

This will get me a bit closer with mime type text/plain but no sigar. (also tried conversion to CSS but this does not work)

CloudExport[cssfile, "Text", "/cssfile.css"]

enter image description here

I am unable to make a webpage read another css file present on the Wolfram Cloud. I also made the css file public, no difference. If I ask a webpage to read a CSS file on my personal webserver it functions fine (if i remove the s in https).

So the central question is how to get a css file to be read with a text/css mimetype from the Wolfram Cloud. Any suggestions?

added a notebook with complete code I used in testing. Maybe it helps?

Attachments:
4 Replies

there is a better solution documented under ExportForm

In[11]:= css = CloudDeploy[ExportForm["body {background:red}", {"String", "text/css"}]]
Out[11]= CloudObject["https://www.wolframcloud.com/objects/efed42fb-fd69-42c1-985d-e141b0d698cf"]

In[13]:= Lookup[URLRead[css, "Headers"], "content-type"]
Out[13]= "text/css;charset=utf-8"

There is no good way to do this yet (I am working on a suggestion to get this designed/implemented).

But here is a possible way to do it (undocumented and may stop working at any time):

CopyFile[CloudObject["file.css"], CloudObject["file.css"], "MIMEType" -> "text/css"]

Basically this copies the file to itself and uses the "MIMEType" option that CopyFile happens to support.

POSTED BY: Arnoud Buzing

Note: The documentation on HTML explains there is a Export[] function with a setting "CSS" -> "file.css". I could no get it work. Please advise?

Arnoud, Thank you for this (temp) solution. This allows us to put a company style into the app we designed.

Kind regards, Pieter

Reply to this discussion
Community posts can be styled and formatted using the Markdown syntax.
Reply Preview
Attachments
Remove
or Discard

Group Abstract Group Abstract