I can use image to embed an image in my scribble document, and the render function will copy it to the target destination. Now, I would also like to include files with my document that is not an image, such as an MP3 or PDF file that can be downloaded.
Additionally, I can't just include the file in the source folder and link to it, because if I render the document into a different target folder, it does not get copied.
Finally, I know I can just create the target directory by hand, and paste the file there. Or I can modify whatever file I'm using to build my document to copy the file. This is not satisfying though because now I have to track the image in two places. The .scrbl source file, and either the target directory or the build file.
So, is there a way in scribble that I can include a non scribble (or image) file such as an MP3 or PDF such that the render function knows to grab it and include it with the document?
Although it is a bit of a kludge, you can combine image with hyperlink to get your desired result. You use the image function to get the render function to copy the file, and hyperlink to add a link to it. Your document will look something like:
Here is a #image{file.mp3}#hyperlink["file.mp3"]{file}.
This works because the image function also expects a list of extensions to try to embed, but this list defaults to the empty list, and such it won't embed the file, but only copy it into the destination. You can then use hyperlink to link to the now copied file.mp3 file.
You can combine this into one operation with the following function:
(define (embed-file file . content)
(list
(image file)
(apply hyperlink file content)))
And now you can use embed-file in your own document with:
Here is a #embed-file["file.mp3"]{file}.
(I should note that this idea came from Ben Lerner.)
I took over somebody's code base and they had solved this issue using the solution above/below mine provided by Leif Andersen. However, this caused problems when linking to files that were part of subfolders in the source directory. The file in question was moved to the root of the output directory, while the hyperlink did not correctly update. Instead, I found the following less hack-y solution.
You can make use of the link-resource structure of the scribble/html-properties module. This expects the path of the original file. You place this link-resource into a style struct of the scribble/core module. Finally, this style is passed as an argument to hyperlink.
Putting it all together, the embed-file function instead becomes
(define (embed-file file . content)
(apply hyperlink
file
content
#:style (style "place-resources-in-output-folder" ; name
(list (link-resource file)))))
Where the "place-resources-in-output-folder" is just a name I give to the style.
This ensures the files are both moved to the root output folder and correctly linked.
Related
my directory is shaped like this
image
in order to use my navbar between different html files, I made it into a seperate html file and use a placeholder to insert it where i need it. the problem is that now the links get thrown off.
for example: when im on the index file, the link works without a problem. however, when im in the about_us file, the link throws a cannot find in directory error because it would need ../ in front of the link.
any javascript I have also does not work for the nav.html.
any suggestions? is there a way to create links and start the directory from the root?
To navigate to the correct HTML file, you have to pass the full path of the HTML file.
For eg: If your application is running in https://localhost:8080 than you have to pass the full path as below:
Home
About Us
Or if you directly opening the HTML file in your browser without any server, than pass the full path of your project folder as below:
Home
About Us
Note: Always use the file or folder name with a hyphen - or underscore _.
For eg: instead of html files rename your folder name as html_files or html-files.
Problem:
I have a table of images that I'm using as an overview/introduction. I want the end-user to be able to click on the image and it link to the HTML page for that image's corresponding introductory information1.
The problem is I can't seem to get the linking part to work. The table of images shows up fine, but clicking on an image just takes me to a page not found screen (see image at bottom of post). I've spent about an hour on Google but haven't found a solution yet.
1each image has a corresponding .rst file with the info I want the end-user to see
Info:
Sphinx 1.8.5
Python 3.7.6 (MiniConda)
Building html pages from reStructuredText files
sphinx-build -b html source build
make clean html
make html
Nothing special has been done in my conf.py file, other than including the RTD theme
I'm guessing I will need to do something fancy in my conf.py file if doing what I want is possible at all
Adding the .rst files to the .. toc:: directive in introduction_file.rst didn't help
Here is the reST code I have so far:
the image directives are all inside a table; table omitted for brevity
I'm also confident that the 'image directives inside a table' thing is not the issue
.. filename is "introduction_file.rst"
.. image:: images/my_first_image.png
:scale: 100%
:alt: My First PNG Image
:align: center
:target: introduction_files/my_first_image_intro_file.rst
.. also didn't work:
.. :target: introduction_files/my_first_image_intro_file.html
File Structure:
Home.rst is the entry point for the HTML pages (i.e. it used to be called index.rst until I renamed it and refactored conf.py accordingly)
--build
...
-- source
|--Introduction/
|--introduction_file.rst
|--images/
|--my_first_image.png
|--my_second_image.png
...
|--introduction_files/
|--my_first_image_intro_file.rst
|--my_second_image_intro_file.rst
...
|--_static/
...
|--_templates/
...
|--conf.py
|--Home.rst
I'm not opposed to doing what I want in HTML/CSS, but if there is a way to do it in sphinx then I'd prefer to do it that way. I will end up editing the HTML code regardless, but the less editing the better; Sphinx is essentially a quick-start or template.
This image is what I see in my browser when I click on one of the images in my table-of-images. The URL bar in Chrome shows the correct path to the .rst file though, so I'm a bit confused.
I tried changing the :target: file extension to .html but that didn't work either
Edit: forgot to add the location of introduction_file.rst to the folder structure
Solution:
Mix up between the paths. I was linking to the file in the source directory, but needed to link to the file in the build directory. Had to navigate back to the root directory with a few '../' prefixes, then navigate to the .html information file in the build directory. In other words, this is what it ended up looking like:
.. filename is "introduction_file.rst"
.. image:: images/my_first_image.png
:scale: 100%
:alt: My First PNG Image
:align: center
:target: ../../../build/html/Introduction/introduction_files/my_first_image_intro_file.html
The target option's value must be either relative to introduction_file.rst (you don't provide its location so you'll have to figure that out), or absolute to the documentation root, i.e., /Introduction/introduction_files/my_first_image_intro_file.html.
I am trying to add a raw html with a link to a .json file that is located in the _static folder.
.. raw:: html
<asciinema-player src="/_static/videos/quickstart.json"></asciinema-player>
This works fine locally, where the _static is always on the root of the domain but readthedocs adds a /en/latest to the start of the path.
Making the path relative works for the root domain, but if the raw HTML with a link has any additional path added to it (for example http://jak.readthedocs.io/en/latest/guide/usage.html) then it will say that static is located http://jak.readthedocs.io/en/latest/guide/_static/XYZ which will fail.
I would like to find a solve that works always, and preferably not hardcode /en/latest in case I want to version my documentation or add more languages.
Perhaps there is a better way of inserting the html?
I am trying to include some images in a Genshi template for my Trac plugin, but it always shows only the alternative text because it cannot find the images.
I have the following (X)HTML code:
<div>
<img src="file://c:/path/to/image.png" alt="asdf" />
</div>
When I use this code with a simple html file and open it in the browser, the image is displayed correctly, which means that both the path and syntax are correct.
But when I insert the code snippet into a Genshi template and use it within Trac, the image cannot be found. However, when I look at the HTML source code in the web browser and copy the URLs into a new browser tab, it is again displayed correctly. This means that only the server cannot find the image.
The images are in a directory inside the python-egg file, and the path points directly to the directory created by Trac, which also contains my CSS and HTML files, both of which are loaded correctly. The images are correctly referenced in the setup script which creates the egg.
How do I have to reference images in (X)HTML documents when using them with a server?
Is there a special way to include images in Genshi documents? (I haven't found one.)
Thanks to the comment of RjOllos and this site I was able to fix it by trying all of the URL types. Although it says for a plugin to be /chrome/<pluginname>, it was actually just /chrome that worked. See the edit below! So the full URL is then <ip>:<port>/chrome/path/to/image.png.
EDIT: I discovered I actually used the /chrome/pluginname version, just that I did not use the name of my plugin as "pluginname". See my comment below. It seems like /chrome/pluginname should actually be /chrome/htdocsnameor something like that, in case you use a different name rather than the plugin name when implementing the ITemplateProvider. In my case I called it images, which was the same name as the folder. END OF EDIT
Another mistake I made was forgetting the initial slash (chrome/path/to/image.png), which caused Trac to assemble the URL to <ip>:<port>/<current page>/chrome/path/to/image.png.
I'm using Doxygen to create html output.
I'd like to customize the output so that the index.html file could be more noticeable, since at the moment it is buried half way down a huge list of files in the html output folder.
For example, if it were moved up one directory to be outside of the 'bits and pieces' html files then it would be much more accessible for others who will be looking for it. However, I can't just ass a line of script to copy it to that location, since all of the links it has would break.
If I could configure Doxygen to have the index file go to a different location, or if you can think of another solution to my problem, I'd be grateful for your response.
Thanks
I would leave the documentation in its place and instead use the meta refresh option of the HTML language. Place a file, for instance called, "Documentation.html" in any folder you want with the following content
<meta http-equiv="REFRESH" content="0;URL=RELATIVE/PATH/TO/index.html">
As I mention in comments to the OP the easiest solution is probably to create a symbolic link or shortcut to the index.html file generated by doxygen, rather than trying to get doxygen to change the layout of it's output files. This symlink/shortcut can then be placed in the root directory of your project (or elsewhere), pointing to ./html/index/html, and named anything you like to make it obvious to your users what it is.