Where can I put a static file in Beaker notebook so that my HTML can find it? - beaker-notebook

Where can I put an image or other static file in Beaker so that my HTML can find it? And will this image work if I share the notebook with someone else?

Put them in ~/.beaker/v1/web, and then from your HTML and JS you can refer to it with /user. For example if you have an image at ~/.beaker/v1/web/foo.jpg you can use it with img src="/user/foo.jpg">. See the tutorial.
Note that if you do this, the images will not work if you share the notebook with someone else. We are planning on a better solution for this, see Issue #430.

Related

How can I set a custom style for viewing images?

How can I do that? Because I don't really know the word but I hope somebody knows this.
If you guys don't understand this then there is a link.
https://media1.tenor.com/images/0f097ed319d498c2bda3d87ba4f6ff10/tenor.gif?itemid=12846096
It's a gif but they set it into a cool style and I don't know how to set it like that.
The page most likely isn't actually a gif image, it could be some file structure like
> tenor.gif
>> index.html
where tenor.gif is actually a folder, with index.html inside it. Per W3C standard, folders automatically open up index.html if there is one directly inside it.
You could put whatever html code you want in index.html and styling.
You can check the contrast of the styles in the CSS documentation, they usually add you to the styles and filters, so they are fully configurable

Bootstrap CSS & JSP

hope you're doing fine.
I am currently stuck with my Web App project. This is the context: I would like to code a Web App using J2E. There's a free template that I liked and thus I decided to download it. When starting to use it I notice the CSS isn't applied.
Instead of having this, I have this:
However I do not see where the error is. The CSS & Bootstrap files should be visible in the JSP file and IntelliJ recognizes them. However I can't display these files (whether css or even pictures) that are referenced in "href".
Here's the project structure and code, maybe something's wrong there.
I'm used to HTML and to my understanding JSP isn't too different. Are the referencings different though?
Thanks in advance for any help you'll give,
Fares
YES.
Found the answer. Put resources in different folder than WEB-INF.
I believe that, your HTML file is inside the WEB-INF folder, for the to work either remove the WEB-INF path
<link href='style/stylesheet.css'>
or move your HTML one folder up.

Why won't my image display despite correct src address? [html]

i'm new to html and css and i've decided to utilise my time spent commuting by doing a little coding on the go. As such, i've started a practice project using Droidedit for android, on my Galaxy S7, but now i've hit a bit of a head-scratcher. Attached images below:
With full URL code and result with full URL
With relative URL code and result with relative URL
Not sure where i've gone wrong here. The image is in the same directory as the html file.
Thanks in advance peeps!
You don't need that last "/" at the end after the jpg
I guess there could be an issue with path used to show the image. Instead of following
<img src="internal storage/download/htmlearning/jotpage1.jpg/" ...
try
<img src="jotpage1.jpg" ...
since your HTML file and image file are at same folder

How do we add an image that's not from google?

How do we add an image that's not from google? It's a picture I took myself on my mobile phone and emailed it to my computer.
When making a website. Just put all your files in 1 folder. You can have subfolders. When wanting to link an image just put it somewhere in that folder and then just use the path to it.
So you need to do is provide a source for the pictures to display.
you would do
Just make sure to reference where the picture is comming from, if its in the same location as your html this will work. If its in a folder then you need to specify
here is a good reference, W3 Schools will help you alot here
http://www.w3schools.com/html/html_images.asp
One of the site's rules is:
Don't ask about questions you haven't tried to find an answer for (show your work!).
I guess this is the reason why you got those minuses.
Read here: http://www.w3schools.com/html/html_images.asp about how to add images to HTML code.
A solution for your problem could be:
<img src="myimage.jpg">, if we add images from HTML code.
background-image: url(myimagee.jpg);, if we add images from CSS code.

ViewerJS not loading my pdf document

As said in the instructions at the site ViewerJS Instructions, I tried to embed my file like http://localhost/site/ViewerJS#../docs/mydoc.pdf
But this is not working.
My document is in the dir like
/docs/mydoc.pdf and a link like http://localhost/site/docs/mydoc.pdf is working perfectly. In href, I usually put docs/mydoc.pdf and that works. In the same way, as said in the instructions, my document is not loading.
Any help is appreciated.
The solution is simple. Move the ViewerJS to the root directory of the site. Everything is working perfectly.
So, the viewer is accessible like
http://localhost/site/ViewerJS/#../docs/mydoc.pdf