AbcPdf - document not applying CSS - abcpdf

This may be more of a tech support issue, but I'm wondering if any other developers have come across this:
I'm using Abcpdf in my ASP.NET code to generate a PDF from HTML. It works fine, but one user is generating PDFs that don't have the CSS applied (IE8, Adobe Acrobat latest version - same as everyone else). Since this is the only user complaining, I'm sure it's a local setting, but I can't figure out what would prevent the css from loading - a browser setting? An Acrobat setting?
Does anyone have any suggestions?

Perhaps an issue with different versions of Acrobat reader? I'd look into this.
This doesn't make a lot of sense because AbcPdf uses service side logic to create the PDF based on what methods you are using to create the document (ex. AddImageUrl vs drawing out the document manually, etc.).
For what it's worth the staff at WebSuperGoo (the vendor of AbcPdf) is great with replying to support questions such as this. I've run across a few edge cases with their product that they've always followed up with workarounds or alternatives to address in a timely manner.

make sure you have media="print" for the CSS style sheet! Just spent ages looking at this pulling my hair out and was about to email WebSuperGoo then that thought came to me.
just about to back out all the changes I've made to my code and test again but it looks like with EngineType.Gecko it needs to be media="print" where as with EngineType.MSHtml it can be media="screen".....
very odd but hope that helps someone!

Make sure that the CSS is an absolute URL rather than relative, or add a base tag to the header of the HTML
For example, rather than
<style type="text/css" href="/styles/somecss.css" rel="stylesheet" />
use
<style type="text/css" href="http://myserver.com/styles/somecss.css" rel="stylesheet" />
Also if you site is SSL or authenticated then you will have to either make the area with the stylesheet un-authenticated, or, set the password and username attributes of the PDF object so that ABCPdf can authenticate

You can try the following in version 9
doc.HtmlOptions.PageLoadMethod =
PageLoadMethodType.WebBrowserNavigate;

I am using Version 10 of ABCpdf and I found that the style sheet path should be absolute instead of relative.
I changed the stylesheet path from "C:\MyProject\Resources\Styles.css" to "http:\www.MyDomain.com\Resources\Styles.css" and it worked.
Although, version 6 seems to be working with relative paths. I didnot check it with other versions
As per WebSuperGoo support:
(Query # : 6.17)
HTML does not exist within a file and so it does not have a location.
External stylesheets and images are often referenced via relative URLs. Because the HTML has no location it is impossible to resolve
these relative references.
So you need to provide your stylesheet and image links as absolute references. Or you may be able to use the HTML BASE element to specify
an appropriate base location. Or you can save your HTML to file in an
appropriate location and then use AddImageUrl.

Have you tried;
theDoc.HtmlOptions.DoMarkup = true;
This forces the engine to process the HTML before rendering.

Related

How to change the default logos in create-react-app

I'm working on a create-react-app project in VS code and would like to change the default logos (specifically the one that appears in the tab to the left of the website title).
I have an image that I would like to use, but I can't figure out how to add the image to VS code. I tried making a .png file, but wasn't able to add the picture into the file. I tried the same thing with a .ico file. I honestly don't understand the difference between the two. But if someone could help me with steps on how to change that logo (blue atom looking thing) that would be great.
This depends on how you want to put it.
add to html file(probably index.html)
<link rel="icon" href="pathname">
add Node.js file assuming that you are also using express.
var favicon=require("serve-favicon");
app.use(favicon("pathname"));

How to work with localization/translations in Firefox OS/b2g

There seem to be a lot of variations of how the workflow for localization should be. When I look at the documentation I find differences on all of the pages:
https://developer.mozilla.org/en-US/Apps/Build/Localization/Localizing_Firefox_OS_Apps
https://developer.mozilla.org/en-US/Apps/Build/Localization/Getting_started_with_app_localization
https://developer.mozilla.org/en-US/Apps/Build/Localization/Localizing_strings_in_JavaScript
https://github.com/robnyman/TranslationTester
https://github.com/robnyman/Firefox-OS-Boilerplate-App
I have tried all versions and combinations that I can think of (my phone is a Geeksphone Revolution running Firefox OS 2.0) but nothing works as intended. Either I get no text at all or I always get English.
To name one of the uncertainties, how should the localization link-tag look like. So far I have tried these variations (each with corresponding file structure for .ini/.properties files):
<link rel="prefetch" type="application/l10n" href="locales/locales.ini">
<link rel="resource" type="application/l10n" href="locales/locales.ini">
<link rel="localization" href="locales/{locale}/app.properties">
<link rel="prefetch" href="locales/{locale}/app.properties">
Since all documentation pages on developer.mozilla.org and the GitHub pages they link to looks different, how can I find out which is the standard way to work with localization for Firefox OS/b2g 2.x?
I believe this link:
https://developer.mozilla.org/en-US/Apps/Build/Localization/Localizing_Firefox_OS_Apps
reflects the latest changes in the l10n.js lib in Gaia.
The other methods can be used as long as you have the js file that supports it.
For example The translation tester app should work. I just tried it on 2.0 on a Flame and it worked fine.
Using
<link rel="resource" type="application/l10n" href="locales/locales.ini" />
Should work.
Look over this post:
https://hacks.mozilla.org/2014/05/introducing-translationtester-and-localization-support-for-open-web-apps/
That Robert used with that example and uses a locales.ini file in the locales directory.
Also check to see if your app is working in the 2.0 simulator.

Are include files necessary in an html website?

Are include files, such as server side include SSI, files necessary in an html website?
I recently tried to host my simple html website through GoDaddy. I used Dreamweaver CC to upload my files and encountered a problem. Some of my pages were not displaying images or css. I checked to see if the images and css were on the server and in the correct places and they were. Confused, I called GoDaddy's customer service, waited 35 minutes, and talked to one of their customer service reps. He basically told me that it may be my code and that I need 'include' files.
I have looked all over the web and I'm still not entirely sure what an include file is... I got from my research that they are snips of code that call images/files without having to write out the same thing on every page. If I have copied and pasted the same thing on every page, why then would I need an 'include' file? I previously had my website hosted through Hostmonster, still do now, and I have never had to alter my code...
I am still new to the world of coding, so please be kind. If anyone knows of a good resource to help explain the use of 'include' files please post it or correct me if I am wrong. Thank you.
I think the GoDaddy "support" guy was talking about the include operation in your html files that you need to fetch your css files.
Presumably your web pages work correctly when you display them locally on your development machine -- the machine where you run Dreamweaver. If not, fix them. They'll probably need css files in some subdirectory (or maybe in the same directory as the html) and image files in some other subdirectory.
Open up your page, on the server, in a browser, and then do View Source. Look for your css file download commands ... which may look something like this ... in your source.
<link href="styles.css" rel="stylesheet" type="text/css" />
Are the links (the href items) what you thought they should be? Sometimes you'll find that they are absolute links like
file:\\d\myfiles\website\dreamweaver\some_other_junk\styles\foo.css
If they are you need to change them to
styles/foo.css
The same goes for images.
And, no, you don't need server-side include files to put up a working static web site.

ModX Revo Relative Path Images in Resource Editor

I have a site in ModX Revolution that I am having an issue with. Well... ok, it's not an issue for me, but for my client it will definately be an issue.
The issue is, I am finding that when adding an image to a resource using the CKEditor plugin, the paths to the images are not site relative(they are being put in as assets/images/image.png, when it should be /assets/images/image.png). Which of course will cause them to fail to load in when /page/YXZ is rendered.
I have searched all around, and I cannot find the answer to this seemingly impossible task...
How can I ensure that all files are relative to the site, without having to revert to <base href="" /> tags?
Note:
I cannot use <base href>, due to #identifier links throughout the site.
You should be using <base href="[[++site_url]]"> with MODX, or you'll run into all kinds of problems with url references (such as this one).
If you want to use anchor tags, you just need to modify the syntax slightly:
My Anchor Link
http://rtfm.modx.com/revolution/2.x/making-sites-with-modx/structuring-your-site/resources/named-anchor
Note for others: if you want to use friendly urls with a MODX site, the <base href=""> tag is essential: http://rtfm.modx.com/revolution/2.x/administering-your-site/using-friendly-urls
I have "fixed" the issue by going with TinyMCE instead of CKEditor for this. There are special settings in TinyMCE that allow me to set rootrelative links for images and files.
Take a look at the 'strip_image_paths' system variable under the file system group... you can set so that modx will rewrite them as either relative or absolute.
You should still be able to use anchor links with the base href.

Change image icon in addressbar of browser

I searched through many sites, but I failed to get an answer.
Question :
I want to change icon as per given in below image in my browser.
Currently chrome and Mozilla does not support this feature if you want check you can check it in either ie or safari, it will show where you want.
you should add this tag to head
<link rel="shortcut icon" href="<YOUR ICON PATH>">
this is a tool to help you to create icon using converter
http://www.favicongenerator.com/
Those are called "favicons", and you can set one for your website using a special tag in the HEAD of your HTML. You can find many tutorials on this by Googling (now that you know what they're called).
Wikipedia suggests a tag something like this:
<link rel="shortcut icon" href="http://example.com/myicon.ico" />
As an alternative, your website can provide an image named favicon.ico in the root folder.
That icon names "favicon". To create Something like that go to THIS LINK, Upload an image and get the favicon.ico file, then put it next to your template page on your host.
To get more information go HERE.

Resources