Implementing target-counter in CssContentPropertyResolver - itext7

I am trying to add a table of contents with page numbers to a PDF I am generating using Freemarker -> HTML -> PDF. The HTML/CSS are below
ul.toc a::after {
content: " Page " target-counter(attr(href url), page)
}
<ul class="toc">
<li>First Section</li>
<li>Second Section</li>
</ul>
However when I ran iText7 on this I got this error:
Content property "" Page " target-counter(attr(href url), page)" is either invalid or uses unsupported function."
which comes from CssContentPropertyResolver.java.
Are there any intentions to eventually support this CSS property?
For any documents that require a numbered table of contents, we are forced to use iText5, which does support target-counter. It would be very beneficial if you could reimplement this functionality in iText7

Related

Can I access the header of a text content element?

I need to get the headline and the text separately out of a text content element. The reason is, to give the editor a simple way to add a content for a complicated section in my html theme.
I am new to TYPO3 an we run V11.5.16! I read and watched some tutorials and I got most of my site already working! Contents are dynamic and multilinguale so far.
To get contents from backend, I use Backend Layouts and copy the content from styles.content.get inside my setup.typoscript. I think this is the common way to do it, and as I said, it works. I output them using {contentXY->f:transform.html()} or {contentXY->f:format.raw()}.
For a text content element, I get something like:
<div id="c270" class="frame frame-default frame-type-text frame-layout-0">
<header>
<h2 class="">Headline</h2>
</header>
<p>Some Text</p>
</div>
Is it possible to get only "Headline"? And if so, it hopefully works also for getting out separately "Some Text"
Something like: {contentXY->f:transform.html(filterBy('h2'))}
Thanks in Advance!
EDIT:
According to Peter Krause's answer: I know, there is an extra content element for headers. But I need the text content element, because for the places in the html, I need header AND text. And the editors are technically not savy enough to fill in different content elements. Please don't ask in more detail. ):
You can handle header and body of an CE seperately, but not in a page context.
In page context you get the result from rendering the CEs, which is a string (with HTML).
For each CE there is a rendering information, which nowadays is also FLUID.
Depending on your installation it probably is FSC (ext:fluid_styled_content) or a Bootstrap extension.
This means: there are FLUID templates which can be overriden and modified.
In these templates you have access to each field of a CE separately.
Look for the templates stored in the defined paths (in TSOB) and add your own path for overides:
lib.contentElement {
templateRootPaths {
1 = ...
2 = ...
3 = ...your path...
}
partialRootPaths {
1 = ...
2 = ...
3 = ...your path...
}
layoutRootPaths {
1 = ...
2 = ...
3 = ...your path...
}
}
Thanks for all hints! I think, for my requirement, there is no solution out of the box. So i made a custom CE with Mask and edited the template html. For non-technical editors, it is the best solution in terms of data input. I hope this stands for future upgrades...

Producing a pdf with internal anchor links using dompdf

I am using dompdf to collate a load of existing HTML pages. A lot of these pages have anchor links in them that I would like to preserve. When I collate these articles the pdf collates very nicely but the anchors links don't work. The text is underlined like a link but on clicking it you don't go anywhere.
I have some test HTML that I am using to try out anchor links. Such as:
$content .= '<div style="page-break-after: always;">blah</div>
<div><a id="blah">link location</a></div>';
and also I have tried using name instead of id, based on this forum post - http://www.dashinteractive.net/dompdf/index.php?v=1530231. Such as:
$content .= '<div style="page-break-after: always;">blah</div>
<div><a name="blah">link location</a></div>';
Of course neither of these are working as I would expect.
I can't find much on the internet about how dompdf handles internal links. Apart from this page http://webresourcesdepot.com/html-to-pdf-rendering-engine-dompdf/ that says it can handle links and anchors. Not sure how reliable it is...
How do you put internal anchor links in pdfs using dompdf please? Can it do it?
dompdf up through 0.6.2 should work so long as you use the <a name="blah">...</a> format. The only problem in that release is that if the A tag is empty it will be removed before the link is rendered.
Your second sample should be fine, though maybe just as part of typing up the question the actual anchor reference is incorrect. The following should work:
<div style="page-break-after: always;">blah</div>
<div><a name="blah">link location</a></div>
The current beta for 0.7.0 has a bug that mangles the anchor resulting in a mis-interpreted link type. That issue should be addressed for the stable 0.7.0 release.
Note that no version up to and including v0.7.0 supports linking based on ID.

CKEditor alters content

When I save my content, it changes things that I don't want to be changed. How can I make it so it would just save my content without changing anything?
Content before saving:
<a anything</a>
After save, the above example becomes:
<a a="" anything=""> </a>
I'm trying to find a config option that would make it so when I save my content, it would save it just as it is - without adding anything of its own.
This <a anything</a> is not a valid HTML and CKEditor works only with a valid HTML. So once you try to load this content into CKEditor it (or the browser) tries to fix it.
Quoting CKEditor basic concepts:
CKEditor is not a tool that will let you input invalid HTML code. CKEditor abides by W3C standards so it will modify code if it is invalid.

Fancybox shows blob as string not image (Ruby issue?)

I am displaying an image obtained from a database (stored as a long blob) in an img tag using the following method:
<img src="http://localhost:3000/show_image/265" />
The show_image function takes the image data from the database and renders it to the img tag using the send_data method.
When applying Fancybox onto the img tag, the data is displayed as BLOB data not the image..
Can anyone suggest a reason why? Or how I can solve this?
1) You have to apply fancyBox to the links (not the images) and the structure should be like this -
<a class="fancybox" href="big_image"><img src="small_image" /></a>
Example - http://jsfiddle.net/CYCeM/.
Well, it is actually possible to have only images, but then you have to use "data-fancybox-href" attribute to specify the large one - http://jsfiddle.net/6ZSWB/
2) Looks like the script would not be able to guess the content type from your hrefs. You have to either -
a) Create links having extension, e.g., "http://localhost:3000/show_image/265.jpg"
b) Set content type for fancybox, example - $('.fancybox').fancybox(type : 'image');
setting :type => "image/jpg" fixed the issue. I looked up the MIME content types and realised it was incorrectly written.

How to add an additional article info on sidebar in Joomla 1.5?

I want a sidebar on article page, with additional info. Is there such a solution for Joomla 1.5.
I mean that I add an article and the info is pulled from my text between the tags e.g.
{info_for-sidebar}
Lorem ipsum....
{/info_for-sidebar}
And this info shows in sidebar for current article with actual info.
Is this possible?
Setting up something like what you are asking for require some sort of workarounds.
First, lets agree that what you are calling a "sidebar" is nothing but a content... You enter that content as a part of your article.
So, to achieve what you are asking for I would recommend you use what is called CCK - Content Construction Kit - extension for Joomla using Form2Content. There's a free light edition that would be enough.
Form2Content let you setup a content type. You define what fields you want for each content. Then you create a template that will use the info you are going to enter on the fields to built an article layout.
So let's say you are going to create 3 fields like this :
1- Intro text
2- Full text
3- Sidebar
You are going to create a template as we said. each content type will have 2 templates an intro text template and a full text template
The full text template shall be like this :
<div class="content-container">
<div class="content-sidebar">{$SIDEBAR}</div>
<div class="content-fulltext">{$FULLTEXT}</div>
<br clear="both" />
</div>
The {$SIDEBAR} and {$FULLTEXT} are the text you entered in the form and Form2Content will use it to create a regular content with layout.
If you don't want to use another extension or that solution looks too complicated, you could use a javascript solution. For example you could create an HTML module in Joomla and assign its to the sidebar. On this module switch the view to HTML code and enter this:
<div class="content-sidebar"></div>
When you enter an article, switch the view to HTML code and enter the text you want to show on the sidebar and add a class to the paragraph or the div like this :
<p class="special-content">Lorem ipsum dolor<p>
Then use jQuery to append this special text to the sidebar like this :
jQuery(".content-sidebar").append(".special-content");
Note: Joomla does not load jQuery by default, you have to add it on your template or use a plugin.

Resources