I want to be able to generate a pdf of the page. It needs to satisfy a few requirements
It must maintain the same styling (What is displayed on page must be what is displayed on pdf)
The pdf that is displayed/generated must be in letter size format (8.5in x 11in)
I've looked at a few libraries, but have not found one that meets these conditions
react-pdf - This allows you to state a paper size such as "A4" and it does meet condition 1. But it has limitations in that it forces you to use their basic components. You cannot put div and I imagine any other things generated by other libraries.
react-to-pdf - This will let me place my own components inside the pdf and it seems to let you choose paper size. However, it does not meet condition 1, and things may get cut off.
If anyone can chime in, I would greatly appreciate it. Thanks!
Related
I am using react.js
I'm trying to build a blog page.
there is a texterea tag to write a blog for the user.
now I want to add the function that allows users to add words that are linked.
so that when i show the text from that input words that are linked are clickable
enter image description here
like the blue words in wiki in the image above.
pardon my mistakes (1st question in StackOverflow)
I know about dangerouslysetinnerhtml. but not sure if it's the right way to do so. because then users can modify the code inside (i think). so what is the safe and right way to do so
Reading your case Markdown seems best option as it also supports links insertion. For rendering user entered markdown you may use library like React Markdown. For writing markdown textarea is fine as long as you write markdown syntax properly but you may want to consider libraries like React textarea markdown editor to make things easier.
Our website uses an optional language parameter for displaying pages in either English or Spanish, for instance:
https://www.spotmodel.com/product_info.php?products_id=17442&language=en
https://www.spotmodel.com/product_info.php?products_id=17442&language=es
Of course, code is exactly the same, performance is exactly the same, and page generation speed is exactly the same (just selecting different rows for page text locales)
BUT
In PageSpeed, mobile tab, pages with "language=en" consistently score about 10 points LESS than pages with "language=es" (about ninetysomething in "es", about eightysomething in "en").
According to my tests, it happens on every single page (within the bounds of the small score variations). The generated code is exactly the same (except the small text changes), html sizes are also similar or even bigger in the ES version (370k EN vs 377k ES), functions do NOT perform anything differently.
Problem is that, by default, if the parameter is not found, the page served is the English version, hence i'm getting an "orange" score most of the times, instead of the nice "green" on the Spanish pages.
Any clues on what I'm missing? Is it a bug in lighthouse parsing pages with <html lang=es>
I am trying to modify an existing XML package of Aspdotnetstorefront Multistore. It's an internal XML package to show the variants of a certain product. What I did to start with was to copy-paste the whole code as is and throw it into a new custom XML package. The problem is that it works fine in the original package but not in the copied package. When I try to run it the function "AddtoCartForm" crashes the page and show the following error while display in red the line that contains the function call:
An HtmlHelper is required for this method. Make sure to specify one when you call the RunXmlPackage method
The format of the function is:
<xsl:value-of select="aspdnsf:AddtoCartForm(ProductID, VariantID, 1, 1, $SelectedSize, $SelectedColor)" disable-output-escaping="yes"/>
I removed the line with the function just to be sure and then everything else works fine. I have no idea what's wrong here. Everything is identical unless by the structure of the url which calls the package:
For the internal package it is: \product\123456
For the custom package it is: \topic\packagename?ProductID=123456
I checked the XML produced by the SPs, the runtime and requested data and it's basically the same in both cases. The ProductID and VariantID values are there. SelectedColor and SelectedSize are not in the XML (not even in the internal package) so it may be just providing null value and probably it's not necessary anyway.
And there is more. If I supress the productid value from the url like this:
\topic\packagename
It won't crash the page (but also won't render because there will be not be any value to process).
In any way I cannot see why it wouldn't work just passing the variable in the querystring (that is basically what it does in the original package even in a different format) and the var value (productid) it getting there. However it seems that it is indeed the url format that is not pleasing the package but it doesn't make too much sense to me. I am over this for several days already and nothing I do seem to produce any positive result. :-(
I looked up online for some documentation but didn't get lucky and didn't find absolutely anything. In extreme cases I try to reach the Vortx support (and they usually answers me giving some valueable clue) but this time it seems that for this specific issue there will not be any help unless I pay an obscene hour fee and unfortunately it's out of question... LoL!
Any idea?
UPDATE: We don't use Multistore regular search tool. Due to the nature of our products (recycled car parts) we have a custom search tool that will try to find 'similar' items that MAY fit the user needs when we don't have the EXACT part. I don't know if you are ware of but several mechanical car parts are interchangeable among different models and makes (like alternators, AC compressors, battery, suspension, cooling system, etc), so when one of our customers needs a part to fix his car he won't tell us the part code; instead he will tell us the car model, year, and generic name of the part so we will try to find the part for him. It does mean that a certain Corolla part will fit perfectly in a Honda Accord and so on. Some times we have some parts in stock that MAY fit his car but we are not absolutely sure. When it happens we will show those parts for the customer and he will decide if he can take his chances. For the sake of customer comfort we want to show all these parts in the same page, but since they normally are variants of different products we cannot use the regular product page for this purpose (because the product page will only show variants of ONE product at time). For this reason I am going to write a package - a modified version of the product page - that will do that but I am struggling with the AddtoCartForm function. In fact I JUST found a workaround by adding the item to the cart accessing directly the /shoppingcart/addtocart script and now my problem is being to force it return to a specific url after to add the item to the shopping cart...
The error has to do with the topic token able to properly get html helper filled out.
I do question why testing is being done on a topic. To test a new product xmlpackage I normally change change the xmlpackage for just one product in a testing environment.
If chaning the product xmlpackage isn't possible then I suggest using the XmlPackageController/engine instead. Which is documented on page https://help.aspdotnetstorefront.com/1000/xml_packages.htm under the heading of "Invoking XML Packages by Themselves". If using the XmlPackageController make certain that the allowengine attribute is set to true in the xmlpackage otherwise that will throw an error as well.
I am building an Angular test preparation app (with Laravel 5.1 API). One of the requirements is to allow the user to print a certificate of achievement.
The client wants the person's name and credentials interpolated into the document (e.g., highlighted below). Here is a snapshot of the PDF template they sent:
The way I'm handling PDF viewing is simply by storing the file on S3 and giving them a link to that file.
Interpolating information into a PDF doc doesn't seem trivial and I haven't found much information on programmatically allowing this, but there are tools like DocHub, that allow you do edit while viewing the PDF.
I'm interested in learning:
is doing this programmatically trivial?
are there 3rd party tools I'm unaware of?
would I even be able to send this information along to the S3 link to interpolate in the first place?
Using PDF as a format for editing is usually a bad choice. If you have a form with fixed fields, then it's easy. Create a PDF template with an interactive form. In this form, based on AcroForm technology, you'll define fields with fixed coordinates, and a fixed size. You can then add content to these fields.
One major disadvantage with this approach is the lack of flexibility. Did you notice that I used the word "fixed" three times in the previous paragraph? If text doesn't fit the predefined field, you're out of luck. If the field is overdimensioned, you'll end up with plenty of white space. This approach is great if you can predict what the data will be like. A typical use case is a ticket or a voucher. For instance: the empty form is a really nice page, with only a couple of fields where an automated system can put a name, a date, a time, and a seat number.
This isn't the best approach for the example you show in your screen shot. The position of every line of text, every word, every character is known in advance. If you want to replace a short word with a long word (or vice-versa), then all those positions (of each line, of the complete page, possibly of the complete document) need to be recalculated. That's madness. Only people with very poor design skills come up with such an idea.
A better idea, is to store the template as HTML. See for instance chapter 5 of iText's pdfHTML tutorial, where we have this snippet of HTML:
<html>
<head>
<title>Invitation to SXSW 2018</title>
</head>
<body>
<u><b>Re: Invitation</b></u>
<br>
<p>Dear <name>SXSW visitor</name>,
we hope you had a great SXSW film festival experience last year.
And we would like to invite you to the next edition of SXSW Film
that takes place from March 9 until March 17, 2018.</p>
<p>Sincerely,<br>
The SXSW crew<br>
<date>August 4, 2017</date></p>
</body>
</html>
Actually, it's not really HTML, because the <name> tag and the <date> tag don't exist in HTML. All HTML processors (browsers as well as pdfHTML) ignore those tags and treat their content as if the tag was a <span>:
It doesn't make much sense to have such tags in the context of pure HTML, but it does make a lot of sense in the case of pdfHTML. With pdfHTMLL, you can configure custom tags, and have a result that looks like the PDFs shown below:
Look at the document for "John Doe" and compare it with the document for "Bruno Lowagie". The name "John Doe" is much shorter than my name, hence more words fit on that first line. The text flows nicely (we could also have chosen to justify the text on both sides). This "flow" is impossible to achieve with your approach, because you will never get a PDF template to reflow nicely.
OK, I get it, you probably say, but what about the practical aspects? You talk about a Java / .Net library, but I am working with Laravel and Angular.js. First, let me tell you that I don't think you'll find any good PDF tools for Laravel or Angular.js, because of the nature of PDF and those development environments (in my opinion, those technologies don't play well together). Regardless of my opinion, this shouldn't be much of a problem for you because you work in an Amazon environment. AWS supports Java, and the Java code needed to get pdfHTML working is minimal. Most of the code samples I wrote for the pdfHTML tutorial are shorter than 15 lines. So why not try Java and pdfHTML?
If you're already using Amazon services, why not use an amazon lambda function, in combination with iText7 (java), to generate the pdf on demand?
That way, you are guaranteed that the pdf is correct, and has nice layout every time.
Generating the pdf can either be done by:
converting HTML,
programmatically creating your entire document,
filling and flattening an XFA form.
I think for your use-case, either option 1 or 2 are the most sustainable.
First time poster here, I'm a designer not skilled at all with php and I have a small issue I don't seem to be able to solve. I'm making a site in drupal 7 using a sub theme on zen.
Btw this is a great CMS, even though people say it's really more a developers CMS. I have no trouble to do what I need using views, rules, display suite etc. So a big thank you for all the developers out there making this such a good CMS. But for this apparently simple problem... no module will help me (I think) and I'm kinda stuck.
So here it is: I'd like to add a subtitle next to the title in all my pages.
So what I did was to add a custom field into the content type basic page (machine name: field_sub_title) which is a simple text field.
I uncommented the following line in my template.php
function mytheme_preprocess_page(&$variables, $hook) {
$variables['sub_title'] = t('field_sub_title');
}
Now my question is how do I load the content of my custom field into that variable?
I know i need to change the second part, but I don't have a clue as into what I need to change this.
Displaying the variable into the the page.tpl.php is something I know about so I only need help with the first part.
{EDIT}
Ok I found how to do this :)
I was looking for a solution in the wrong place. I don't need to change any thing in the template.php file.
Just needed to add this bit of code into my page.tpl.php:
<?php
print $node->field_sub_title['und'][0]['value'];
?>
So I'm posting this here for other Drupal newbies struggling with this....
Your solution may work for now, but there may be a more Drupal-y way to handle a problem like this. If you haven't noticed any problems yet, you may find one or more of the following issues down the road:
Someone who doesn't know php or Drupal theming may need to change the way this works.
If you're like me, you may forget where exactly in code this was implemented.
You may see superfluous markup and/or errors on nodes (content) that do not have this sub-title field (ie. event content not having a sub-title field while basic pages and news articles do).
When you add a field to a content type, it will automatically appear anytime content in that content type is displayed. You should be able to add the sub-title field for your page, event or whatever else you need and have it automatically appear in the markup.
You can 'manage display' of a content type to drag and drop the order for fields to appear. You could take it a step further by using a module like Display Suite to add formatting or layout per-content type.
If you feel like this isn't good enough and the markup for the subtitle must be at the same level as the page title (which is rare), at least add an if statement to make your code check to see if the variable is present before trying to print it. I'd also add a new variable and comments for code readability.
<?php
$subtitle = $node->field_sub_title['und'][0]['value'];
if($subtitle){
print $subtitle;
}
?>
Consider using field_get_items or field_view_value, or at least use the LANGUAGE_NONE constant instead of 'und'
See https://api.drupal.org/api/drupal/modules%21field%21field.module/function/field_get_items/7 and https://api.drupal.org/api/drupal/modules!field!field.module/function/field_view_value/7
This has the added benefit of reducing the number of potential security holes you create.