How to wrap images in aspose.pdf when converting html to pdf for .NET

Please refere the code which I implemented using ASPOSE.WORDS below.I want to do same by using ASPOSE.PDF

Document doc = new Document(@“C:\Temp\in.html”);
NodeCollection shapes = doc.GetChildNodes(NodeType.Shape, true);
foreach (Shape s in shapes)
{
s.WrapType = WrapType.Square;
s.Top += s.Height + 10;
}
doc.Save(@“C:\Temp\out.docx”);

current outcome current.PNG (138.9 KB)
I want to wrap those images like this when converting it to the pdf expected.PNG (128.0 KB)

Do you know how to do this with aspose.pdf.???

Document doc = new Document(@"C:\Temp\in.html");
NodeCollection shapes = doc.GetChildNodes(NodeType.Shape, true);
foreach (Shape s in shapes)
{
    s.WrapType = WrapType.Square;
    s.Top += s.Height + 10;
}
doc.Save(@"C:\Temp\out.docx");

@nethmi Your question is related to Aspose.PDF. So I moved it to the appropriate forum. My colleagues will reply you shortly.

1 Like

@nethmi

Regretfully, Aspose.PDF does not offer wrapping images during HTML to PDF Conversion. Instead, it honors the styling of images and other content in the HTML according to the CSS defined for source HTML. You can wrap images in HTML using CSS and then supply the HTML to the API to generate PDF as per your needs.

1 Like

Hii
can I do this(image wrapping) by using Aspose.HTML???

@nethmi

We are responding to your similar inquiry in respective forum thread.

Hiii

In here I am using css to wrap images. Now I am getting an issue.

my expected outcome is expectedOutcome.PNG.jpg (304.6 KB)
current outcome is CurrentOutput.PNG.jpg (242.2 KB)

my html HTML.zip (2.9 KB)
please use your own images

//this is my convert method

  public List<byte[]> Convert(ContentsDto content, IDictionary<string, string> options, Func<DependentContent, Task<ContentsDto>> GetDependency = null)
    {
        License htmlLicense = new License();
        htmlLicense.SetLicense("Aspose.Total.NET.lic");
        var pdfBytearray = new List<byte[]>();
        
        HtmlLoadOptions htmlLoadOptions = new HtmlLoadOptions() { CustomLoaderOfExternalResources = ResourceLoading, HtmlMediaType = HtmlMediaType.Print };
        htmlLoadOptions.PageInfo.Margin.Left = 50;
        htmlLoadOptions.PageInfo.Margin.Right = 50;
        htmlLoadOptions.PageInfo.Margin.Top = 50;
        htmlLoadOptions.PageInfo.Margin.Bottom = 50;
        htmlLoadOptions.PageInfo.Width = Aspose.Pdf.PageSize.A4.Width;
        htmlLoadOptions.PageInfo.Height = Aspose.Pdf.PageSize.A4.Height;
        htmlLoadOptions.PageInfo.Width = 959.976;
        htmlLoadOptions.PageInfo.Height = 540;
        

        //Manipulate html document 
        HtmlDocument htmlDocument = new HtmlDocument();
        using (var htmlStream = new MemoryStream(content.Data))
        {
            htmlDocument.Load(htmlStream);    
      
            AddFroalaCSSSupport(htmlDocument);
         
            foreach (HtmlNode p in htmlDocument.DocumentNode.SelectNodes("//p"))
            {
                if (p.ChildNodes.Count == 1 && p.InnerHtml== "<br>")
                {
                    p.Remove();
                }
            }
                  
        }
        using (var htmlOutputStream = new MemoryStream())
        {
            //convert html to pdf
            htmlDocument.Save(htmlOutputStream);
            htmlOutputStream.Seek(0, System.IO.SeekOrigin.Begin);
            Document pdfDocument = new Document(htmlOutputStream, htmlLoadOptions);
                                    
            //convert pdf to pptx
            PptxSaveOptions pptx_save = new PptxSaveOptions();
           
            using (var pptxStream = new MemoryStream())
            {
                pdfDocument.Save(pptxStream, pptx_save);
                pptxStream.Seek(0, System.IO.SeekOrigin.Begin);
                pdfBytearray.Add(pptxStream.ToArray());
            }
        }
        return pdfBytearray;
    }

//this is my added css method

  private static void AddFroalaCSSSupport(HtmlDocument htmlDocument)
    {
        var linknode = htmlDocument.CreateElement("link");
        linknode.SetAttributeValue("href", "https://cdnjs.cloudflare.com/ajax/libs/froala-editor/3.2.6/css/froala_editor.pkgd.min.css");
        linknode.SetAttributeValue("rel", "stylesheet");
        var htmlHead = htmlDocument.DocumentNode.SelectSingleNode("//head");
        htmlHead.AppendChild(linknode);

        //TODO : add this node from GE and remove this code
        var bodyNode = htmlDocument.DocumentNode.SelectSingleNode("//body");
        var bodyContent = bodyNode.InnerHtml;
        var newBody = $"<div class=\"fr-view\">{bodyContent}</div>";
        bodyNode.InnerHtml = newBody;
    }

Do you have any solution to get that expected outcome???

In here HtmlDocument means HTML agility pack. we load our content(html) to that agility pack.
So HtmlNode,DocumentNode are it’s methods.

from AddFroalaCSSSupport() this method I am create a link node to put the css link as href .

this is my style sheet https://cdnjs.cloudflare.com/ajax/libs/froala-editor/3.2.6/css/froala_editor.pkgd.min.css

from this style sheet, we are wrapping images which has class=“fr-fil” (class=“fr-fic fr-dii fr-fil”)

@nethmi

We were able to produce the expected output using Aspose.HTML for .NET. We responded to your original inquiry in the respective forum thread in Aspose.HTML Category where you can please check the code snippet and the attached output PDF document.

no no this question is from aspose.pdf

for this one

@nethmi

Can you please share which namespace is required to access the HtmlDocument that you are using in your code? Also, if you can use Aspose.HTML as well, you can just edit the inline CSS (as we showed in Aspose.HTML thread), and use the obtained HTML file to convert into PDF using Aspose.PDF.

Aspose.pdf. Here I am using aspose.pdf

In case you are only using Aspose.PDF, please share the HTML file (in .zip format) that has been obtained after performing the above step. Please save the HTML file into a directory instead of Stream at your end and share that with us.

I replied to this one. we are using aspose.pdf to convert html to pdf and pdf to pptx.

you asked to use style sheet to wrap images

@nethmi

Yes, because Aspose.PDF cannot edit or update the HTML file or its CSS. We can see in your code that you are editing the CSS styling. However, we were unable to run the code snippet because of unknow Class Types i.e. HtmlDocument, HtmlNode, etc. We must be missing some dependency or library. Can you please specify it? OR just share the HTML file obtained after editing the CSS at your end.

Actually we have two conversions.

1.convert html to pptx by using aspose.pdf
In here first we convert our html to pdf and then pdf to pptx

2, second conversion is convert html to pdf by using aspose.html

In this forum I am asking about the 1st conversion.

@nethmi

We got it now.

Please provide the above requested information so that we can further proceed accordingly.

1 Like

Please check now.

Are you checking it or need more information???

@nethmi

We tested the case in our environment and noticed that the PDF generated by Aspose.PDF looks similar to the HTML that was obtained after editing CSS using Html Agility Pack. Please check the attached output PDF document and supplied HTML (generated after running AddFroalaCSSSupport() method): htmltopdf.zip (647.9 KB)