FF extension XUL image display - image

If I want to show an image in my sidebar. How can I do that? I tried to do the following to no avail:
According to this: https://developer.mozilla.org/en/XUL_Tutorial/Adding_Labels_and_Images
If I add this code into my ff-sidebar.xul file:
XUL:
<image id="image1"/>
Style Sheet:
#image1 {
list-style-image: url("chrome://findfile/skin/banner.jpg");
}
The Image should be displayed. Did I pick the wrong file?
best, US

That's an example if your extension is registered in chrome with findfile:
These images come from within the chrome directory, in the skin for the findfile package.Because images vary by theme, you would usually place images in the skin directory.
And in introduction to the tutorial it says:
This tutorial will demonstrate
creating a simple find file user
interface, much like that provided by
the Macintosh's Sherlock or the find
file dialog in Windows.
So that example is in the context of the tutorial.
You need to provide it an image in your skins folder and in css use:
list-style-image: url("chrome://yourext/skin/yourfilename.jpg");

Related

Adding Image in Magento Customized PDF (Extension)

I have an extension installed on my Magento in which I customized it to fit the my expectations.
But in my PDF that I customized, I want to place an image where the picture is placed on the media folder only,
The link of my image is like this http://xxxxxxxx.com/ecommerce/media/GlobalPdf/default/img/barcode.jpg
I can open the link onm the browser and it shows the image but when I included it on the XML, it does not show, it shows only a black box with a white X on it.
Am I missing something? I tried placing it on other locations but to no avail.

How do I embed full pdfs using ReStructured Text?

How do I embed a pdf using reStructured Text? With the following directive, I only get the first page.
.. image:: /pdfs/cv.pdf
For context, I'm trying to do this in a Pelican based blog.
A plugin for Pelican called pdf-img description says:
Searches for any tags within your article for which the source is a PostScript, EPS, or PDF file. It will produce a PNG preview of the file and this PNG will be displayed as the image. This preview will also act as a link to the original file. If the PDF/PS/EPS file is a multi-page document, then only the first page will be used for the preview.
That explains why you get those results.
I could find no plugin that "embeds a PDF" (by which I assume you want to embed a PDF viewer within your Pelican blog that would display the entire PDF, allowing the viewer to scroll through it in an iframe or something like that), but you can try searching for others.

Firefox add-on will not display images

I have a blank Firefox Add-On I made using the Getting Started Tutorial. When I run my extension using jpm run I observe the following.
If I navigate to any image it appears like this (image is displayed nicely in the centre):
However, I have the same image store in my extension under: ./data/test.jpg. When I navigate to resource://my-addon/data/test.jpg I get the following blank page:
The image is there, because if I hover over it in the inspector, it shows:
Am I doing something wrong, missing something in the docs about rendering images or is there a bug with how images are being rendered from the extension?
Include the self and then do
console.log(seld.data.url(''))
This will give you the id of your addon. It is very likely not my-addon it will be something like: jid1-4GP7z3tkUd3Tzg#jetpack - so your path to your image will be resource://jid1-4GP7z3tkUd3Tzg#jetpack/data/test.jpg.

How can I display my logo on my DokuWiki's title?

I have a DokuWiki and I'd like to place a logo on the title bar at the top of the page? How can I do this? Note that I am not referring to the title bar at the top of the browser, but rather the title bar on the website itself.
I tried inserting the DokuWiki syntax: {{public:logo.jpg?100x100}}, but this simply rendered as plain text and not an image.
Is it possible to put an image in the page title?
Easy: Rename your logo as "logo.png" and place it into :wiki namespace. It will show automatically.
This solution works on template "dokuwiki" (default one on dokuwiki old stable version "Adora Belle" and in current one "Weatherwax"):
Deeper:
We can look at tpl_header.php file, lines 21&23:
// get logo either out of the template images folder or data/media folder
[...]
$logo = tpl_getMediaFile(array(':wiki:logo.png', 'images/logo.png'), false, $logoSize);
Ok: tpl_getMediaFile() function will look for a file logo.png in media namespace called wiki.
So I go to dokuwiki File Manager and I upload my logo.png file on wiki namespace. I refresh page and I smile.
Hope That Helps
In modern versions of DokuWiki you don't have to make your own template. Simply upload a file called logo.png to the wiki or root namespace in the DokuWiki Media Manager.
This is the line of template code that gets the logo:
https://github.com/splitbrain/dokuwiki/blob/master/lib/tpl/dokuwiki/tpl_header.php#L23
You can tell that it is first checking logo.png in the wiki namespace with :wiki:logo.png and then logo.png in the root namespace with :logo.png.
If it doesn't find either, it falls back on images/logo.png, which is the default logo.
(for latest versions of Dokuwiki)
You should create your own template, and do whatever hack you need to do.
It is located in lib/tpl/
Just copy the default directory with your own name (this will be available in the admin area later), something like "company", and edit:
<div class="pagename">
<img src="<?php echo DOKU_TPL; ?>images/logo.png" align="absmiddle"/>
[[<?php tpl_link(wl($ID,'do=backlink'),tpl_pagetitle($ID,true),'title="'.$lang['btn_backlink'].'"')?>]]
</div>
You can build the HTML as you like... but the example above works just fine (the image is located in the lib/tpl/company/images/)
You can then change the template of your Wiki by updating the configuration at:
Admin > configuration manager > template
There's no config option for this, you'd have to hack it in \dokuwiki-2009-02-14\lib\tpl\index.php I'm afraid.

Can I use CSS in directory listing of Firefox?

For example if I put "C:\docs" in address bar of Firefox, it shows all files in the directory. Is it possible to customize this page with CSS?
Apache 2.2 allows us to do it using IndexStyleSheet directive, so I wondered if Firefox can do it.
Firefox has a file userContent.css for each profile (found in the profile's settings folder). That file defines the standard CSS, why may then be overwritten by a website. So they also apply to directory listings.
You should have a look at the actual HTML code Firefox is creating for the directory listing to see how to do the CSS definitions right. You will find extensive documentation about userContent.css on the web.
http://www.mozilla.org/unix/customizing.html#userContent
I think the easiest way is to create an own skin which custom css. You have to modify dirListing.css in this case. (chrome://global/skin/dirListing/dirListing.css)
I know the walnut theme (https://addons.mozilla.org/en-US/firefox/addon/122) includes a modified file listing.

Resources